Java GUI(AWT, Swing) - Layout

 * 배치관리자(Layout)?

 - 화면(Frame)에 컴포넌트들을 배치하는 방법을 알려주는 관리자
 - 대표적인 배치관리자의 종류
 1) FlowLayout
 2) BorderLayout
 3) GridLayout
 4) CardLayout

 

 * 1. FlowLayout 배치관리자

 - 배치 : 좌 -> 우
 - 상단 중앙에 컴포넌트를 배치한다
 - 화면이 넘칠 경우에는 바로 밑(아리) 중앙에 배치가 됨.
 - 배치관리자를 지정하지 않은 경우, default로 FlowLayout 배치 관리자로 배치함.

 

 

* 2.BorderLayout 배치관리자

 - 배치 : 동쪽, 서쪽, 남쪽, 북쪽, 중앙

 

 

* 3. GridLayout 배치관리자

 - 객자 모양의 배치관리자
 - 행과 열로 화면이 구성됨
 - 기준 : 무조건 행 기준

 

---

예제1) FlowLayout

package sist;

import java.awt.FlowLayout;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Ex16_FlowLayout extends JFrame{

	public Ex16_FlowLayout() {
		
		setTitle("FlowLayout 배치관리자");
		
		JPanel jp = new JPanel();
		
		// 1. 컴포넌트를 만들어 보자.
		JButton jb1 = new JButton("버튼1");
		JButton jb2 = new JButton("버튼2");
		JButton jb3 = new JButton("버튼3");
		JButton jb4 = new JButton("버튼4");
		
		// 2. 컴포넌트를 컨테이너에 올려야 한다.
		// 형식) new FlowLayout()
		//      new FlowLayout(정렬 - 왼쪽, 오른쪽, 중앙(default))
		//      new FlowLayout(정렬, 수평간격, 수직간격)
		//      * 수평간격 : 좌우 컴포넌트 사이의 간격. 픽셀단위, 기본 값은 5px)
		jp.setLayout(new FlowLayout(FlowLayout.RIGHT, 20, 10));
		jp.add(jb1);
		jp.add(jb2);
		jp.add(jb3);
		jp.add(jb4);
		
		// 3. 컨테이너를 프레임에 올려야 한다.
		add(jp);
		
		setBounds(200,200,300,300);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setVisible(true);
	}
	
	public static void main(String[] args) {
		
		new Ex16_FlowLayout();

	}

}

---

예제2) BorderLayout

package sist;

import java.awt.BorderLayout;

import javax.swing.*;

/*
 * 2.BorderLayout 배치관리자
 *   - 배치 : 동쪽, 서쪽, 남쪽, 북쪽, 중앙
 */

public class Ex17_BorderLayout extends JFrame{
	
	public Ex17_BorderLayout() {
		JPanel jp = new JPanel();
		
		// 1. 컴포넌트를 만들어 보자
		JButton jb1 = new JButton("North");
		JButton jb2 = new JButton("South");
		JButton jb3 = new JButton("East");
		JButton jb4 = new JButton("West");
		JButton jb5 = new JButton("Center");
		
		// 2. 컴포넌트를 컨테이너에 올려야 한다.
		// 형식) new BorderLayout()
		//      new BorderLayout(수평간격, 수직간격)
		//      수평 간격 : 좌우 컴포넌트 사이의 간격. 픽셀단위. 기본값은 0
		//      수직 간격 : 상하 컴포넌트 사이의 간격. 픽셀단위. 기본값은 0
		jp.setLayout(new BorderLayout(20,30));
		
		jp.add(jb1, BorderLayout.NORTH);
		jp.add(jb2, BorderLayout.SOUTH);
		jp.add(jb3, BorderLayout.EAST);
		jp.add(jb4, BorderLayout.WEST);
		jp.add(jb5, BorderLayout.CENTER);
		
		// 3. 컨테이너를 프레임에 올려야한다.
		add(jp);
		
		setBounds(200,200,300,300);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setVisible(true);
	}

	public static void main(String[] args) {
		new Ex17_BorderLayout();

	}

}

---

예제3) GridLayout

package sist;

import java.awt.GridLayout;

import javax.swing.*;

public class Ex18_GridLayout extends JFrame{

	public Ex18_GridLayout() {
		
		setTitle("GridLayout 배치관리자");
		
		JPanel jp = new JPanel();
		
		// 1. 컴포넌트를 만들어 보자.
		JButton jb1 = new JButton("1");
		JButton jb2 = new JButton("2");
		JButton jb3 = new JButton("3");
		JButton jb4 = new JButton("4");
		JButton jb5 = new JButton("5");
		JButton jb6 = new JButton("6");
		JButton jb7 = new JButton("7");
		JButton jb8 = new JButton("8");
		JButton jb9 = new JButton("9");
		JButton jb10 = new JButton("*");
		JButton jb11 = new JButton("0");
		JButton jb12 = new JButton("#");
		
		// 2. 컴포넌트를 컨테이너에 올려야 한다.
		jp.setLayout(new GridLayout(4, 3));
		
		jp.add(jb1); jp.add(jb2); jp.add(jb3);
		jp.add(jb4); jp.add(jb5); jp.add(jb6);
		jp.add(jb7); jp.add(jb8); jp.add(jb9);
		jp.add(jb10); jp.add(jb11); jp.add(jb12);
		
		// 3. 컨테이너를 프레임에 올려야 한다.
		add(jp);
		setBounds(200,200,300,300);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setVisible(true);
		
	}
	
	public static void main(String[] args) {
		new Ex18_GridLayout();

	}

}

---

심화예제1) 간단한 계산기 화면

package sist;

import java.awt.BorderLayout;

import javax.swing.*;

// 간단한 계산기 화면을 구성해보자.

public class Ex19_Layout01 extends JFrame{

	public Ex19_Layout01() {
		setTitle("간단한 계산기 예제");
		
		JPanel north = new JPanel(); // 상단 컨테이너
		JPanel center = new JPanel(); // 중앙 컨테이너
		JPanel south = new JPanel(); // 하단 컨테이너
		
		// 1. 컴포넌트를 만들어 보자.
		// 1-1. north(상단)에 들어갈 컴포넌트를 만들자.
		JLabel jl1 = new JLabel("수 1 : ");
		JTextField su1 = new JTextField(5);
		
		JLabel jl2 = new JLabel("수 2 : ");
		JTextField su2 = new JTextField(5);
		
		JLabel jl3 = new JLabel("연산자 : ");
		JTextField op = new JTextField(1);
		
		// 1-2. center(중앙)에 들어갈 컴포넌트를 만들자.
		JTextArea jta = new JTextArea(5, 20);
		JScrollPane jsp = new JScrollPane(jta,
				ScrollPaneConstants.VERTICAL_SCROLLBAR_AS_NEEDED,
				ScrollPaneConstants.HORIZONTAL_SCROLLBAR_NEVER);
		
		// 자동 줄바꿈 기능
		jta.setLineWrap(true); // 자동 줄바꿈 기능
		
		// 1-3. south(하단)에 들어갈 컴포넌트를 만들자
		JButton jb1 = new JButton("계 산");
		JButton jb2 = new JButton("종 료");
		JButton jb3 = new JButton("취 소");
		
		// 2. 컴포넌트를 컨테이너에 올려야 한다.
		// 2-1. jp(north) 컨테이너에 1-1 컴포넌트들을 올려준다.
		north.add(jl1); north.add(su1);
		north.add(jl2); north.add(su2); 
		north.add(jl3); north.add(op);
		
		// 2-2. center 컨테이너에 1-2 컴포넌트들을 올려준다.
		center.add(jsp);
		
		// 2-3. south 컨테이너에 1-3 컴포넌트들을 올려준다.
		south.add(jb1); south.add(jb2); south.add(jb3);
		
		// 3. 3개의 컨테이너를 프레임에 올리되, 배치해서 올리자.
		add(north, BorderLayout.NORTH);
		add(center, BorderLayout.CENTER);
		add(south, BorderLayout.SOUTH);
		
		setBounds(200,200,350,250);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setVisible(true);
		
	}
	
	public static void main(String[] args) {
		new Ex19_Layout01();

	}

}

---

심화예제2) 계산기 화면의 연산자를 라디오 버튼으로 변경 후, 위치를 아래로 옮기기

package sist;

import java.awt.BorderLayout;

import javax.swing.*;

public class Ex21_Layout03 extends JFrame {

	public Ex21_Layout03() {
	
		setTitle("계산기 예제 - 3");
		
		JPanel north_1 = new JPanel();
		JPanel north_2 = new JPanel();
		JPanel south = new JPanel();
		
		// 1. 컴포넌트를 만들어 보자.
		// 1-1. north_1 컨테이너에 들어갈 컴포넌트를 만들어 보자.
		JLabel jl1 = new JLabel("수 1 : ");
		JTextField su1 = new JTextField(7);
		
		JLabel jl2 = new JLabel("수 2 : ");
		JTextField su2 = new JTextField(7);
		
		// 1-2. north_2 컨테이너에 들어갈 컴포넌트를 만들어 보자.
		JLabel jl3 = new JLabel("연산자 : ");
		
		JRadioButton jrb1 = new JRadioButton("+");
		JRadioButton jrb2 = new JRadioButton("-");
		JRadioButton jrb3 = new JRadioButton("*");
		JRadioButton jrb4 = new JRadioButton("/");
		JRadioButton jrb5 = new JRadioButton("%");
		
		ButtonGroup bg = new ButtonGroup();
		bg.add(jrb1); bg.add(jrb2);
		bg.add(jrb3); bg.add(jrb4); bg.add(jrb5);
		
		// 1-3. TextArea  컴포넌트를 만들어 보자.
		JTextArea jta = new JTextArea(5, 25);
		JScrollPane jsp = new JScrollPane(
				jta, 
				ScrollPaneConstants.VERTICAL_SCROLLBAR_AS_NEEDED, 
				ScrollPaneConstants.HORIZONTAL_SCROLLBAR_NEVER);
		
		jta.setLineWrap(true);
		
		// 1-4. south 컨테이너에 들얼갈 컴포넌트를 만들어 보자.
		JButton jb1 = new JButton("계   산");
		JButton jb2 = new JButton("종   료");
		JButton jb3 = new JButton("취   소");
		
		// 2. 컴포넌트를 컨테이너에 올려야 한다.
		// 2-1. 1-1 컴포넌트들을 north_1 컨테이너에 올려야 한다.
		north_1.add(jl1); north_1.add(su1);
		north_1.add(jl2); north_1.add(su2);
		
		// 2-2. 1-2 컴포넌트들을 north_2 컨테이너에 올려야 한다.
		north_2.add(jl3); north_2.add(jrb1);
		north_2.add(jrb2); north_2.add(jrb3);
		north_2.add(jrb4); north_2.add(jrb5);
		
		// 2-3. 1-4 컴포넌트들을 south 컨테이너에 올려야 한다.
		south.add(jb1); south.add(jb2); south.add(jb3);
		 
		// 중요한 부분
		// 컨테이너를 하나 더 만들자.
		JPanel pg = new JPanel(new BorderLayout());
		
		// 새로 추가한 컨테이너에 기존의 컨테이너를 올려주자.
		pg.add(north_2, BorderLayout.NORTH);
		pg.add(jsp, BorderLayout.CENTER);
		pg.add(south, BorderLayout.SOUTH);
		
		// 3. 컨테이너를 프레임에 올려주어야 한다.
		add(north_1, BorderLayout.NORTH);
		add(pg, BorderLayout.CENTER);
		
		
		setBounds(200, 200, 300, 300);
		
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		
		setVisible(true);
		
	}
	
	public static void main(String[] args) {
		
		new Ex21_Layout03();

	}

}