17. Graphics Programming - 그래픽 프로그래밍

 

 

 

▶ 그래픽의 종류

 

- 그래픽은 문자나 숫자보다 더 빠르고 쉽게 정보를 전달할 수 있다.

 

- 자바에서 제공하는 그래픽으로는 색상, 폰트, 도형 그리기, 텍스트 출력, java2D 기초 등이 포함된다.

 

- 그래픽 프로그래밍은 두 가지 방법으로 이루어진다. 첫 번째 방법은 전통적인 AWT 패키지를 이용하는 것이고, 두 번째 방법은 최근에 출시된 Java 2D API를 이용하는 것이다. Java 2D를 사용하면 커브 그리기, 도형 회전 및 앤티앨리어싱과 같은 고차원적인 연산들을 할 수 있다.

 

- 자바는 플랫폼에 독립적이기 때문에 자바의 그래픽 모델도 플랫폼에 독립적이다. 즉, 운영체제에 상관없이 어디서나 유사한 모양으로 나타난다.

▶ 그래픽 프로그래밍

 

- 프레임과 패널의 차이를 여기서 느낄 수 있을 것이다. 프레임 위에도 그래픽을 그리는 것이 가능하나 이것은 좋은 방법이 아니다. 프레임의 본 역할은 다른 컴포넌트를 포함하는 컨테이너의 역할로 설계되었기 때문이다.

 

- 그래픽을 컴포넌트 위에 그린 후, 해당 컴포넌트를 프레임 추가하는 것이 적절한 방법이다.

 

- 보편적으로 패널(JPanel) 위에 그래픽을 그린다. 패널은 그림을 그릴 수 있는 서비스를 가지고 있을 뿐만 아니라, 동시에 컨테이너의 역할도 하기 때문에 배경을 그린 후에 버튼과 같은 다른 컴포넌트를 추가할 수 있다. 즉, 사용자 인터페이스(UI)와 그래픽을 동시에 구현할 수 있는 것이다.

 

- paintComponent(Graphics g)

• JComponent의 메소드로 스윙 컴포넌트가 자신의 모양을 다시 그릴 필요가 있을 때마다 호출되는 메소드이다.

• 즉, 사이즈를 변경하거나 프레임이 가려졌다가 다시 나타나게 되면 자바 시스템이 호출한다. 

• 주로 고정 이미지, 라벨, 버튼, 메뉴바 등 항상 바뀌지 않는 컴포넌트가 필요할 때 사용하면 된다.

• 그림을 그리는 코드에 paintComponent 메소드는 반드시 포함되어야 한다! 매개변수로 주어지는 Graphics 객체는 해당 프레임의 그래픽 객체이다. 따라서 선언하지 않아도 된다.

 

- Graphics 클래스 : 그림을 그리는데 필요한 모든 설정값과 그림 그리는 메소드를 가지고 있다. 따라서 자바에서의 모든 그리기는 그래픽 객체에서 이루어져야 한다.

 

- repaint() : paintComponent 메소드는 사용자가 아닌 자동적으로 호출되어야 한다. 따라서 사용자가 화면을 다시 그리고 싶다면 repaint()메소드를 호출하면 된다. 그러면 repaint 메소드는 적절한 시기에 paintComponent 메소드를 호출한다.

 

- super.paintComponent(g) : 이 문장은 그림이 그려지는 컴포넌트가 JPanel이나 JLabel처럼 그래픽 컴포넌트인 경우, paintComponent 메소드를 재정의 할 때 내부에 호출되면 좋은 문장이다. 그래픽 컴포넌트를 상속받았을 때, 부모 클래스가 그려야 될 부분도 있기 때문이다. 자기 그림만 그리고 종료해버리면 부모 클래스는 그릴 기회를 얻지 못한다.

 

- 그래픽 좌표계는 왼쪽 상단이 원점(0, 0)이고, 오른쪽으로 갈수록 x좌표 증가, 왼쪽으로 갈수록 y좌표가 증가한다. 모든 좌표값은 양수이며, 단위는 픽셀(pixel)이다.

 

 

 

▶ 그리기 메소드

 

목적	메소드	설명
직선 그리기	drawLine(int x1, int y1, int x2, int y2)	좌표(x1, y1)에서 좌표(x2, y2)까지 직선을 그린다.
	drawPolyline(int[] xpoints, int[] ypoints,                                             int npoints)	배열 xpoints[]와 배열 ypoints[]을 가지고 여러 개의 직선을 그린다. poygon과 다른 점은 첫 번째 점과 마지막 점이 연결되지 않는다.
사각형 그리기	drawRect(int x, int y, int width, int height)	사각형의 왼쪽 상단 좌표(x, y)를 기준으로 너비 width, 높이 height인 사각형을 그린다.
	fillRect(int x, int y, int width, int height)	사각형의 왼쪽 상단 좌표(x, y)를 기준으로 너비 width, 높이 height인 채워진 사각형을 그린다.
	draw3DRect(int x, int y, int width, int height,                                         boolean rasied)	매개변수 rasied는 3차원 사각형을 볼록하게 보이게 할 것인지(true), 오목하게 보이게 할 것인지 (false)를 지정하며, 나머지 매개변수를 토대로 약간의 3차원 효과를 가미한 사각형을 그린다. 3차원 효과를 내기 위해서는 전경색과 배경색을 잘 선택해야한다.
	fill3DRect(int x, int y, int width, int height,                                         boolean rasied)	매개변수는 draw3DRect 메소드의 것과 똑같은 역할을 하며, 이를 토대로 3차원 효과를 내는 채워진 사각형을 그린다.
	drawRoundRect(int x, int y, int width, int height,                          int arcWidth, int arcHeight)	매개변수 arcWidth와 arcHeight는 사각형의 둥근 모서리에 겹쳐지는 타원에 대한 호의 너비와 호의 높이를 의미한다. 매개변수에 해당하는 둥근 모서리를 가진 사각형을 그린다.
	fillRoundRect(int x, int y, int width, int height,                           int arcWidth, int arcHeight)	매개변수는 drawRoundRect 메소드의 것와 똑은 역할을 하며, 이를 토대로 둥근 모서리를 가진 채워진 사각형을 그린다.
타원 그리기	drawOval(int x, int y, int width, int height)	좌측 상단의 좌표가 (x, y)이며, 너비 width, 높이 height인 사각형 안에 내접하는 타원을 그린다
	fillOval(int x, int y, int width, int height)	매개변수는 drawOval 메소드의 것과 똑같은 역할을 하며, 이를 토대로 채워진 타원을 그린다.
호 그리기	drawArc(int x, int y, int width, int height,                          int startAngle, int arcAngle)	좌측 상단의 좌표가 (x, y)이며, 너비 width, 높이 height의 사각형 안에 내접하는 타원의 호를 startAngle을 시작 각도로 하여 arcAngle의 각도만큼 그린다.
	fillArc(int x, int y, int width, int height,                          int startAngle, int arcAngle)	매개변수는 drawArc 메소드의 것과 똑같은 역할을 하며, 이를 토대로 채워진 호를 그린다.
문자열 그리기	drawString(String s, int x, int y)	매개변수는 출력할 문자열(s)과 문자열의 위치 (x, y)를 의미한다. 폰트가 지정되어 있지 않으면 디폴트 폰트가 사용된다.

 

▶ 색상(Color)

 

생성자	설명
Color(int value)	value는 0~ 255의 중 하나의 값을 가진다.
Color(int r, int g, int b)	r, g, b는 0~ 255의 중 하나의 값을 가진다.
Color(int r, int g, int b, int alpha)	alpha값은 불투명한 정도를 나타낸다. 0이면 투명

- 상수

• Color.black : RGB값이 (0, 0, 0)이다.

• Color.blue : RGB값이 (0, 0, 255)이다.

• Color.cyan : RGB값이 (0, 255, 255)이다.

• Color.red : RGB값이 (255, 0, 0)이다.

• Color.green : RGB값이 (0, 255, 0)이다.

• Color.white : RGB값이 (255, 255, 255)이다.

기타 더 많은 정보는 오라클 사이트에 가면 알 수 있다.

- 아래는 Color가 활용되는 메소드의 예시이다. Color 객체에 정의된 메소드가 아니다.

메소드	설명
void setBackground(Color color)	컴포넌트 객체에서 배경색을 설정한다.
void setColor(Color color)	전경색을 설정한다.
Color getColor()	현재의 전경색을 반환한다.

- 색상 선택기 : 애플리케이션에 따라 사용자로부터 색상을 선택하도록 하는 경우도 많다. 이 때 간편하게 사용할 수 있는 클래스가 JColorChooser 이다. 이 클래스는 색상 팔레트에서 사용자가 쉽게 색상을 선택할 수 있게 한다.

//c는 최초 색상을 나타내는 컬러 변수이다.

//초기 색상을 설정하지 않으면 Color.white를 표시한다.

JColorChooser colorChooser = new JColorChooser(Color c);

 

▶ 폰트(Font)

 

- 윈도우에 문자열을 출력하기 위해 그래픽 객체의 drawString메소드를 호출한다. 

 

- 폰트를 지정하기 위해서는 Font 클래스를 사용한다. 생성자는 매개변수로 폰트 이름, 스타일, 크기를 받는다.

 //Serif폰트의 BOLD 스타일을 가진 크기 24의 폰트를 생성한다.

Font font = new Font(“Serif”, Font.BOLD, 24);

-첫 번째 매개변수로 오는 폰트 이름은 프로그램이 실행되는 컴퓨터에 설치된 모든 폰트가 사용될 수 있다. 그러나 모두에게 설치되지 않은 폰트도 존재하므로 자바에서는 논리적인 폰트를 제공한다.

 

자바에서 제공하는 논리적인 폰트(Font)
Serif	삐침(serif)을 가지지 가변폭 글꼴
SansSerif	삐침(serif)을 가지지 않는 가변폭 글꼴
Monospaced	고정폭을 가지는 글꼴
Dialog	대화상자에서 텍스트 출력을 위하여 사용되는 글꼴
DialogInput	대화상자에서 텍스트 입력을 위하여 사용되는 글꼴

- 폰트 스타일 : 스타일을 조합하고 싶으면 “폰트스타일A | 폰트스타일B”와 같이 한다.

• Font.BOLD : 볼드체
• Font.ITALIC : 이탤릭체
• Font.PLAIN : 표준체

 

- 폰트 설정하기

setFont(Font font) : 컴포넌트나 그래픽 객체에서 폰트를 지정한다.

 

 

 

▶ Graphics2D 클래스

 

- Java2D를 사용하기 위해 Graphcis 클래스를 상속받아 확장하여 향상된 기능을 제공한다.

 

- 광범위한 그래픽 객체를 그릴 수 있다.

 

- 도형의 내부를 그라디언트(gradient)나 무늬로 채울 수 있다.

 

- 문자열을 출력할 때 폰트와 렌더링 과정을 세밀하게 조정할 수 있다.

 

- 이미지를 그릴 수 있꼬 필터링 연산을 적용할 수 있다.

 

- 그래픽 객체들의 충돌을 감지할 수 있는 메커니즘을 제공한다.

 

- 렌더링 중간에 객체들을 조합하거나 변형할 수 있다.

 

- 화면과 프린터에 같은 방법으로 그릴 수 있다.

 

- Graphics2D를 사용하려면, paintComponent 메소드의 매개변수인 Graphics 참조 변수를 Graphics2D 참조 변수로 타입 변환하여 사용하면 된다.

 

- Java 2D에서는 도형들의 좌표를 float형 또는 double형으로 표현한다.

 

- 형상을 그리는 메소드 (모든 도형 클래스들은 Shape인터페이스를 구현한다.)

메소드	설명
draw(Shape s)	도형 객체의 외곽선을 그린다.
fill(Shape s)	도형 객체의 내부를 색상이나 패턴으로 채워서 그린다.
drawString(String s, int x, int y)	문자열을 그린다.
drawImage(Image image, int x, int y, ImageObserver observer)	지정된 이미지를 그린다.

- 그리기의 속성(attribute)을 변경하는 메소드

메소드	설명
setStroke(new BasicStroke(int value))	선의 두께(value)을 설정한다.
setRenderingHint(RenderingHints.KEY_ANTIALASING,                                 RenderingHints.VALUE_ANTIALIAS_ON)	앤티에일리어싱은 도형을 매끄럽게 그리기 위하여 설정한다. 연산 시간은 조금 더 걸리지만 그만큼 그래픽의 품질이 좋아진다.

 

 

▶ 이미지 그리기

 

- 자바는 gif, png, jpeg 타입의 이미지를 화면에 그릴 수 있다.

 

- Java 2D로 작성된 그림을 이미지 파일로 저장할 수 있다.

 

- java.awt.Image : 이미지를 픽셀들의 2차원 배열로 나타내는 수퍼 클래스이다.

 

- java.awt.image.BufferedImage : Image 클래스를 확장한 클래스로 직접 이미지 데이터를 처리할 수 있다. 즉, 픽셀을 읽거나 쓸 수 있다. 애플리케이션은 이 클래스의 객체를 생성하는 것이 좋다.

 

- 이미지 로딩 : 디지털 이미지의 경우, 일반적으로 jpeg나 gif 형식으로 압축되어서 파일 형태로 존재한다. 프로그램에서 제일 먼저 해야 할 일은 이들 파일을 읽어서 내부 형식의 이미지로 변환하는 것이다.

// javax.imageio.ImageI/O 클래스는

// gif,png,jpeg,bmp,wbmp 형식의 이미지 파일을 읽을 수 있다.

BufferedImage img = null;

try {

img = ImageIO.read(new FIle(“sampleimg.jpg”));

} catch (IOException e) { }

- 이미지 그리기 관련 메소드는 자주 사용되는 것 두 가지만 알아보고, 나머지는 아래의 오라클 사이트를 참조하면 오버로딩된 메소드를 알 수 있다.

https://docs.oracle.com/javase/7/docs/api/java/awt/Graphics.html

메소드	설명
boolean drawImage(Image img, int x, int y,                                           ImageObserver observer)	이미지의 좌측 상단(x,y)를 기준으로 이미지를 그린다.  observer는 일반적인 경우에 null을 전달하면 된다.   이 메소드는 전체의 이미지를 화면에 1:1로 매핑하여서 그  리는 것이다.
boolean drawImage(Image img, int dstx1, int dsty1,  int dstx2, int dsty2, int srcx1, int srcy1, int srcx2, int srcy2,                                          ImageObserver observer)	이미지 전체를 그리지 않고 일부만 그리고 싶은 경우에는 이 메소드를 사용한다. src로 시작하는 변수는 원본 이미지에서 그리고 싶은 영역이다. dst로 시작하는 변수들은 화면의 영역을 의미한다. 화면에 그려지는 이미지의 폭과 높이는 (dstx2-dstx1)과 (dsty2-dsty1)으로 계산할 수 있다. 따라서 src 영역과 dst 영역이 다르면 이미지는 늘려지거나 줄여진다.