文章來源：電腦愛好者作者：張劍
誰知道通天的巴比倫塔耗費了多少沙石？又有誰知道羅馬的建成經歷了多少日夜？我們惟一知道的是，沒有一塊磚石的壘砌，就沒有蜿蜒萬裡的長城;沒有巨石和黏土的堆集，就沒有亙古不變的金字塔。由此可見，基礎知識的準備對於我們學習任何事物都至關重要，那麼，就讓我們從認識Swing的一些基礎功能開始，啟動我們建造羅馬的偉大工程吧！
前言
Java咖啡館已經開張不少時日了，如果你已經喜歡上了Java這杯咖啡的味道，那麼記得常來哦。這次，我們為大家準備了一大杯香濃的咖啡――將以開發一個「連連看」遊戲為藍本，和大家共同學習Java中Swing的用法，當你細心品味這杯咖啡後，你會發現，不但Java這杯咖啡還別有一番風味，而且還學會了專業遊戲的開發方法，真是兩全其美！
為了讓大家先睹為快，下圖就是遊戲的截圖。大家可以下載遊戲試玩（下載遊戲程式；下載原始檔），然後在命令列方式下使用java -jar kyodai.jar來運作。此外，還可以到我的主頁http://www.ismyway.com下載這個遊戲的單機版以及手機版進行試玩(見圖1)。
Java咖啡館以前介紹過AWT的知識，那麼Swing和AWT到底有什麼差別呢？學習Java的人都可能聽到或看到過重量級控件和輕量級控件這個字眼，AWT就是我們通常所指的重量級控件，Swing則是輕量級控件。我們都知道Java的口號是“一次編寫，到處運行”，這也就要求在我們的程式中，盡量使用純Java的程式碼。不幸的是，AWT依賴與本地平台的接口，因此，在不同的作業系統上，使用AWT製作的介面看起來可能會有些細微差別。 Swing則完全不同了，Swing是用純Java寫的，因此，使用Swing編寫的介面能保證在所有平台上有著相同的外觀。這裡還有一個竅門:在JDK中，為便於區別，所有Swing控件都以大寫字母J開頭，比如說JButton(AWT 中對應的是Button)，這樣你就很容易區分Swing控件和AWT控件了。
Swing初體驗
對於想學習Swing程式設計的朋友，我們特地為大家準備了一些小技巧。首先，下載並閱讀程式碼是極有必要的。由於這是一篇關於Swing的教程，所以，我們只是盡可能講解一些與Swing有關的內容，與Swing無關的內容一般不會涉及，例如演算法部分。其次，受篇幅限制，也不可能在這裡將每部分程式碼都寫得完完整整的，所以，大家也需要對照完整程式碼來看。最後，為了讓大家更容易把精力集中在Swing學習上，我們也將遊戲開發中所需資源放在下載檔中，大家下載後便能夠編譯運行，看到執行結果。
1.頂層容器
什麼是頂層容器？當我們使用Java進行圖形程式設計的時候，圖在哪裡繪製呢？我們需要一個能夠提供圖形繪圖的容器，這個容器就被稱為頂層容器，你也可以把它想像成一個視窗。頂層容器是進行圖形編程的基礎，一切圖形化的東西，都必然包括在頂層容器中。在Swing中，我們有三種可以使用的頂層容器，它們分別是:
・JFrame:用來設計類似Windows系統中的視窗形式的應用程式。
・JDialog:和JFrame類似，只不過JDialog是用來設計對話框。
・JApplet:用來設計可以在嵌入在網頁中的Java小程式。
如果需要使用Swing製作一個視窗類別程序，我們的程式碼看起來應該是這樣:
import javax.swing.*;
public class KyodaiUI
extends JFrame {
……
}
2.控件
控制項是構成應用程式介面的基本元素，按鈕、文字方塊、進度條等，這些都是控制項。控件(這裡我們只討論可視化控件)又可以分為容器控件和非容器控件。從字面上來理解，容器控件就是能包含其他控件的特殊控件，例如，Java中的JPanel控件就屬於容器型控件，我們可以在JPanel中放置按鈕、文字方塊等非容器控件，你甚至可以在JPanel中再放置若干個JPanel控件(值得注意的是，頂層容器也是容器型控件，每一個窗口應用程式中有且只能有一個頂層容器控件，換句話說，頂層容器不能包括在其他的控件中) 。
Java中的容器控制項有很多，除剛才提到的JPanel外，還有JTabbedPane、JScrollPane等，非容器控制項有JButton、JLabel、JTextField等。如果你需要在某個容器型的控件中新增控件，你可以使用add(Component comp) 方法來實現，如:
JPanel panel = new JPanel();
JButton button = new JButton();
panel.add(button);
3.佈局
什麼是佈局？佈局是Java中用來控制控制項排列位置的介面管理系統。使用過其他視覺化程式設計開發語言的人在初次接觸Java介面設計時，總是會感覺到Java介面設計很彆扭:居然沒有提供所見即所得的設定控制座標的方法！然而，事實證明，Java本身提供的佈局管理系統也一樣能夠出色地完成我們的需要，而且在跨平台時表現得更有優勢。
常用的佈局有:
・BorderLayout:將介面分割為上下左右以及中間一塊區域的管理系統，在BorderLayout佈局中，最多你只能放5個控件，如果超過5個控件，建議還是選用其他的佈局系統吧。
・GridLayout:GridLayout是將使用者介面切割為棋盤一樣的佈局管理系統。如果我們要設計一個類似Windows中自帶的計算器軟體，GridLayout無疑是最佳選擇。
・FlowLayout:FlowLayout與上述兩類佈局管理系統不太一樣，在FlowLayout中，你不必指定每個控制項放在哪，你只需要把控制項加入到FlowLayout中，FlowLayout就會根據你新增控制項的順序依序放置控件，如果空間不夠，會自動換行。
在對這幾個佈局管理系統有了基本認知後，我們就一起來進入介面設計。在仔細觀察了QQ遊戲中「連連看」的設定後，我們可以發現，整個介面分為三個區，頂部是系統選單區，佔地面積最大的是用戶遊戲區，另外還有一個用戶交互區，每個區域中由若干控制組成。
這麼多控件，我們要從哪裡開始入手呢？由於容器控件中可以放置其他控件，因此，我們只需要先確定放置的容器控件就可以了。 既然已經知道需要使用容器控制項的數，接下來讓我們就進入佈局管理系統的選擇。用GridLayout？似乎有點勉強，用FlowLayout？還有更好的選擇嗎？對了，我想你一定想到了是BorderLayout吧，如下圖2。
動手之前，大家一定要注意的是，介面的設計要先考慮好尺寸，不管是主程式介面的大小還是每個區域的大小，如果沒有設計好合適的尺寸，將來改動起來會十分痛苦。
下面便是對應的原始程式:
import java.awt.*;
import javax.swing.*;
public class KyodaiUI extends JFrame {
public KyodaiUI() {
this.setSize(780， 500); //將窗體的大小設定為780*500
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setResizable(false); //窗體不能改變大小
this.setTitle("連連看"); //設定標題
JPanel toolBar = new JPanel();
toolBar.setBackground(Color.white);
toolBar.setPreferredSize(new Dimension(780， 48));
JPanel actionPanel = new JPanel(); //新建JPanel型的控件
actionPanel.setBackground(Color.yellow); //設定背景色
actionPanel.setPreferredSize(new Dimension(160， 380)); //設定大小
JPanel contentPanel = new JPanel();
contentPanel.setBackground(Color.blue);
contentPanel.setPreferredSize(new Dimension(620， 380));
this.getContentPane().add(toolBar， BorderLayout.NORTH);
this.getContentPane().add(actionPanel， BorderLayout.EAST);
this.getContentPane().add(contentPanel， BorderLayout.CENTER);
}
public static void main(String[] args) throws HeadlessException {
KyodaiUI kyodaiUI = new KyodaiUI();
kyodaiUI.show();
}
}
讓我們來看看上面這段程式是如何運作的。首先，extends JFrame顯示了這是從JFrame繼承過來的，JFrame是最基本的頂層容器控制項。實際上，在JDK中，以字母J打頭的控制都是Swing控制。然後設定了容器的屬性，其中，setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE)是用來告訴Java虛擬機，當使用者點擊窗體右上角的「關閉」按鈕時，關閉該視窗進程。如果不這麼做的話，你會發現雖然你可以點將視窗關閉，然而程式卻沒有退出。在接下來的程式碼中，我們為頂層容器添加了三個Panel容器。要注意的是，在AWT中，我們可以直接寫為add(toolBar， BorderLayout.NORTH) ，而在Swing 中卻一定要寫成getContentPane(). add(toolBar， BorderLayout.NORTH) ，否則程式就會出錯。
現在大家可以放在編譯運行看看，是不是跟我的運行結果一樣(見圖3)？
4.邊框
雖然我們使用了不同前景色來區別不同的區域，然而卻沒有層次感，加上邊框一定會漂亮許多。
在Java中，所有以J打頭的Swing控制項都可以使用setBorder方法來為自己設定邊框。邊框有很多種，線型、凸起、凹下、空的，你甚至可以自由組合形成個人風格。所有的Border都必須使用javax.swing.BorderFactory中提供的靜態方法來創建，例如:
Border border = BorderFactory.createBevelBorder(BevelBorder.LOWERED，
new Color(45， 92， 162)，
new Color(43， 66， 97)，
new Color(45， 92， 162)，
new Color(84， 123， 200));
現在，我們將toolBar.setBackground(Color.white)改為toolBar.setBorder(border)，立體效果是不是已經出現了？
實戰――寫上自己的大名
現在我們已經有了一個能夠運行的介面了，雖然它什麼也做不了，但是請你別慌，羅馬不是一天建成的。
現在讓我們在選單區提供一個「關於」選單，用來顯示程式的信息，難道你不想讓別人知道你的大名嗎？ Swing本身就提供了現成的按鈕控制項JButton，我們只需要建立一個新的按鈕:JButton about = new JButton("關於");這個按鈕該怎麼放到選單區而不是別的地方呢？我們可以加入下面的程式碼:toolBar.add(about);咦，怎麼點按鈕沒反應？這是因為你還沒告訴程式點擊按鈕時要做些什麼。要為按鈕新增事件回應，首先需要使用about.addActionListener(this)來告訴程式監聽按鈕按下時的事件，由於ActionListener是一個程式接口，因此，我們在類別的申明的地方也得做一點小小的修改:public class KyodaiUI extends JFrame implements ActionListener {...}實作ActionListener介面是為了告訴程式我要進行事件處理了。當然，最後我們得加入回應事件的程式碼:
public void actionPerformed(ActionEvent e) {
if (e.getSource() == about) {
JOptionPane.showMessageDialog(this， "我的大名"， "關於"，
JOptionPane.INFORMATION_MESSAGE);
return ;
}
}
其中，e.getSource() 表示當前觸發事件的控件，由於我們的程式中往往會有多個以上的控件，這些控件都有可能產生事件，所以我們必須使用這個方法來找到產生事情的控件。
小結
讓我們一起來回顧一下今天所學的內容:首先我們了解了頂層容器，也知道了控件分為容器控件和非容器控件，同時還知道使用邊框，最後，我們還小小的處理了一下按鈕的事件。
學而時習之，不亦說乎，就讓我留點小小的作業，幫助大家鞏固一下今天所學的內容:上面我們添加的按鈕在菜單欄的中間，並不美觀，請大家放到左邊或右邊試試。
最後向大家提供一些比較好的參考資料:
●Creating a GUI with JFC/Swing
http://java.sun.com/docs/books/tutorial/uiswing/index.html
●2D Graphics
http://java.sun.com/docs/books/tutorial/2d/index.html
●JDK API
http://java.sun.com/j2se/1.4.2/docs/api/index.html