Java GUI三種常見的佈局方式.FlowLayout,BorderLayout,GridLayout.教程

FlowLayout,BorderLayout,GridLayout是3種常見的java佈局Layout 方式,下面是使用教程.

一、FlowLayout 浮動佈局.

1. 創建一個普通的窗口Frame ,創建教程點擊跳轉

package GUI.Layout佈局管理器;

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

/**
 * 這個Demo介紹3種常見的佈局.
 * 1.流式佈局:
 * 2.方向佈局:
 * 3.表格佈局:
 */
public class FlowLayout流式佈局 {
    public static void main(String[] args) {


        //創建一個窗口.
        Frame frame = new Frame("半畝方糖的Layout");
//        //創建組件，佈局流式佈局，添加按鈕=============================
//        Button btn1 = new Button("Button1");
//        Button btn2 = new Button("Button2");
//        Button btn3 = new Button("Button3");
//
//        //佈局
//        frame.setLayout(new FlowLayout(FlowLayout.TRAILING));//此處的LEFT參數可選,trailing 後面的
//        //添加按鈕
//        frame.add(btn1);
//        frame.add(btn2);
//        frame.add(btn3);


        //設置位置，大小，顏色
        frame.setLocation(100,100);
        frame.setSize(400,300);
        frame.setBackground(new Color(38, 156, 22));
        //退出
        frame.addWindowListener(new WindowAdapter() {
            @Override
            public void windowClosing(WindowEvent e) {
                System.out.println("exist successfully.");
                System.exit(0);
            }
        });
        //可見性
        frame.setVisible(true);
    }
}

效果

2.設置Frame窗體的佈局,具體設置原理在idea中 CTRL+ 左鍵點擊查看源碼.

還有RIGHT,CENTER,LEADING,TRAILING等屬性,自己可以查看源碼.

frame.setLayout(new FlowLayout(FlowLayout.LEFT);
//此處的LEFT參數可選,trailing 後面的

3.添加按鈕到frame窗口.(2,3 步驟的位置可以調換)

        //創建組件，佈局流式佈局，添加按鈕
        Button btn1 = new Button("Button1");
        Button btn2 = new Button("Button2");
        Button btn3 = new Button("Button3");

        //添加按鈕
        frame.add(btn1);
        frame.add(btn2);
        frame.add(btn3);

總代碼.

package GUI.Layout佈局管理器;

import java.awt.*;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

/**
* 這個Demo介紹3種常見的佈局.
* 1.流式佈局:
* 2.方向佈局:
* 3.表格佈局:
*/
public class FlowLayout流式佈局 {
   public static void main(String[] args) {


       //創建一個窗口.
       Frame frame = new Frame("半畝方糖的Layout");
       //佈局
       frame.setLayout(new FlowLayout(FlowLayout.LEFT)); //此處的LEFT參數可選,trailing 後面的
       //創建組件，佈局流式佈局，添加按鈕=============================
       Button btn1 = new Button("Button1");
       Button btn2 = new Button("Button2");
       Button btn3 = new Button("Button3");

       //添加按鈕
       frame.add(btn1);
       frame.add(btn2);
       frame.add(btn3);


       //設置位置，大小，顏色
       frame.setLocation(100,100);
       frame.setSize(400,300);
       frame.setBackground(new Color(38, 156, 22));
       //退出
       frame.addWindowListener(new WindowAdapter() {
           @Override
           public void windowClosing(WindowEvent e) {
               System.out.println("exist successfully.");
               System.exit(0);
           }
       });
       //可見性
       frame.setVisible(true);
   }
}

總效果.

二、BorderLayout 邊界佈局.

1.如同 一、1.所示創建一個窗口.

2.設置佈局類型,BorderLayout(其實3步驟使用了BorderLayout.EAST等的方法，此處不用設置也行，但是養成好習慣，心底有底)

frame.setLayout(new BorderLayout());

3.創建按鈕，添加按鈕同時設置BorderLayout佈局，

注意：BorderLayout.EAST 指定邊界佈局的位置.

      //創建組件，佈局流式佈局，添加按鈕
      Button east = new Button("east");
      Button west = new Button("west");
      Button south = new Button("south");
      Button north = new Button("north");
      Button center = new Button("center");


      //添加按鈕同時佈局.
      frame.add(east,BorderLayout.EAST);
      frame.add(west,BorderLayout.WEST);
      frame.add(south,BorderLayout.SOUTH);
      frame.add(north,BorderLayout.NORTH);
      frame.add(center,BorderLayout.CENTER);

輸出結果.

三、GridLayout 網格佈局.

1.創建一個普通的frame

2.設置網格佈局GridLayout,

** 三行三列 ，豎直間距 20像素，水平間距20像素,

  frame.setLayout(new GridLayout(3,3,20,20));

3.創建按鈕，添加按鈕同時設置按鈕添加到的網格位置

frame.add(button1,new GridLayout(1,1)); 就是把button1添加到 第一行第一個處

        Button button1 = new Button("button1");
       Button button2 = new Button("button2");
       Button button3 = new Button("button3");
       Button button4 = new Button("button4");
       Button button5 = new Button("button5");
       Button button6 = new Button("button6");
       Button button7 = new Button("button7");
       Button button8 = new Button("button8");
       Button button9 = new Button("button9");
       //add buttons
       frame.add(button1,new GridLayout(1,1));
       frame.add(button2);
       frame.add(button3);
       frame.add(button4);
       frame.add(button5);
       frame.add(button6);
       frame.add(button7);
       frame.add(button8);
       frame.add(button9);

輸出

四、思考題：利用上面的三種Layout和Panel知識寫一個如下類似的Frame，Layout可以自由組合(答案不唯一)