14 장 . 그래피컬 사용자 인터페이스

1. 14장. 그래피컬 사용자인터페이스 Java public class SumTest { public static void main(String a1[]) { int a, b, sum; a = Integer.parseInt(a1[0]); b = Integer.parseInt(a1[1]); sum = a + b ; // 두 수를 더하는 부분입니다 System.out.println("두수의 합은 " + sum + "입니다"); } }

2. 학습목표

3. 목차 • section 1 AWT와 스윙(Swing) • 1-1 AWT(Abstract Window Toolkit) • 1-2 스윙(Swing) • section 2 AWT 패키지와 주요 클래스 • 2-1 java.awt 패키지 • 2-2 Component 클래스 • 2-3 Container 클래스 • section 3 프레임(Frame)

4. 목차 • section 4 배치관리자 (Layout Manager) • 4-1 FlowLayout클래스 • 4-2 BorderLayout클래스 • 4-3 GridLayout클래스 • section 5 패널(Panel) • section 6 패널에서의 그래픽 사용 • section 7 색의 사용 • section 8 글꼴(Font)의 사용

5. 1 AWT와 스윙(Swing) 1-1 TCP/IP(Transmission Control Protocol/Internet Protocol) • 사용자 인터페이스(User Interface) • 일반적인 응용 프로그램이나 웹 프로그램에서 사용자가 접속하는 부분 • GUI(Graphical User Interface) • 사용자 인터페이스에 다양한 그래픽을 적용한 것 • “goo-ee”라고 부름

6. 1 AWT와 스윙(Swing) 1-1 AWT(Abstract Window Toolkit) • AWT(Abstract Window Toolkit) • 자바 언어는 초기에 GUI를 제공하기 위해 패키지를 제공 • 윈도와 Linux에서 실행된 AWT 컴포넌트의 예 462 page

7. 1 AWT와 스윙(Swing) 1-2 스윙(Swing) • 스윙(Swing) • 선(sun)사가 넷스케이프사와 공동으로 개발한 새로운 그래픽 툴킷(toolkit) • 자바의 표준 클래스인 JFC(Java Foundation Classes)로 제공되고 있으며 JDK에 포함 • 스윙은 AWT와 달리 그래픽을 JVM이 자체적으로 처리

8. 1 AWT와 스윙(Swing) 1-2 스윙(Swing) • AWT 패키지와 스윙 패키지의 관련도 463 page

9. 1 AWT와 스윙(Swing) 1-2 스윙(Swing) • 스윙 컴포넌트의 예 463 page

10. 2 AWT 패키지와 주요 클래스 2-1 java.awt 패키지 • java.awt 패키지 • GUI 구축을 위한 컴포넌트 클래스뿐만 아니라 다른 클래스들도 많이 제공 • java.awt 패키지에서 제공되는 클래스들의 유형별 분류

11. 2 AWT 패키지와 주요 클래스 2-2 Component 클래스 • Component 클래스 • 추상 클래스로 • 그래피컬 사용자 인터페이스(GUI) 구축에 필요한 많은 하위 클래스를 가지고 있음 • 약 100여 개의 메소드가 제공

12. 2 AWT 패키지와 주요 클래스 2-2 Component 클래스 • Component 클래스의 주요 메소드

13. 2 AWT 패키지와 주요 클래스 2-3 Container 클래스 • Container 클래스 • Component 클래스의 하위 클래스로서 컴포넌트를 담는 쟁반 역할을 하는 클래스 • 사용되는 쟁반 역할을 하는 클래스는 JFrame, JPanel, Applet, JApplet클래스

14. 2 AWT 패키지와 주요 클래스 2-3 Container 클래스 • Container 클래스의 주요 메소드

15. 3 프레임(Frame) • 응용 프로그램에서 GUI를 구축하기 위해서는 프레임 클래스를 이용 • JFrame클래스 • Component → Container → Window → Frame → JFrame형태로 상속된 클래스 • JFrame클래스 생성자 public JFrame() public JFrame(String title) 형식

16. 3 프레임(Frame) • JFrame클래스의 메소드

17. 3 프레임(Frame) • 실습예제 • 프로그램 설명 • 01 : 프로그램에서는 JFrame클래스를 사용하기 위해 swing 패키지를 포함시킨다. • 04 : “Test Frame” 제목을 가지고 프레임 객체를 생성하였다. • 05~06 : JFrame클래스의 상위 클래스인 Component 클래스에 선언된 메소드이다. setSize() 메소드는 프레임의 크기를 설정하는 메소드이고, setVisible() 메소드는 컴포넌트를 화면에 나타내는 메소드이다. swing 패키지를 포함 객체(프레임) 크기 설정 객체를 나타냄 JFrame클래스로부터 객체 생성

18. 3 프레임(Frame)

19. 3 프레임(Frame) • 실습예제 swing 패키지를 포함 버튼을 쟁반에 추가 awt패키지 포함 Container(쟁반 역할) 객체 생성 버튼 객체 생성

20. 3 프레임(Frame) • 프로그램 설명 • 01~02 : JFrame, JButton클래스들은 swing 패키지에 속한 클래스이고, Container 클래스는 awt패키지에 속한 클래스이다. 두 개의 패키지를 포함하여 프로그램을 작성하였다. • 06 : Container 클래스는 그릇을 담는 쟁반 역할을 수행하는 클래스이다. getContentPane() 메소드는JFrame클래스에 선언된 메소드로서Container 클래스의 객체를 반환하는 메소드이다. jf.getContentPane() 메소드는jf(프레임 객체)와 연관된 Container 객체를 반환한다. Container 객체는 그릇 역할을 하므로 이 컨테이너에 추가되는 모든 컴포넌트들은 프레임에 나타나게 된다. • 07 : JButton클래스로 버튼 객체를 생성하였다(16장에서 JButton클래스 설명). • 08 : 생성된 버튼 객체를 Container 객체에 추가하였다.

21. 3 프레임(Frame)

22. 4 배치관리자(Layout Manager) • 배치관리자 • 애플릿이나 컨테이너에 컴포넌트를 자동으로 배치 • 프로그램 작성자는 컴포넌트가 위치할 좌표를 계산할 필요가 없음 • 사용자가 애플릿의 크기를 변형시켰을 때도 배치관리자는 재배치를 자동으로 수행

23. 4 배치관리자(Layout Manager) 4-1 FlowLayout클래스 • FlowLayout클래스 생성자 FlowLayout() FlowLayout(int align) FlowLayout(int align, inthgap, intvgap) 형식

24. 4 배치관리자(Layout Manager) 4-1 FlowLayout클래스 • 실습예제 쟁반에 버튼 15개 추가 객체 변수 없이 객체 생성 JFrame클래스로부터 상속 생성자 Container(쟁반 역할) 객체 생성 오른쪽 정렬 layout 객체 생성 쟁반 객체에 layout 설정

25. 4 배치관리자(Layout Manager) 4-1 FlowLayout클래스 • 프로그램 설명 • 03 : JFrame클래스로부터 상속받아 클래스를 생성하였다. JFrame클래스의 모든 특성을 상속받는다. • 05 : 객체 변수 없이 getContentPane() 메소드가 사용되었다. 메소드 앞에 객체 변수명이 없을 경우는 현재의 객체를 의미한다. 즉 현재 클래스에서 이 메소드를 탐색하고 없으면 상위 클래스로 가서 탐색하여야 한다. 이 메소드는 JFrame클래스에서 선언된 메소드이다. 프레임과 연관된 Container 객체를 반환한다. • 06 : layout 객체를 생성한다. FlowLayout클래스의 생성자를 이용하여 오른쪽 정렬과 버튼 사이의 간격을 지정하여 객체를 생성하였다. • 07 : 생성된 layout 객체를 이용하여 쟁반 객체인 Container 객체의 정렬 방법을 설정하였다. • 08~09 : 설정된 쟁반 객체에 15개의 버튼을 생성하여 추가하였다. • 18 : 객체 변수 없이 클래스로부터 객체를 생성하는 문장이다. 객체 변수가 필요하지 않을 경우 위와 같이 객체만 생성하면 된다.

26. 4 배치관리자(Layout Manager) 4-1 FlowLayout클래스

27. 4 배치관리자(Layout Manager) 4-2 BorderLayout클래스 • BorderLayout클래스 • 컴포넌트를 프레임에 추가할 때 방향을 지정하여 추가할 수 있도록 해주는 클래스 • BorderLayout클래스 생성자 BorderLayout() BorderLayout(inthgap, intvgap) 형식

28. 4 배치관리자(Layout Manager) 4-2 BorderLayout클래스 • 실습예제 BorderLayout객체 생성 (수직 수평 간격 10) 쟁반 객체에 layout 설정 쟁반에 버튼 5개 방향 지정하여 추가

29. 4 배치관리자(Layout Manager) 4-2 BorderLayout클래스 • 실습예제

30. 4 배치관리자(Layout Manager) 4-2 BorderLayout클래스 • 프로그램 설명 • 06 : BorderLayout클래스로부터 객체를 생성하였다. 각 요소들의 수직, 수평 간격을 10픽셀로 지정하였다. • 07 : 생성된 layout 객체를 이용하여 쟁반 객체인 Container 객체의 정렬 방법을 설정하였다. • 08~12 : 설정된 쟁반 객체에 5개의 버튼을 생성하여 추가하였다. 각각의 버튼은 배치 방향이 설정되어 생성되었다.

31. 4 배치관리자(Layout Manager) 4-2 BorderLayout클래스

32. 4 배치관리자(Layout Manager) 4-3 GridLayout클래스 • GridLayout클래스 • 컴포넌트를 행과 열을 가진 배열 형태로 배치 • GridLayout클래스 생성자 GridLayout() GridLayout(int rows, int cols) GridLayout(int rows, int cols, inthgap, intvgap) 형식

33. 4 배치관리자(Layout Manager) 4-3 GridLayout클래스 • 실습예제 GridLayout객체 생성 (3행 5열, 수직 수평 간격 10)

34. 4 배치관리자(Layout Manager) 4-3 GridLayout클래스 • 프로그램 설명 • 00 : GridLayout클래스로부터 객체를 생성하였다. 각 요소들을 3행 5열로 배치하도록 설정하였고, 각 요소들의 수직, 수평 간격을 10픽셀로 지정하였다.

35. 5 패널(Panel) • Frame, Container, Panel의 관계 • Frame에 연관된 Container 객체를 지정 • Container 객체에는 다수 개의 Panel 객체를 생성 478 page

36. 5 패널(Panel) • 실습문제 Frame과 연관된 Container 객체 생성 BorderLayout으로 설정 JPanel객체 생성 JPanel객체에 GridLayout설정(5행 1열) 또 다른 패널 객체 생성 Radio 버튼을 패널 객체에 추가

37. 5 패널(Panel) • 실습문제 두 개의 패널을 Container에 추가(방향 지정)

38. 5 패널(Panel) • 프로그램 설명 • 05 : JFrame으로부터 상속받아 객체를 생성하였다. • 06 : Container 객체의 레이아웃을 BorderLayout으로 설정하였다. • 07 : JPanel클래스로부터 객체를 생성하였다. • 08 : JPanel객체의 레이아웃을 GridLayout으로 설정하였다. 5행 1열로 설정하였다. • 09~13 : JPanel객체에 Radio 버튼 객체를 생성하여 추가하였다. • 21~22 : 작성한 두 개의 패널 객체를 Container 객체에 추가하였다. 각 패널을 추가하면서 방향을 지정하여 배치하였다.

39. 5 패널(Panel)

40. 6 패널에서의 그래픽 사용 • paintComponent메소드 protected void paintComponent(Graphics g) JPanel클래스로부터 상속 상위 클래스의 paintComponent() 메소드 호출 다양한 그래픽 기능 사용 메소드오버라이딩 형식

41. 6 패널에서의 그래픽 사용 • Graphics 클래스 • java.awt 패키지에 포함된 클래스(java.awt.Graphics) • 윈도에 다양한 그래픽을 나타낼 수 있는 많은 메소드를 제공 • 적합한 메소드를 이용하여 선, 사각형, 원, 원호, 그림, 문자 등 많은 그래픽 기능을 사용 • Graphics 클래스에는 약 40여 개의 메소드가 정의

42. 6 패널에서의 그래픽 사용 • Graphics 클래스의 주요 메소드

43. 6 패널에서의 그래픽 사용 • Graphics 클래스의 주요 메소드

44. 6 패널에서의 그래픽 사용 • 실습예제 Graphics 객체 g를 이용하여 그린다 그림을 그릴 수 있는 클래스 작성(JPanel클래스로부터 상속) paintComponent() 메소드를오버라이딩 상위 클래스의 paintComponent() 메소드 호출

45. 6 패널에서의 그래픽 사용 • 실습예제 JFrame클래스로부터 상속받아 클래스 작성 LineTestPanel클래스로부터 객체를 생성 생성된 패널 객체를 프레임에 추가

46. 6 패널에서의 그래픽 사용 • 프로그램 설명 • 03 : 우선 그림을 그리기 위한 객체를 만들기 위해서는 반드시 JPanel클래스로부터 상속받아 클래스를 작성해야 한다. • 04 : paintComponent(Graphics g) 메소드를오버라이딩하였다. 이 메소드는 JPanel클래스(상속된 클래스 포함)로부터 객체가 생성될 때 자동으로 수행되는 메소드이다. 이 메소드는 매개변수로 Graphics 클래스의 객체를 가지며, 이 Graphics 객체를 이용하여 다양한 그래픽 기능을 수행할 수 있다. Graphics 클래스는 java.awt 패키지에 속하는 클래스이며 다양한 그래픽 메소드들을 제공하고 있다. • 05 : 상위 클래스의 paintComponent() 메소드를 호출하며, 이 메소드는 현재의 패널과 Graphics 객체를 연동시키는 역할을 수행한다. • 06~11 : Graphics 객체를 이용하여 라인을 그린다. • 14 : 프레임 클래스를 생성한다. • 18~19 : LineTestPanel클래스로부터 객체를 생성하여, 프레임에 추가한다. • 27 : 메인 클래스에서 LineTestFrame클래스의 객체를 생성한다. 프레임 객체는 패널 객체를 생성하게 되고, 패널 객체가 생성되면 paintComponent() 메소드가 자동으로 수행되어 그림이 그려지게 된다.

47. 6 패널에서의 그래픽 사용

48. 6 패널에서의 그래픽 사용 • 실습예제 다양한 사각형을 그린다

49. 6 패널에서의 그래픽 사용 • 실습예제 객체의 생성과 추가를 하나의 문장으로 작성

50. 6 패널에서의 그래픽 사용 • 프로그램 설명 • 06~08 : Graphics 객체를 이용하여 다양한 사각형을 그린다. 프로그램의 다른 부분은 이전 프로그램과 같다. • 16 : 객체를 생성하는 문장과 생성된 객체를 프레임에 추가하는 문장을 하나로 작성하여 기술하였다.