본문 바로가기
Programming/Java프로그래밍및실습

[자프실] 8. 자바 GUI 스윙 기초

by Lizardee 2024. 1. 10.
8.1 자바의 GUI
GUI 응용프로그램이란?

▶ GUI(Graphical User Interface)

: 사용자가 편리하게 입출력할 수 있도록 그래픽 화면을 구성하고, 마우스나 키보드로 입력받을 수 있도록 지원하는 사용자 인터페이스

 

AWT와 Swing 패키지

▶ GUI 컴포넌트: GUI 기반의 응용프로그램을 쉽게 작성할 수 있도록 한다.

  • AWT(Abstract Windowing Toolkit)
  • 스윙(Swing): 경량 컴포넌트(light weight component), 현재 자바의 GUI로 사용된다.

 

스윙 GUI 응용프로그램 샘플

스윙 GUI 응용프로그램 샘플

 


8.2 자바의 GUI 패키지
GUI 패키지 계층 구조

GUI 패키지 계층 구조

: Object - Component - Container - JComponent

  • 모든 GUI 컴포넌트들은 Component 클래스를 반드시 상속받는다. 
  • 그 중에서 스윙 컴포넌트의 클래스명은 모두 J로 시작하며, JComponent를 상속받는 것들과 JApplet, JFrame, JDialog 들이다.

 

컨테이너와 컴포넌트
  • 컨테이너: 다른 컴포넌트를 포함할 수 있는 GUI 컴포넌트
  • 컴포넌트: 컨테이너에 포함되어야 화면에 출력될 수 있는 GUI 객체
  • 최상위 컨테이너: 다른 컨테이너에 포함되지 않고도 화면에 출력되며, 독립적으로 존재 가능한 컨테이너

최상위 컨테이너 - 컨테이너 - 컴포넌트

 


8.3 스윙 GUI 프로그램 만들기

▶ 스윙 GUI 프로그램을 만드는 과정:

  1. 스윙 프레임 만들기
  2. main() 메소드 작성
  3. 스윙 프레임에 스윙 컴포넌트 붙이기
스윙 패키지 import
import java.awt.*;  // 그래픽 처리를 위한 클래스들의 경로명
import java.awt.event.*;  // AwT 이벤트 사용을 위한 경로명
import javax.swing.*;  // 스윙 컴포넌트 클래스들의 경로명
import javax.swing.event.*;  // 스윙 이벤트를 위한 경로명

 

스윙 프레임과 컨텐트팬
  • 스윙 프레임: 모든 스윙 컴포넌트를 담는 최상위 컨테이너
    • 프레임: 스윙 프로그램의 기본 틀
    • 메뉴바: 메뉴들이 부착되는 공간
    • 컨텐트팬: GUI 컴포넌트들이 부착되는 공간

스윙 프레임(JFram)의 구성

 

프레임 만들기, JFrame 클래스 상속
/*
 * 예제8-1: 300x300 크기의 스윙 프레임 만들기
 */

import javax.swing.*;

//스윙 응용프로그램의 프레임은 JFrame을 상속받아 만듦
public class MyFrame extends JFrame {  
	public MyFrame() {
		setTitle("300x300 스윙 프레임 만들기");  // 프레임 타이틀 설정
		setSize(300,300);  // 프레임 크기 설정: 300x300
		setVisible(true);  // 프레임 출력
	}
	
	public static void main(String[] args) {
		MyFrame frame = new MyFrame();  // 스윙 프레임 생성
	}
}

 

스윙 응용프로그램에서 main() 메소드의 기능과 위치

: 스윙 응용 프로그램에서 main()의 기능은 최소화하는 것이 좋다. 스윙 프로그램이 실행되는 시점으로서, main()의 기능은 프레임을 생성하는 코드 정도 구현하여 프레임 클래스 내에 작성하는 것이 좋다.

public static void main(String[] args){
  MyFrame frame = new MyFrame();  // 스윙 프레임 생성
}

 

프레임에 컴포넌트 붙이기

▶ 타이틀 달기

// 타이틀 달기 1) super()

public MyFrame(){
  super("타이틀문자열");  // JFrame("타이틀문자열") 생성자 호출
}
// 타이틀 달기 2) setTitle() 메소드 이용

public MyFrame(){
  setTitile("타이틀문자열");  // 타이틀 달기
}

 

▶ 메뉴 만들어 붙이기

: 메뉴바를 만들고, 메뉴를 만들어 붙인다.

 

컨텐트팬에 컴포넌트 달기

// 컨텐트팬에 컴포넌트 달기: getContentPane() 메소드 호출

public class MyFrame extends JFrame {
  public MyFrame() {
    ...
    Container contentPane = getContentPane();  // 프레임의 컨텐트팬을 알아낸다.
    
    ...
  }
}

 

▶ 컨텐트팬의 변경

: 프레임에 붙어 있는 컨텐트팬을 제거하고 새 컨텐트팬을 만들어 붙일 수 있다.

class MyPanel extends JPanel {
  // JPanel을 상속받은 패널을 구현한다.
}
frame.setContentPane(new MyPanel());  // frame의 컨텐트팬을 MyPanel 객체로 변경

 

/*
 * 예제 8-2: 3개의 버튼 컴포넌트를 가진 스윙 프레임 만들기
 */

import javax.swing.*;
import java.awt.*;

public class ContentPaneEx extends JFrame {
	public ContentPaneEx() {
		setTitle("ContentPane과 JFrame 예제");  // 프레임의 타이틀 달기
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);  // 프레임 윈도우를 닫으면 프로그램 종료
		
		Container contentPane = getContentPane();  // 컨텐트팬을 알아낸다.
		contentPane.setBackground(Color.ORANGE);  // 오렌지색 배경 설정
		contentPane.setLayout(new FlowLayout());  // 컨텐트팬에 FlowLayout 배치관리자 달기
		
		// 버튼 달기
		contentPane.add(new JButton("OK"));  
		contentPane.add(new JButton("Cancel"));
		contentPane.add(new JButton("Ignore"));
		
		setSize(300,150);  // 프레임 크기 설정
		setVisible(true);  // 화면에 프레임 출력
	}
	
	public static void main(String[] args) {
		new ContentPaneEx();
	}
}

 

스윙 응용프로그램의 종료
System.exit(0);  // 자바 프로그램을 종료한다.
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// 프레임 윈도우가 닫힐 때 프로그램도 함께 종료한다.

 


8.4 컨테이너(Container)와 배치(Layout)
컨테이너와 배치 개념

: 컨테이너에 부착되는 컴포넌트의 위치와 크기는 컨테이너 내부에 있는 배치관리자(Layout Manager)에 의해 결정된다.

 

배치관리자의 종류

: 배치관리자는 java.awt 패키지들의 클래스들이다.

import java.awt.*;

 

▶ 4가지 대표적인 배치관리자

4가지 대표적인 배치관리자

  • FlowLayout: 컴포넌트가 삽입되는 순서대로 왼쪽에서 오른쪽으로 배치한다.
  • BorderLayout: 동, 서, 남, 북, 중앙 5개의 영역 중 응용프로그램에서 지정한 영역에 컴포넌트를 배치한다.
  • GridLayout: 컨테이너를 프로그램에서 설정한 동일한 크기의 2차원 격차로 나누고, 컴포넌트는 삽입 순서대로 좌, 우, 위, 아래로 배치한다.
  • CardLayout: 컨테이너의 공간에 카드를 쌓아 놓은 듯이 컴포넌트를 포개어 배치한다.

 

컨테이너의 디폴트 배치관리자

: 컨테이너가 생성될 때 자동으로 디폴트 배치관리자가 생성된다.

컨테이너의 디폴트 배치관리자

 

컨테이너에 새로운 배치관리자 설정, setLayout() 메소드

: Container 클래스의 setLayout() 메소드를 호출하면, 컨테이너에 새로운 배치관리자를 설정할 수 있다.

컨테이너에 새로운 배치관리자 설정

 


8.5 FlowLayout 배치관리자
배치 방법

배치 방법

 

FlowLayout의 생성자

FlowLayout의 생성자

/*
 * 예제 8-3: FlowLayout 배치관리자를 사용하여 5개의 버튼 배치
 */

import javax.swing.*;
import java.awt.*;

public class FlowLayoutEx extends JFrame {
	public FlowLayoutEx() {
		setTitle("FlowLayout 예제");
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		Container contentPane = getContentPane();  // 컨텐트팬 알아내기
		
		// 왼쪽 정렬로, 수평 간격을 30, 수직 간격을 40 픽셀로 배치하는 FlowLayout 생성
		contentPane.setLayout(new FlowLayout(FlowLayout.LEFT, 30, 40));
		
		contentPane.add(new JButton("add"));
		contentPane.add(new JButton("sub"));
		contentPane.add(new JButton("mul"));
		contentPane.add(new JButton("div"));
		contentPane.add(new JButton("Calculate"));
		
		setSize(300, 200);  // 프레임 크기 300x200 설정
		setVisible(true);  // 화면에 프레임 출력
	}
	
	public static void main(String[] args) {
		new FlowLayoutEx();
	}
}

 


8.6 BorderLayout 배치관리자
배치 방법

배치 방법
add() 메소드

 

BorderLayout의 생성자

BorderLayout의 생성자

/*
 * 예제 8-4: BorderLayout 배치관리자를 사용하여 5개의 버튼 배치
 */

import javax.swing.*;
import java.awt.*;

public class BorderLayoutEx extends JFrame {
	public BorderLayoutEx() {
		setTitle("BorderLayout 예제");
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		Container contentPane = getContentPane();  // 컨텐트팬 알아내기
		
		// 컨텐트팬에 BorderLayout 배치관리자 설정
		contentPane.setLayout(new BorderLayout(30,20));
		
		contentPane.add(new JButton("Calculate"), BorderLayout.CENTER);
		contentPane.add(new JButton("add"), BorderLayout.NORTH);
		contentPane.add(new JButton("sub"), BorderLayout.SOUTH);
		contentPane.add(new JButton("mul"), BorderLayout.EAST);
		contentPane.add(new JButton("div"), BorderLayout.WEST);
		
		setSize(300, 200);  // 프레임 크기 설정
		setVisible(true);
	}
	public static void main(String[] args) {
		new BorderLayoutEx();
	}
}

 


8.7 GridLayout 배치관리자
배치 방법

배치 방법

 

GridLayout의 생성자

GridLayout의 생성자

/*
 * 예제 8-5: GridLayout 배치관리자를 활용하여
 * 한 줄에 10개의 버튼을 동일한 크기로 배치하는 스윙 프로그램
 */

import java.awt.*;
import javax.swing.*;

public class GridLayoutEx extends JFrame {
	public GridLayoutEx() {
		super("GridLayout 예제");
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		Container contentPane = getContentPane();  // 컨텐트팬 알아내기
		
		contentPane.setLayout(new GridLayout(1,10));
		
		for(int i=0; i<10; i++) {  // 10개의 버튼 부착
			String text = Integer.toString(i);  // 정수 i를 문자열로 변환
			JButton button = new JButton(text);  // 버튼 컴포넌트 생성
			contentPane.add(button);  // 컨텐트팬에 버튼 부착
		}
		setSize(500,200);
		setVisible(true);
	}
	public static void main(String[] args) {
		new GridLayoutEx();
	}
}

 


8.8 배치관리자가 없는 컨테이너
배치관리자 없는 컨테이너가 필요한 경우

: 응용프로그램에서 직접 컴포넌트의 크기와 위치를 결정하고자 하는 경우

 

컨테이너의 배치관리자 제거

컨테이너의 배치관리자 제거

 

컴포넌트의 절대 위치와 크기 설정
void setSize(int width, int height)  // 컴포넌트 크기 설정
void setLocation(int x, int y)  // 컴포넌트의 왼쪽 상단 모서리의 좌표를 (x,y)로 설정
void setBounds(int x, int y, int width, int height)  // 크기와 위치 동시 설정

 

/*
 * 예제 8-6: 배치관리자 없는 컨테이너에 컴포넌트를 절대위치와 절대크기로 지정
 */

import javax.swing.*;
import java.awt.*;

public class NullContainerEx extends JFrame {
	public NullContainerEx() {
		setTitle("배치관리자 없이 절대 위치에 배치하는 예제");
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		Container contentPane = getContentPane();  // 컨텐트팬 알아내기
		
		contentPane.setLayout(null);  // 컨텐트팬의 배치관리자 제거
		
		// JLabel 컴포넌트 생성하고 직접 위치와 크기를 지정한다.
		JLabel la = new JLabel("Hello, Press Buttons!");
		la.setLocation(130, 50);  // la를 (130, 50) 위치로 지정
		la.setSize(200,20);  // la를 (200x20) 크기로 지정
		contentPane.add(la);  // la를 컨텐트팬에 부착
		
		// 9개의 버튼 컴포넌트를 생성하고 동일한 크기로 설정한다.
		// 위치는 서로 겹치게 설정한다.
		for(int i=1; i<9; i++) {
			JButton b = new JButton(Integer.toString(i));  // 버튼 생성
			b.setLocation(i*15, i*15);
			b.setSize(50, 20);  // 버튼의 크기는 동일하게 50x20
			contentPane.add(b);
		}
		setSize(300,200);
		setVisible(true);
	}
	public static void main(String[] args) {
		new NullContainerEx();
	}
}