어서와 Java는 처음이지! 제8장 그래픽 사용자 인터페이스.

Slides:



Advertisements
Similar presentations
6 장 객체 - 지향 설계 ③. 목차 GUI 레이아웃  전화기 키 패드 전화기 키 패드 전화기 키 패드 모양의 GUI 를 만드는 Telephone.java, TelephonePanel.java 를 완성해 보자.  주석을 참고하여 TelephonePanel.java.
Advertisements

제 8 장 그래픽 사용자 인터페이스 어서와 Java 는 처음이지 !. 그래픽 사용자 인터페이스 (Graphical User Interface, 간단히 GUI) 는 컴포넌트들로 구성된다.
목 차 C# 언어 특징 .NET 프레임워크 C# 콘솔 프로그램 C# 윈도우 프로그램 실습 프로그래밍세미나 2.
목차 Contents 무선인터넷용 비밀번호 설정방법 Windows 7 Windows 8 Windows XP MAC OS.
명품 JAVA Programming 제 9 장 자바의 GUI, AWT와 Swing.
명품 JAVA Essential.
어서와 Java는 처음이지! 제20장 실전프로젝트 #2.
어서와 Java는 처음이지! 제12장 스윙 컴포넌트.
명품 JAVA Programming 제 11 장 스윙 컴포넌트와 이벤트 핸들링.
학습목표 이번장에서는 프로그램이 실행되는 환경이 다른 애플리케이션과 애플릿의 차이점을 학습하고, GUI 프로그램을 작성하기 위한 컴포넌트객체 생성과 배치 및  플랫폼(platform)에 따른 룩앤필(look and feel)에 대해서도 학습한다. 또한 컴포넌트에 어떤 동작(이벤트)이.
- 계산기 GUI 구성하기 - 조원: 박강국 오정은 이귀식 김도윤 안영진.
9장. 스윙 프로그래밍.
149개의 실습예제로 배우는 Flash 8.
클래스 class, 객체 object 생성자 constructor 접근 access 제어 이벤트 event 처리.
Java 16장. 스윙 public class SumTest {
안드로이드 앱 개발과정 Step1. 기초과정 강사 : 정 훈 희.
Power Java 제3장 이클립스 사용하기.
최윤정 Java 프로그래밍 클래스 상속 최윤정
레이아웃 관리자 스윙 구성요소 비트박스 프로그램
컴퓨터 프로그래밍 실습 #7 제 4 장 GUI 클래스 작성.
GUI 환경에서 작동하는 프로그램에 대하여 윈도우 프로그램의 작성 방법 그래픽과 이미지 디스플레이 방법 오디오 파일 재생 방법
명품 JAVA Programming.
Part 5 사용자 인터페이스 Chapter 14 : 그래피컬 사용자 인터페이스 Chapter 15 : 이벤트 처리
윤 홍 란 제3장 클래스와 객체의 사용-2 윤 홍 란
Kim heesang JDBC Programming 2 Kim heesang
제 4 장 클래스 작성 Lab 4- 2.
9장 AWT(1).
Java의 정석 제 13 장 AWT와 애플릿 Java 정석 남궁성 강의
Power Java 제19장 배치 관리자(Layout Manager).
Chapter 13 GUI 프로그래밍 01 GUI 화면 구성 02 GUI 이벤트 처리 03 GUI 메뉴와 툴바 예제 모음 요약
Choi Younghwan CSE HUFS
18장 사용자 인터페이스 18.1 AWT(Abstract Window Toolkit) 18.2 컴포넌트의 이벤트 처리
19장 스윙과 이벤트 처리 Section 1 스윙 컴포넌트 Section 2 이미지 아이콘과 라벨
Chapter 12. Awt와 Swing Chapter 13. 배치 관리자 Chapter 14. 이벤트 관리자
Swing 컴포넌트 텍스트 컴포넌트 텍스트 필드 텍스트 영역 스크롤 페인 체크 박스 라디오 버튼.
목 차 1. swing component 특징 및 관련 packages
8.1 인터페이스 개요와 인터페이스 정의 8.2 인터페이스의 사용 8.3 인터페이스의 상속 8.4 인터페이스 참조
9장 다형성 Lab 9-2.
7주차 Android Application.
9장 AWT(1).
JAVA WINDOW PROGRAMMING
Power Java 제14장 배치 관리자.
학습목표 학습목차 다른 홈페이지의 HTML 파일 코드를 보는 방법에 대해 알아봅니다.
그래픽 사용자 인터페이스와 사건처리.
속성과 리스너 초기화 파라미터 외 파라미터에 대해 이해한다. 리스너를 생성해보고 사용에 대해 이해한다.
CHAP 12. 리소스와 보안.
JAVA Canvas Swing.
자바응용.
10장 tkinter로 GUI 만들기.
30강 JAVA 그래픽 JAVA GUI(Graphic User Interface)란? AWT 컴포넌트? Swing 컴포넌트?
HTTP 프로토콜의 요청과 응답 동작을 이해한다. 서블릿 및 JSP 를 알아보고 역할을 이해한다.
CHAP 5. 레이아웃.
Lesson 2. 기본 데이터형.
Chapter6 : JVM과 메모리 6.1 JVM의 구조와 메모리 모델 6.2 프로그램 실행과 메모리 6.3 객체생성과 메모리
그래픽 모듈 편집.
Power Java 제11장 상속.
JA A V W. 06.
Mariadb JDBC PROGRAMMING2
CHAP 21. 전화, SMS, 주소록.
제 4 장 클래스 작성 Lab 4- 2.
단축키 기능 1. 단축키 기능 설명 Alt + R 조회 S 저장 I 삽입 A 추가 D 삭제 P 출력 Q 닫기
안드로이드 앱 개발과정 Step1. 기초과정 강사 : 정 훈 희.
.Net Web Application 2007 컴퓨터공학실험(Ⅰ)
안드로이드 앱 개발과정 Step1. 기초과정 강사 : 정 훈 희.
시스템 인터페이스 Lab1 X-window 및 명령어 사용.
Android -Data Base 윤수진 GyeongSang Univ. IT 1.
Power Java 제14장 배치 관리자.
Chap18 스윙(SWING) Section 1 : 스윙 컴포넌트 Section 2 : 컴포넌트의 이벤트 처리
Presentation transcript:

어서와 Java는 처음이지! 제8장 그래픽 사용자 인터페이스

그래픽 사용자 인터페이스 그래픽 사용자 인터페이스(Graphical User Interface, 간단히 GUI)는 컴포넌트들로 구성된다.

자바에서 GUI의 종류 AWT는 운영 체제가 제공하는 자원을 이용하여서 컴포넌트를 생성 AWT(Abatract Windows Toolkit) GUI 컴포넌트가 자바로 작성되어 있기 때문에 어떤 플랫폼에서도 일관된 화면을 보여줄 수 있다. SWING

AWT와 스윙

AWT와 SWING의 비교 AWT SWING

AWT와 스윙 컴포넌트 AWT 버전 스윙 버전 버튼 Button JButton 레이블 Label JLabel 리스트 List JList ... 패스워드필드 없음 JPasswordField 슬라이더 JSlider

스윙

스윙 클래스 계층구조

스윙의 특징 스윙 GUI 컴포넌트 자바 2D API 데이터 전송 형식화된 텍스트 입력이나 패스워드 필드 동작과 같은 복잡한 기능들이 제공된다. 자바 2D API 그림이나 이미지, 애니메이션 기능을 제공한다. 교체가능한 룩앤필(Look-and-Feel) 지원 데이터 전송 자르기, 복사, 붙이기, 드래그앤 드롭 등의 데이터 전송 기능 제공 되돌리기(undo)와 되풀이(redo) 기능을 손쉽게 제공

스윙 패키지

중간 점검 문제 1. 그래픽 사용자 인터페이스를 구성하는 요소들을 무엇이라고 하는가? 2. AWT와 스윙의 차이점은 무엇인가? 3. 되돌리기, 복사 및 붙여넣기 등도 스윙에서 제공되는가?

컨테이너와 컴포넌트 기본 컴포넌트 컨테이너 컴포넌트 JButton, JLabel, JCheckbox, JChoice, JList, JMenu, JTextField, JScrollbar, JTextArea, JCanvas 등이 여기에 속한다. 컨테이너 컴포넌트 다른 컴포넌트를 안에 포함할 수 있는 컴포넌트로서 JFrame, JDialog, JApplet, JPanel, JScrollPane 등이 여기에 속한다.

컨테이너의 종류 최상위 컨테이너: 절대 다른 컨테이너 안에 포함될 수 없는 컨테이너를 의미한다. 프레임(JFrame), 다이알로그(JDialog), 애플릿(JApplet) 등이 여기에 해당된다. 일반 컨테이너: 다른 컨테이너 안에 포함될 수 있는 컨테이너로 패널(JPanel), 스크롤 페인(JScrollPane) 등을 의미한다.

GUI 작성 절차

프레임 생성 #1 import javax.swing.*; public class FrameTest { public static void main(String[] args) { JFrame f = new JFrame("Frame Test"); f.setSize(300, 200); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } JFrame의 객체 생성

Jframe을 상속하여서 MyFrame을 정의 프레임 생성 #2 import javax.swing.*; public class MyFrame extends JFrame { public MyFrame() { setSize(300, 200); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setTitle("MyFrame"); setVisible(true); } Jframe을 상속하여서 MyFrame을 정의 public class MyFrameTest { public static void main(String[] args) { MyFrame f = new MyFrame(); } MyFrame의 객체 생성

Jframe을 상속하여서 MyFrame을 정의 프레임 생성 #3 Jframe을 상속하여서 MyFrame을 정의 import javax.swing.*; public class MyFrame extends JFrame { public MyFrame() { setSize(300, 200); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setTitle("MyFrame"); setVisible(true); } public static void main(String[] args) { MyFrame f = new MyFrame(); main()이 MyFrame 안으로 이동

컴포넌트 생성과 추가 import javax.swing.*; import java.awt.FlowLayout; public class MyFrame extends JFrame { public MyFrame() { setSize(300, 200); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setTitle("MyFrame"); setLayout(new FlowLayout()); JButton button = new JButton("버튼"); this.add(button); setVisible(true); } 배치 관리자 설정! 컴포넌트 생성 및 추가 public class MyFrameTest { public static void main(String[] args) { MyFrame f = new MyFrame(); }

JFrame 클래스 컨테이너는 컴포넌트들을 트리(tree) 형태로 저장한다. 최상위 컨테이너는 이 트리의 루트 노드가 된다. 최상위 컨테이너는 내부에 콘텐트 페인(content pane)을 가지고 있다. 여기에 화면에 보이는 컴포넌트를 저장한다. 최상위 컨테이너에는 메뉴바를 추가할 수 있다.

프레임의 속성 변경하기 프레임의 속성을 변경시키는 방법을 생각하여 보자. 조상 클래스들의 메소드도 사용할 수 있다!

조상 클래스 Component Container Window Frame JFrame 컴포넌트 클래스는 화면에 표시되어서 사용자와 상호 작용하는 시각적인 객체를 나타낸다. Container 내부에 다른 컴포넌트를 추가할 수 있는 기능을 제공한다. 예를 들어서 이 클래스의 add()를 사용하면 컨테이너 안에 컴포넌트를 추가할 수 있다. Window 경계선, 타이틀 바, 버튼을 가지고 있는 윈도우를 정의한다. Frame 자바 GUI 애플리케이션의 기초가 된다. JFrame Frame 클래스를 스윙의 출시에 맞추어 변경한 것이다.

중요한 메소드 setLocation(x, y) , setBounds(x, y, width, height), setSize(width, height) 프레임의 위치와 크기를 설정한다. setIconImage(IconImage) 윈도우 시스템에 타이틀 바, 태스크 스위처에 표시할 아이콘을 알려준다. setTitle() 타이틀 바의 제목을 변경한다. setResizable(boolean) 사용자가 크기를 조절할 수 있는지를 설정한다.

예제 public class MyFrame extends JFrame { public MyFrame() { Toolkit kit = Toolkit.getDefaultToolkit(); Dimension screenSize = kit.getScreenSize(); setSize(300, 200); setLocation(screenSize.width / 2, screenSize.height / 2); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setTitle("MyFrame"); Image img = kit.getImage("icon.gif"); setIconImage(img); setLayout(new FlowLayout()); JButton button = new JButton("버튼"); this.add(button); setVisible(true); }

실행 결과

기초 컴포넌트 패널(panel) 레이블(label) 버튼(button) 텍스트 필드(text field)

패널 패널(panel)은 컴포넌트들을 포함하고 있도록 설계된 컨테이너 중의 하나이다

패널의 용도 예를 들어서 다음과 같이 화면을 2개로 나누어서 표시하고자 할 때 패널을 사용할 수있다.

레이블 레이블(Label)은 편집이 불가능한 텍스트를 표시. (예) JLabel label = new JLabel(“안녕하세요?”);

텍스트 필드 텍스트 필드(text field)는 입력이 가능한 한 줄의 텍스트 필드를 만드는 데 사용

버튼 버튼은 사용자가 클릭했을 경우, 이벤트를 발생하여 원하는 동작을 하게 하는데 이용된다

버튼의 종류 JButton - 가장 일반적인 버튼이다. JCheckBox - 체크박스 버튼 JRadioButton - 라디오 버튼으로 그룹 중의 하나의 버튼만 체크할 수 있다.

배치 관리자(layout manager) 컨테이너 안의 각 컴포넌트의 위치와 크기를 결정하는 작업 [32/70]

상당히 다르게 보인다. 배치 관리자에 따라서 같은 애플리케이션도 상당히 다르게 보인다.

배치 관리자의 종류 FlowLayout GridLayout

배치 관리자의 종류 BorderLayout BoxLayout

FlowLayout 컴포넌트들을 왼쪽에서 오른쪽으로 버튼을 배치한다. 패널과 애플릿의 디폴트 배치 관리자이다.

BorderLayout BorderLayout은 5개의 영역으로 구분하고 각각의 영역에 컴포넌트를 배치 PAGE_START (또는 NORTH) PAGE_END (또는 SOUTH) LINE_START (또는 WEST) LINE_END (또는 EAST) CENTER

BorderLayout 클래스 생성자 또는 메소드 설명 BorderLayout(int hgap, int vgap) 컴포넌트 사이의 수평 간격 hgap과 수직 간격 vgap을 을 가지는 BorderLayout 객체 생성 setHgap(int) 컴포넌트 사이의 수평 간격 설정(단위는 픽셀) setVgap(int) 컴포넌트 사이의 수직 간격 설정

BorderLayout 예제 import java.awt.*; import javax.swing.*; class MyFrame extends JFrame { public MyFrame() { setTitle("BorderLayoutTest"); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // 프레임은 디폴트로 BorderLayout 이므로 사실은 불필요 setLayout(new BorderLayout()); // 버튼을 추가한다. add(new JButton("Center"), BorderLayout.CENTER); add(new JButton("Line Start"), BorderLayout.LINE_START); add(new JButton("Line End"), BorderLayout.LINE_END); add(new JButton("Page Start"), BorderLayout.PAGE_START); add(new JButton("Page End"), BorderLayout.PAGE_END); pack(); setVisible(true); }

GridLayout GridLayout은 컴포넌트들을 격자 모양으로 배치한다.

GridLayout 클래스 생성자 설명 GridLayout(int rows, int cols) rows 행과 cols 열을 가지는 GridLayout 객체를 생성한다. 만약 rows나 cols가 0이면 필요한 만큼의 행이나 열이 만들어진다. GridLayout(int rows, int cols, int hgap, int vgap) rows 행과 cols 열을 가지는 GridLayout 객체를 생성한다. hgap과 vgap은 컴포넌트 사이의 수평 간격과 수직 간격으로 단위는 픽셀이다.

GridLayout 예제 import java.awt.*; import javax.swing.*; class MyFrame extends JFrame { public MyFrame() { setTitle("GridLayoutTest"); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setLayout(new GridLayout(0, 3)); // 3개의 열과 필요한 만큼의 행 add(new JButton("Button1")); add(new JButton("Button2")); add(new JButton("Button3")); add(new JButton("B4")); add(new JButton("Long Button5")); pack(); setVisible(true); }

절대 위치 예제 import java.awt.*; import java.awt.event.*; import javax.swing.*; class MyFrame extends JFrame { JButton b1; private JButton b2, b3; public MyFrame() { setTitle("Absolute Position Test"); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setSize(300, 200); JPanel p = new JPanel(); p.setLayout(null); b1 = new JButton("Button #1"); p.add(b1); b2 = new JButton("Button #2"); p.add(b2); b3 = new JButton("Button #3"); p.add(b3);

절대 위치 예제 b1.setBounds(20, 5, 95, 30); b2.setBounds(55, 45, 105, 70); add(p); setVisible(true); } public class AbsoluteTest { public static void main(String args[]) { MyFrame f=new MyFrame();

Q & A