Swing套件的容器元件与版面配置.ppt

《Swing套件的容器元件与版面配置.ppt》由会员分享，可在线阅读，更多相关《Swing套件的容器元件与版面配置.ppt（54页珍藏版）》请在三一办公上搜索。

1、第10章 Swing套件的容器元件與版面配置,10-1 Swing套件的基礎10-2 Swing的最上層容器類別10-3 Swing的中間層容器類別10-4 Swing元件的版面配置管理員10-5 Swing元件的框線,10-1 Swing套件的基礎,10-1-1 Swing套件是什麼10-1-2 Swing應用程式架構10-1-3 事件改編者Event Adapter,10-1 Swing套件的基礎,Swing套件屬於Java平台JFC（Java Foundation Classes）的一部分，JFC可以建立GUI介面的Java應用程式，在本書稱為Swing應用程式，使用的是JFC的Swin

2、g套件提供的各種元件。例如：按鈕、核取方塊、選項鈕和文字方塊等。,10-1-1 Swing套件是什麼,Swing套件的類別是定義在名為javax.swing套件，第9章介紹的AWT元件屬於JDK 1.0和1.1版的GUI元件，在Java 2平台提供全新的Swing元件來取代AWT，大部分的Swing元件都是繼承自JComponent，其元件名稱都是以”J”字母開頭，如右圖所示：,10-1-2 Swing應用程式架構,Swing應用程式的架構像是在一個大盒子中放入多個小盒子，首先將Swing套件的各種GUI元件JButton和JLabel新增到中間層容器元件。例如：JPanel，然後將JPane

3、l新增到最上層容器類別JFrame，JFrame是一種擁有標題列的視窗元件，如下圖所示：,10-1-3 事件改編者Event Adapter-說明,在AWT的套件提供XXXAdapter改編者類別，如下表所示：,10-1-3 事件改編者Event Adapter-範例,例如：在主程式main()使用WindowListener事件傾聽者，這個介面一共有7個方法，但是我們只實作windowClosing()一個方法，如下所示：app.addWindowListener(new WindowAdapter()public void windowClosing(WindowEvent evt)Sys

4、tem.exit(0););,10-2 Swing的最上層容器類別,10-2-1 JFrame最上層容器類別10-2-2 JApplet最上層容器類別10-2-3 JDialog最上層容器類別,10-2 Swing的最上層容器類別-類別架構,在Java的Swing應用程式需要使用一個最上層容器類別作為容器類別架構的根類別，Swing的GUI元件需要新增至容器（Container）類別架構，才能讓GUI元件在螢幕上顯示，如下圖所示：,10-2 Swing的最上層容器類別-說明,Swing應用程式至少需要擁有一個JFrame容器類別架構，也就是一個擁有標題列的主視窗。應用程式對話方塊可以建立以JD

5、ialog為最上層類別的容器類別架構。例如：Java應用程式擁有1個主視窗和2個對話方塊，也就是建立1個以JFrame和2個以JDialog為根類別的容器類別架構。在Java Applet也可以使用Swing元件，這是建立以JApplet為根類別的容器類別架構，如此即可在Java Applet顯示Swing的GUI元件。,10-2-1 JFrame最上層容器類別-類別架構,JFrame類別的物件是一個擁有框線、標題列和圖示按鈕的Windows視窗，這個視窗擁有隱藏的功能表列（MenuBar）和ContentPane元件，JFrame類別的繼承架構，如下圖所示：,10-2-1 JFrame最上層

6、容器類別-建構子,JFrame類別的建構子，如下表所示：,10-2-1 JFrame最上層容器類別-ContentPane相關方法,JFrame類別關於ContentPane物件的相關方法，如下表所示：,10-2-1 JFrame最上層容器類別-Component相關方法,JFrame類別繼承自Component類別的相關方法，如下表所示：,10-2-2 JApplet最上層容器類別-類別架構,在Java Applet使用Swing元件需要使用JApplet作為根類別來建立容器類別架構，同樣的JApplet也擁有一個ContentPane物件，所以可以在此ContentPane物件新增所需的S

7、wing元件，其繼承架構如下圖所示：,10-2-2 JApplet最上層容器類別-步驟,將Swing應用程式改成JApplet類別的Java Applet十分簡單，其步驟如下所示：刪除建構子中呼叫super()方法的程式碼。將建構子名稱改為init()或start()。刪除Swing應用程式的主程式main()。JFrame類別本身如果是傾聽者物件，請刪除實作介面，然後在新增傾聽者物件方法使用new運算子新增傾聽者物件。,10-2-3 JDialog最上層容器類別-說明,對話方塊（Dialog）是一種很重要的視窗介面，在視窗應用程式的執行過程中，一定會出現一些對話方塊，如果對話方塊會擱置使用者

8、輸入資料至其它視窗，這種對話方塊稱為程式的對話方塊（Modal Dialog）。,10-2-3 JDialog最上層容器類別-類別架構,在Swing套件可以使用JOptionPane類別建立程式的對話方塊，否則需要直接使用JDialog類別來建立，其繼承架構如下圖所示：,10-2-3 JDialog最上層容器類別-建構子,JDialog類別的建構子，如下表所示：,10-2-3 JDialog最上層容器類別-showMessageDialog()方法,showMessageDialog()方法可以顯示【確定】按鈕的訊息視窗，如下所示：JOptionPane.showMessageDialog(j

9、pane,這是一個測試的訊息視窗!);,10-2-3 JDialog最上層容器類別-showConfirmDialog()方法,showConfirmDialog()方法可以顯示詢問問題的對話方塊，如下所示：int n=JOptionPane.showConfirmDialog(jpane,您是否已經按下showMessageDialog按鈕?,操作問題,JOptionPane.YES_NO_OPTION);,10-2-3 JDialog最上層容器類別-showOptionDialog()方法(說明),showOptionDialog()方法可以顯示指定標題文字、圖示、訊息和按鈕的對話方塊，如

10、下所示：Object options=showMessageDialog按鈕,showConfirmDialog按鈕;int m=JOptionPane.showOptionDialog(jpane,哪一個按鈕顯示警告訊息?,操作問題,JOptionPane.YES_NO_OPTION,JOptionPane.QUESTION_MESSAGE,null,options,options0);,10-2-3 JDialog最上層容器類別-showOptionDialog()方法(圖例),10-3 Swing的中間層容器類別,10-3-1 JPanel類別10-3-2 JScrollPane類別,1

11、0-3 Swing的中間層容器類別,Swing套件的中間層容器類別的目的是將Swing元件群組化，以便使用第10-4節的版面配置管理員來編排新增的GUI元件，Swing套件提供相當多種中間層容器類別。例如：JPanel、JScrollPane、JSplitPane、JTabbedPane和JInternalFrame等。,10-3-1 JPanel類別-說明與建構子,JPanel類別屬於一般用途的中間層容器，預設為透明、沒有背景色彩，這是一種看不見的中間層容器類別，預設使用FlowLayout版面配置，其使用方式類似ContentPane類別，JPanel類別的建構子，如下表所示：,10-3-

12、1 JPanel類別-方法,JPanel關於版面配置的相關方法，如下表所示：,10-3-2 JScrollPane類別-說明與建構子,JScrollPane類別擁有捲動軸，可以顯示更大尺寸的Swing元件。例如：JTextArea文字區域因為可以輸入整篇文章，所以需要JScrollPane新增捲動軸功能來檢視這篇文章。JScrollPane類別的建構子，如下表所示：,10-3-2 JScrollPane類別-方法,JScrollPane類別的相關方法，如下表所示：,10-4-1 BorderLayout版面配置10-4-2 FlowLayout版面配置10-4-3 CardLayout版面配置

13、10-4-4 GridLayout版面配置10-4-5 GridBagLayout版面配置10-4-6 BoxLayout版面配置,10-4 Swing元件的版面配置管理員,10-4 Swing元件的版面配置管理員-說明,版面配置管理員（Layout Manager）可以編排新增到ContentPane物件和中間層容器的Swing元件，版面配置管理員設定容器內各元件的尺寸和位置，不同的版面配置管理員擁有不同預設的編排方式，只需依照需求選擇使用的版面配置管理員，就可以編排出漂亮的GUI介面。,10-4 Swing元件的版面配置管理員-說明,JComponent類別關於版面配置的相關方法，如下表所

14、示：,10-4-1 BorderLayout版面配置-說明1,BorderLayout邊界式版面配置是將元件放置在中間（Center），然後在北（North）、南（South）、東（East）和西（West）的4個邊界放置元件，如下圖所示：,10-4-1 BorderLayout版面配置-說明2,容器類別如果使用BorderLayout版面配置（這是JFrame的ContentPane預設的版面配置），在JComponent類別的add()方法就需要第2個參數來指定版面配置方式，如下所示：c.add(new JButton(北按鈕),BorderLayout.NORTH);上述程式碼的第2個參

15、數是元件放置的位置。,10-4-1 BorderLayout版面配置-建構子與方法,BorderLayout類別的建構子，如下表所示：BorderLayout類別的相關方法，如下表所示：,10-4-2 FlowLayout版面配置-說明,FlowLayout水流式版面配置屬於一種簡易的版面配置方式，JPanel預設使用這種版面配置。FlowLayout版面配置依序在同一列放置元件，並沒有任何特殊編排，如果元件超過邊界，就置於下一列。,10-4-2 FlowLayout版面配置-建構子,FlowLayout類別的建構子，如下表所示：,10-4-3 CardLayout版面配置-說明,CardLa

16、yout卡片式版面配置如同一張一張名片，它可以將Swing元件分配到一張張的不同卡片，每次只顯示一張卡片中的Swing元件。,10-4-3 CardLayout版面配置-建構子,CardLayout不同於其它版面配置，每次只能在JFrame視窗顯示部分元件。CardLayout類別的建構子，如下表所示：,10-4-3 CardLayout版面配置-相關方法,CardLayout類別的相關方法主要是瀏覽卡片的方法，如下表所示：,GridLayout格子式版面配置是使用相等尺寸的長方形，以表格方式分為幾列和幾欄來編排Swing元件，如下圖所示：,10-4-4 GridLayout版面配置-說明,1

17、0-4-4 GridLayout版面配置-建構子,GridLayout類別的建構子，如下表所示：,10-4-4 GridLayout版面配置-相關方法,GridLayout類別的相關方法，如下表所示：,GridBagLayout格子袋式版面配置屬於比較複雜的版面配置，類似GridLayout可以將元件分為欄和列排列，不過列和欄並不需等高或等寬，而且可以使用GridBagConstraints類別設定成員變數來指定元件的顯示位置。,10-4-5 GridBagLayout版面配置-說明,10-4-5 GridBagLayout版面配置-建構子與方法,GridBagLayout和GridBagCo

18、natraints類別的建構子，如下表所示：GridBagLayout類別的相關方法，如下表所示：,10-4-5 GridBagLayout版面配置-成員變數1,10-4-5 GridBagLayout版面配置-成員變數2,10-4-6 BoxLayout版面配置-說明,BoxLayout盒式版面配置是Swing套件的一般用途版面配置，可以使用水平或垂直方式，如同堆積木般的編排元件，它可以說是一種完整功能的FlowLayout。,10-4-6 BoxLayout版面配置-建構子,BoxLayout類別的建構子，如下表所示：,10-4-6 BoxLayout版面配置-類別方法,Box類別常用的類

19、別方法，如下表所示：,10-5 Swing元件的框線-說明,Swing容器類別或元件都是繼承自JComponent，所以都有一或多個圍繞在邊界的框線，這些框線並非單純圍繞在元件外的線條，它可以加上標題文字或增加元件周圍的空間，以便變化出更多樣化的元件編排。,10-5 Swing元件的框線-相關方法,JComponent類別的setBorder()方法可以替元件新增框線，相關方法如下表所示：,10-5 Swing元件的框線-建立物件,10-5 Swing元件的框線-建立物件範例,建立各種框線的Border、TitledBorder或CompoundBorder物件，如下所示：bLine=BorderFactory.createLineBorder(Color.blue);etchedLine=BorderFactory.createEtchedBorder();TitledBorder titledLine;titledLine=BorderFactory.createTitledBorder(bLine,標題);emptyLine=BorderFactory.createEmptyBorder();Border compoundLine=BorderFactory.createCompoundBorder(etchedLine,redLine);,