Java GUI快速入門
1.GUI的介紹
1.1GUI概述
早期，電腦向用戶提供的是單調、枯燥、純字元狀態的“命令列介面（CLI）”。就是到現在，我們還可以依稀看到它們的身影：在Windows中開個DOS視窗，就可看到歷史的足跡。後來，Apple公司率先在電腦的作業系統中實現了圖形化的使用者介面（Graphical User Interface，簡稱GUI），但由於Apple公司封閉的市場策略，自己完成電腦硬體、作業系統、應用軟體一條龍的產品，與其它PC不相容。這使得Apple公司錯過了一次一統全球PC的好機會。
後來，Microsoft公司推出了風靡全球的Windows作業系統，它憑藉著優秀的圖形化使用者介面，一舉奠定了作業系統標準的地位。這也造就了世界首富---比爾.蓋茨和IT業的泰山北斗微軟公司。
在這圖形使用者介面風行於世的今天，一個應用軟體沒有良好的GUI是無法讓使用者接受的。而Java語言也深知這一點的重要性，它提供了一套可以輕鬆構建GUI的工具。在本章和下一章中，我們將向你充分證明這一點。
1.2Java提供了三個主要包做GUI開發：
java.awt 包 – 主要提供字型/佈局管理器
javax.swing 包[商業開發常用] – 主要提供各種元件(視窗/按鈕/文字框)
java.awt.event 包 – 事件處理，後臺功能的實現。
2.Swing元件
如圖所示：swing元件主要可分為三個部分，後面會詳細介紹
（1）頂層容器:：常用有JFrame，JDialog
（2）中間容器：JPanel，JOptionPane，JScrollPane，JLayeredPane 等，主要以panel結尾。
（3）基本元件：JLabel，JButton，JTextField，JPasswordField，JRadioButton 等。
2.1頂層容器介紹
|
# |
元件 |
描述 |
|
1 |
JFrame |
一個普通的視窗（絕大多數 Swing 圖形介面程式使用 JFrame 作為頂層容器） |
|
2 |
JDialog |
對話方塊 |
2.2中間容器
|
# |
元件 |
描述 |
|
1 |
JPanel (相當於div) |
一般輕量級面板容器元件(作為JFrame中間容器) |
|
2 |
JScrollPane |
帶滾動條的，可以水平和垂直滾動的面板元件 |
|
3 |
JSplitPane |
分隔面板 |
|
4 |
JTabbedPane |
選項卡面板 |
|
5 |
JLayeredPane |
層級面板 |
2.3基本元件
|
# |
元件 |
描述 |
|
1 |
JLabel |
標籤 |
|
2 |
JButton |
按鈕 |
|
3 |
JRadioButton |
單選按鈕 |
|
4 |
JCheckBox |
複選框 |
|
5 |
JToggleButton |
開關按鈕 |
|
6 |
JTextField |
文字框 |
|
7 |
JPasswordField |
密碼框 |
|
8 |
JTextArea |
文字區域 |
|
9 |
JComboBox |
下拉列表框 |
|
10 |
JList |
列表 |
|
11 |
JProgressBar |
進度條 |
|
12 |
JSlider |
滑塊 |
3.API介紹
3.1Jframe元件
|
JFrame frame = new JFrame("HelloWorldSwing"); |
// 建立及設定視窗 |
|
frame.setDefaultLookAndFeelDecorated(true); |
// 確保一個漂亮的外觀風格 |
|
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); |
設定預設的關閉視窗 |
|
frame.pack(); |
// 顯示視窗 |
|
frame.setVisible(true); |
//這個最好放在最後，不然會出現檢視看不到的情況 |
|
frame.setBounds(600, 300, 500, 400); |
設定視窗的x,y位置，視窗大小x,y. |
|
frame.add(panel) |
新增panel面板到容器 |
|
frmIpa.getContentPane().add(panel, BorderLayout.NORTH); |
新增面板到主視窗，佈局在北面 |
|
frmIpa.getContentPane().add(scrollPane, BorderLayout.CENTER); |
新增可滾動面板到主視窗，佈局在中間 |
3.2Panel元件
Jpanel
|
JPanel panel = new JPanel(); |
建立面板容器 |
|
panel.add(button); |
新增按鈕到面板 |
JOptionPane
|
JOptionPane.showMessageDialog(panel3, "沒有選中任何檔案", "提示", JOptionPane.WARNING_MESSAGE); |
彈出提示框到panel容器 |
JScrollPane
|
JScrollPane scrollPane = new JScrollPane(); |
建立可滾動面板 |
|
scrollPane.setViewportView(textArea); |
設定面板內容 |
3.3功能元件
JLabel
|
JLabel label = new JLabel("Hello World"); |
新增標籤 |
Jbutton
|
JButton button = new JButton("選擇檔案"); |
建立按鈕 |
|
button.addActionListener(new ActionListener() {} |
新增操作按鈕後的事件監聽器 |
JFileChooser
|
jfc.setFileSelectionMode(JFileChooser.FILES_AND_DIRECTORIES ); |
// 設定檔案對話方塊 |
|
jfc.showSaveDialog(frmIpa); |
// 顯示開啟的檔案對話方塊 |
|
jfc.getSelectedFile(); |
// 獲取選擇器選擇的檔案 |
JTextArea
|
JTextArea textArea = new JTextArea(); |
建立文字區域 |
|
textArea.setText(content); |
設定內容 |
4.案例程式碼
4.1UI介紹
主視窗Jframe，
Jframe新增2個Jpanel面板，
北面Jpanel新增JButton,JButton開啟JFileChooser檔案對話方塊。
中間JScrollPane新增JTextArea文字區域，文字區域按各自業務邏輯來處理。
4.2程式碼
1 import java.awt.BorderLayout;
2 import java.awt.event.ActionEvent;
3 import java.awt.event.ActionListener;
4 import java.io.File;
5 import javax.swing.JButton;
6 import javax.swing.JFileChooser;
7 import javax.swing.JFrame;
8 import javax.swing.JOptionPane;
9 import javax.swing.JPanel;
10 import javax.swing.JScrollPane;
11 import javax.swing.JTextArea;
12
13 public class IpaUI {
14 public static JFrame frmIpa;
15 public JTextArea textArea;
16
17 public IpaUI() {
18 // 視窗框架
19 frmIpa = new JFrame();
20 frmIpa.setTitle("ipa工具類");
21 frmIpa.setBounds(600, 300, 500, 400);
22 frmIpa.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
23
24 // 面板1
25 JPanel panel = new JPanel();
26 frmIpa.getContentPane().add(panel, BorderLayout.NORTH);
27 JButton button = new JButton("選擇檔案");
28 // 監聽button的選擇路徑
29 button.addActionListener(new ActionListener() {
30 @Override
31 public void actionPerformed(ActionEvent e) {
32 // 顯示開啟的檔案對話方塊
33 JFileChooser jfc = new JFileChooser();
34 jfc.showSaveDialog(frmIpa);
35 try {
36 // 使用檔案類獲取選擇器選擇的檔案
37 File file = jfc.getSelectedFile();//
38 //這裡是我的業務需求，各位不必照抄
39 // String content = IpaService.getIpaInfoMap(file.toString());
40 // textArea.setText(content);
41 } catch (Exception e2) {
42 JPanel panel3 = new JPanel();
43 JOptionPane.showMessageDialog(panel3, "沒有選中任何檔案", "提示", JOptionPane.WARNING_MESSAGE);
44 }
45 }
46 });
47 panel.add(button);
48
49 // 可滾動面板
50 JScrollPane scrollPane = new JScrollPane();
51 frmIpa.getContentPane().add(scrollPane, BorderLayout.CENTER);
52 textArea = new JTextArea();
53 scrollPane.setViewportView(textArea);
54 //這個最好放在最後，否則會出現檢視問題。
55 frmIpa.setVisible(true);
56 }
57 }
5.外掛介紹WindowBuilder
總算騙大家看完文章，其實最方便的方法是用外掛製作，當然大家先了解完程式碼原理是最好的哈哈。eclispe安裝windowbuilder有兩種方式，一種是離線安裝，一種是線上安裝。
5.1搜尋WindowBuilder
找到http://www.eclipse.org/windowbuilder/download.php
根據自己的eclipse版本選擇，因為我的是4.8版本了，所以只能在線安裝。
5.2.在eclipse的中安裝
（1）選擇Help - Eclipse MarketPlace
（2） 在商店中搜索windowbuilder ，會出現WindowBuilder外掛
（3）一路下一步，進行安裝，等待安裝結束重啟eclipse即可。
5.3WindowBuilder外掛的使用
（1）在Eclipe選單中File - New -Other ，選中WindowBuilder - Swing Designer - JFrame。
（2）開啟檔案，點選左下角的Design進入檢視模式，左邊對應程式碼模式
左上是整個檢視結構，左下是單個結構的屬性，可以在這裡修改視窗的一些屬性，
中間是整個swing的介面按鈕，前面第二點介紹過的，這裡就不說了，
右邊就是檢視了，可以點選按鈕往視圖裡面新增，如下圖。