使用Eclipse和WindowBuilder Editor插件進行Java可視化編程

Eclipse是一種免費的可擴展的開放源代碼的集成開發環境（IDE）。

這需要下載Eclipse IDE for Java Developers ，官網下載地址

https://www.eclipse.org/downloads/packages/release

可到網上搜索下載。根據操作系統的位數（bit）32位或 64位選擇相應位數（bit）的版本下載。

Eclipse屬於綠色軟件，安裝程序不會往註冊表寫入信息。Eclipse安裝程序是一個壓縮包，在解壓縮後的文件夾中找到eclipse.exe，雙擊它就可以啓動運行eclipse。當然你可以創建桌面快捷方式圖標，以後用此桌面快捷方式圖標啓動運行eclipse。

第一部分、下面先用eclipse設計一個簡單的GUI（Graphical User Interface）程序

Java提供了三個主要包做GUI開發：

java.awt 包，主要提供字體/佈局管理器

javax.swing 包，主要提供各種組件(窗口/按鈕/文本框)

java.awt.event 包，事件處理，後臺功能的實現。

界面主要包括：

組件/控件，就是界面中的各種組成部分，比如：按鈕、文本框、標籤、表格…

容器，容器也是組件的一種，能容納其它組件，比如：窗口、面板

佈局管理器，組件在容器中的大小和位置由佈局管理器控制。

常見的類/接口:

JFrame(窗口)、JPanel(面板)、JButton(按鈕)、JTextField(文本框)、JLabel(標籤)

常見的佈局方式

FlowLayout(流佈局)、BorderLayout(邊框佈局)、GridLayout(網格佈局)

新建一個項目，使用文件菜單File -> New ->JavaProject：

輸入項目名：testABC，單擊“Finish”按鈕。

因爲我們是建立一個簡單的程序，所以單擊“Don’t Create”按鈕

創建的項目testABC，並立即出現在右側導航欄中。

爲項目建立新類，展開項目testABC，右擊src 使用右鍵快捷菜單，New -> Class

輸入類名：testG ，選中public static void main(String[] arge)，單擊“Finish”按鈕

將其中的代碼改爲：

package testABC;

import java.awt.FlowLayout;

import javax.swing.JButton;

import javax.swing.JFrame;

public class testG {

public static void main(String[] args) {

JFrame jf = new JFrame("流佈局DEMO"); //建立一個窗口

FlowLayout fl = new FlowLayout(); //使用流佈局

jf.setLayout(fl);//修改佈局管理

JButton jb1 = new JButton("按鈕1"); //創建一個按鈕

jf.add(jb1); //把按鈕jb1放入窗口

JButton jb2 = new JButton("按鈕2");//創建一個按鈕

jf.add(jb2);//把按鈕jb2放入窗口

jf.setSize(600, 300); //設置窗口的大小

jf.setLocation(300,200);//設置窗口的初始位置

jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//關閉窗口

jf.setVisible(true); //顯示窗口

}

如下圖：

單擊工具欄運行按鈕運行：

第二部分、利用WindowBuilder Editor插件設計一個GUI程序概敘

從上面的例子可以看出，用java爲程序編寫圖形界面，比較麻煩（簡簡單單的佈局要寫一堆代碼），可以通過在Eclipse上安裝插件WindowBuilder比較輕鬆實現圖形界面可視化編程。

在Eclipse上安裝插件WindowBuilder，可參考：

https://blog.csdn.net/yerenyuan_pku/article/details/82861589

先介紹在Eclipse中用WindowBuilder Editor插件設計一個GUI程序的過程

（一）、新建一個項目：

使用文件菜單File -> New ->JavaProject

輸入項目名：testA，單擊Finish

因爲我們是建立一個簡單的程序，不使用Module，所以單擊Don’t Create

至此testA項目建立。

（二）創建類

a)使用wizard嚮導創建類；b) 使用普通方法創建類

a)使用wizard嚮導創建類

文件菜單New -> Other或在在Java項目上單擊右鍵，選擇“New -> Other”快捷菜單，如下圖所示

【特別說明，若找不到WindowBuilder Editor，需要添加。】

創建的類文件testClassA，並立即出現在右側導航欄中，並將出現WindowBuilder設計視圖窗口，在窗口的左下角（箭頭標識處），有兩個選項卡：Source和Design， Source選項卡顯示文本代碼，Design選項卡顯示設計視圖。參見下圖：

單擊Design選項卡，顯示如下圖：

雙擊WindowBuilder Editor頂部這個選項卡，可以在全屏顯示和常規顯示之間切換。

Palette面板用於定製GUI組件，Properties面板用於GUI組件屬性。

現在可以具體設計用戶界面了。

b)使用普通方法創建類

展開項目，右擊src 使用右鍵快捷菜單，New -> Class

輸入類名，將超級類（Superclass）改爲javax.swing.JFrame ，並選中public static void main(String[] args)，單擊Finish按鈕

【特別說明，若在“Open With >”下級菜單中找不到WindowBuilder Editor，需要添加。】

將出現WindowBuilder設計視圖窗口，在窗口的左下角（箭頭標識處），有兩個選項卡：Source和Design， Source選項卡顯示文本代碼，Design選項卡顯示設計視圖。

單擊Design選項卡，

雙擊WindowBuilder Editor頂部這個選項卡，可以在全屏顯示和常規顯示之間切換。

Palette面板用於定製GUI組件，Properties面板用於GUI組件屬性。

現在可以具體設計用戶界面了。

使用a)使用wizard嚮導創建類；b) 使用普通方法創建類不完全相同，用後者在後續手工編碼時多一些。

（三）具體設計用戶界面設計

在WindowBuilder設計視圖中設計界面，可以根據需求直接將需要的控件拖拽到面板上形成所需要的界面。

可以手動拖動控制那些控件的位置和大小，若不能手動拖動控制那些控件的位置和大小，是因爲你的Layout沒設置好【默認的佈局方式爲BorderLayout(默認鋪開整個窗體)，不能手動拖動控制那些控件的位置和大小】，可以用groupLayout，點一下groupLayout，然後再畫布上點一下部件位置，拖到哪就放到哪。也可以使用absolute layout（絕對佈局），讓你可以隨心所欲的安放控件。