Swing的图形介面元件(II)课件

Ch13Swing的圖形介面元件(II)JAVA程式設計入門(II)Ch13Swing的圖形介面元件(II)JAVA程式設計2023/10/62JPopupMenu彈出式選單元件JMenuBar、JMenu與JMenuItem下拉式選單元件JToolBar工具列元件JFileChooser檔案選擇元件JColorChooser色彩選擇元件多重視窗大綱2023/10/62JPopupMenu彈出式選單元件大綱2023/10/63視窗功能表和工具列元件Swing套件提供功能強大的視窗功能表和工具列元件，可以輕鬆建立應用程式視窗上方的下拉式功能表、工具列和彈出式選單。同樣的，視窗功能表和工具列元件也都是繼承自JComponent，其繼承架構如下圖所示：2023/10/63視窗功能表和工具列元件Swing套件提供2023/10/64JPopupMenu彈出式選單元件-說明JPopupMenu彈出式選單元件繼承自JComponent，可以建立視窗應用程式滑鼠右鍵顯示的快顯功能表，內含選項的JMenuItem物件或JSeparator分隔線物件，如下圖所示：2023/10/64JPopupMenu彈出式選單元件-說明2023/10/65JPopupMenu彈出式選單元件-建立物件在建立JPopupMenu物件後，使用add()方法新增選項的JMenuItem物件，addSeparator()方法可以新增選單分隔線的JSeparator物件。popup=newJPopupMenu();popup.add(blue=newJMenuItem("藍色"));popup.add(yellow=newJMenuItem("黃色"));popup.add(green=newJMenuItem("綠色"));popup.addSeparator();popup.add("紅色");2023/10/65JPopupMenu彈出式選單元件-建立2023/10/66JPopupMenu彈出式選單元件-事件處理新增MouseListener傾聽者物件且實作mousePressed()和mouseReleased()方法來顯示彈出式視窗，如下所示：publicvoidmousePressed(MouseEventevt){if(evt.isPopupTrigger())popup.show(evt.getComponent(),evt.getX(),evt.getY());}publicvoidmouseReleased(MouseEventevt){if(evt.isPopupTrigger())popup.show(evt.getComponent(),evt.getX(),evt.getY());}2023/10/66JPopupMenu彈出式選單元件-事件2023/10/67JPopupMenu建構子與方法建構子：JPopupMenu()JPopupMenu(String):參數String是標題文字方法：JMenuItemadd(JMenuItem)JMenuItemadd(String)voidaddSeparator()voidinsert(Component,int)voidremove(JMenuItem)voidremove(int)voidremoveAll()voidshow(Component,int,int)2023/10/67JPopupMenu建構子與方法建構子：2023/10/68範例1:使用PopupMenu(1/4)建立PopupMenu的選擇項：importjavax.swing.*;importjava.awt.*;importjava.awt.event.*;//繼承JFrame類別,實作ActionListener介面publicclassCh09_01extendsJFrameimplementsActionListener{privateJPopupMenupopup;privateJMenuItemblue,yellow,green;privateContainerc;//建構子

publicCh09_01(){super("JPopupMenu元件範例");c=getContentPane();c.setBackground(Color.pink);

popup=newJPopupMenu();popup.add(blue=newJMenuItem("藍色"));blue.addActionListener(this);popup.add(yellow=newJMenuItem("黃色"));yellow.addActionListener(this);popup.add(green=newJMenuItem("綠色"));green.addActionListener(this);popup.addSeparator();popup.add("紅色");//使用字串新增選項2023/10/68範例1:使用PopupMenu(1/4)2023/10/69範例1:使用PopupMenu(2/4)傾聽者：

addMouseListener(newMouseAdapter(){publicvoidmousePressed(MouseEventevt){if(evt.isPopupTrigger())//顯示選單

popup.show(evt.getComponent(),evt.getX(),evt.getY());}publicvoidmouseReleased(MouseEventevt){if(evt.isPopupTrigger())//顯示選單

popup.show(evt.getComponent(),evt.getX(),evt.getY());}});}2023/10/69範例1:使用PopupMenu(2/4)2023/10/610範例1:使用PopupMenu(3/4)實作事件處理方法：

publicvoidactionPerformed(ActionEventevt){if(evt.getSource()==blue)c.setBackground(Color.blue);//藍色

if(evt.getSource()==yellow)c.setBackground(Color.yellow);//黃色

if(evt.getSource()==green)c.setBackground(Color.green);//綠色

repaint();//重繪

}2023/10/610範例1:使用PopupMenu(3/42023/10/611範例1:使用PopupMenu(4/4)主程式：

publicstaticvoidmain(String[]args){//建立Swing應用程式

Ch09_01app=newCh09_01();//關閉視窗事件,結束程式的執行

app.addWindowListener(newWindowAdapter(){publicvoidwindowClosing(WindowEventevt){System.exit(0);}});app.setSize(300,200);//設定尺寸

app.setVisible(true);//顯示視窗

}}2023/10/611範例1:使用PopupMenu(4/42023/10/612Menu屬MenuComponent的延伸類別122023/10/612Menu屬MenuComponent的2023/10/613Ｍenu屬MenuComponent的延伸類別13以「記事本」為例說明選單及其相關元件2023/10/613Ｍenu屬MenuComponent的2023/10/61414Ｍenu屬MenuComponent的延伸類別Menu位於視窗標題列的下方使用選單時，框架（Frame）會有一個選單列（MenuBar），選單列內有數個選單（Menu）每個Menu內會有多個選項（MenuItem）或核選式選項（CheckboxMenuItem），選單是選項的容器選單也可以是另一個選單的容器2023/10/61414Ｍenu屬MenuComponen2023/10/615JMenuBar、JMenu與JMenuItem下拉式選單元件-說明在JFrame、JInternalFrame、JApplet和JDialog等類別的視窗新增下拉式功能表選單，類別建構子需要使用JMenuBar、JMenu和JMenuItem物件來建立下拉式功能表的物件。2023/10/615JMenuBar、JMenu與JMen2023/10/616JMenuBar、JMenu與JMenuItem下拉式選單元件-

JMenuBar元件JMenuBar元件是視窗上方的功能表列，如下所示：JMenuBarjmb=newJMenuBar();setJMenuBar(jmb);上述程式碼建立JMenuBar物件後，預設是空的功能表列，然後使用setJMenuBar()方法新增到JFrame視窗，換句話說，目前在視窗上方已經擁有一個空的功能表列。2023/10/616JMenuBar、JMenu與JMen2023/10/617JMenuBar、JMenu與JMenuItem下拉式選單元件-JMenu元件在建立好JMenuBar物件後，就可以新增功能表列下拉式子選單的JMenu物件，如下所示：JMenufile=newJMenu("檔案(F)");JMenuItemitem;file.add(item=newJMenuItem("新增(N)",KeyEvent.VK_N));file.add(item=newJMenuItem("開啟(O)",KeyEvent.VK_O));JMenusetting=newJMenu("參數設定");file.add(setting);file.addSeparator();file.add(item=newJMenuItem("關閉(X)",KeyEvent.VK_X));jmb.add(file);2023/10/617JMenuBar、JMenu與JMen2023/10/618JMenuBar、JMenu與JMenuItem下拉式選單元件-Item元件JMenuItem、JCheckBoxMenuItem與JRadioButtonMenuItem元件JMenuItem、JCheckBoxMenuItem與JRadioButtonMenuItem類別的建構子可以新增選單的選項、核取方塊和選項鈕選項。2023/10/618JMenuBar、JMenu與JMen2023/10/619範例2:建立Menu(1/5)基本宣告：/*程式範例:Ch09_02.java*/importjavax.swing.*;importjava.awt.*;importjava.awt.event.*;//繼承JFrame類別,實作ActionListener介面publicclassCh09_02extendsJFrameimplementsActionListener{privateJRadioButtonMenuItemred,green,blue;privateJMenuItemopenItem,newItem,exitItem,codeItem,typeItem;privateJMenusetting;privateContainerc;//建構子

publicCh09_02(){super("JMenuBar元件範例");c=getContentPane();c.setBackground(Color.white);JMenuBarjmb=newJMenuBar();setJMenuBar(jmb);2023/10/619範例2:建立Menu(1/5)基本宣告2023/10/620範例2:建立Menu(2/5)建立第一個File的Ｍenu：

JMenufile=newJMenu("檔案(F)");file.setMnemonic(KeyEvent.VK_F);openItem=newJMenuItem("新增(N)",KeyEvent.VK_N);newItem=newJMenuItem("開啟(O)",KeyEvent.VK_O);exitItem=newJMenuItem("關閉(X)",KeyEvent.VK_X);setting=newJMenu("參數設定");codeItem=newJMenuItem("編碼");typeItem=newJMenuItem("字型");

openItem.addActionListener(this);newItem.addActionListener(this);exitItem.addActionListener(this);codeItem.addActionListener(this);typeItem.addActionListener(this);

file.add(openItem);file.add(newItem);setting.add(codeItem);setting.add(typeItem);file.add(setting);file.addSeparator();//分隔線

file.add(exitItem);jmb.add(file);//新增file選單2023/10/620範例2:建立Menu(2/5)建立第一2023/10/621範例2:建立Menu(3/5)建立第二個Menu：

JMenuchoice=newJMenu("選項(C)");choice.setMnemonic(KeyEvent.VK_C);JCheckBoxMenuItemcheck;check=newJCheckBoxMenuItem("切換");check.addActionListener(this);choice.add(check);ButtonGroupbuttongroup=newButtonGroup();red=newJRadioButtonMenuItem("紅色");choice.add(red);buttongroup.add(red);red.addActionListener(this);green=newJRadioButtonMenuItem("綠色");choice.add(green);buttongroup.add(green);green.addActionListener(this);blue=newJRadioButtonMenuItem("藍色");choice.add(blue);buttongroup.add(blue);blue.addActionListener(this);jmb.add(choice);}2023/10/621範例2:建立Menu(3/5)建立第二2023/10/622範例2:建立Menu(4/5)實作事件處理方法：

publicvoidactionPerformed(ActionEventevt){if(evt.getSource()==exitItem)System.exit(0);if(evt.getSource()==red)c.setBackground(Color.red);if(evt.getSource()==green)c.setBackground(Color.green);if(evt.getSource()==blue)c.setBackground(Color.blue);repaint();//重繪

}2023/10/622範例2:建立Menu(4/5)實作事件2023/10/623範例2:建立Menu(5/5)主程式

publicstaticvoidmain(String[]args){//建立Swing應用程式

Ch09_02app=newCh09_02();//關閉視窗事件,結束程式的執行

app.addWindowListener(newWindowAdapter(){publicvoidwindowClosing(WindowEventevt){System.exit(0);}});app.setSize(300,200);//設定尺寸

app.setVisible(true);//顯示視窗

}}2023/10/623範例2:建立Menu(5/5)主程式2023/10/624JToolBar工具列元件-說明JToolBar工具列元件繼承自JComponent類別，可以建立視窗的工具列按鈕，它也屬於一種容器元件，在建立好JToolBar物件後，就可以新增GUI元件到工具列，如下圖所示：2023/10/624JToolBar工具列元件-說明JTo2023/10/625JToolBar工具列元件-建立物件程式碼在建立好JToolBar元件後，使用add()方法新增GUI元件，最後只需將JToolBar元件視為GUI元件，新增到最上層容器物件即可。JToolBartoolBar=newJToolBar();blue=newJButton(newImageIcon("blue1.gif"));yellow=newJButton(newImageIcon("yellow1.gif"));green=newJButton(newImageIcon("green1.gif"));toolBar.add(blue);toolBar.add(yellow);toolBar.add(green);2023/10/625JToolBar工具列元件-建立物件程2023/10/626範例3:建立toolbar(1/2)宣告及toolbar建立：/*程式範例:Ch09_03.java*/importjavax.swing.*;importjava.awt.*;importjava.awt.event.*;//繼承JFrame類別,實作ActionListener介面publicclassCh09_03extendsJFrameimplementsActionListener{privateJButtonblue,yellow,green;privateContainerc;//建構子

publicCh09_03(){super("JToolBar元件範例");c=getContentPane();c.setBackground(Color.white);JToolBartoolBar=newJToolBar();blue=newJButton(newImageIcon("blue.jpg"));blue.setToolTipText("藍色");blue.addActionListener(this);yellow=newJButton(newImageIcon("yellow.jpg"));yellow.setToolTipText("黃色");yellow.addActionListener(this);green=newJButton(newImageIcon("green.jpg"));green.setToolTipText("綠色");green.addActionListener(this);toolBar.add(blue);toolBar.add(yellow);toolBar.add(green);c.add(toolBar,BorderLayout.NORTH);}2023/10/626範例3:建立toolbar(1/2)宣2023/10/627範例3:建立toolbar(2/2)實作事件處理方法及主程式：

publicvoidactionPerformed(ActionEventevt){if(evt.getSource()==blue)c.setBackground(Color.blue);if(evt.getSource()==yellow)c.setBackground(Color.yellow);if(evt.getSource()==green)c.setBackground(Color.green);repaint();//重繪

}//主程式

publicstaticvoidmain(String[]args){//建立Swing應用程式

Ch09_03app=newCh09_03();//關閉視窗事件,結束程式的執行

app.addWindowListener(newWindowAdapter(){publicvoidwindowClosing(WindowEventevt){System.exit(0);}});app.setSize(300,200);//設定尺寸

app.setVisible(true);//顯示視窗

}}2023/10/627範例3:建立toolbar(2/2)實2023/10/628檔案與色彩選擇元件-說明Swing套件擁有瀏覽檔案系統選取檔案或資料夾的JFileChooser和選取色彩的JColorChooser元件2種選擇元件，這2個元件都是繼承自JComponent，其繼承架構如下圖所示：2023/10/628檔案與色彩選擇元件-說明Swing套件2023/10/629JFileChooser檔案選擇元件-說明JFileChooser檔案選擇元件可以顯示對話方塊瀏覽檔案系統，以便讓使用者選取檔案或資料夾。2023/10/629JFileChooser檔案選擇元件-2023/10/630JFileChooser檔案選擇元件-開啟檔案對話方塊例如：開啟或儲存指定檔案，如下所示：JFileChooserjfc=newJFileChooser();上述程式碼建立JFileChooser物件後，使用showOpenDialog()方法顯示開啟檔案對話方塊，如下所示：intn=jfc.showOpenDialog(Ch11_4_1.this);if(n==JFileChooser.APPROVE_OPTION){Filefile=jfc.getSelectedFile();

……}2023/10/630JFileChooser檔案選擇元件-2023/10/631JFileChooser檔案選擇元件-儲存檔案對話方塊儲存檔案對話方塊是使用showSaveDialog()方法來顯示，如下所示：intm=jfc.showSaveDialog(Ch11_4_1.this);if(m==JFileChooser.APPROVE_OPTION){Filefile=jfc.getSelectedFile();

……}2023/10/631JFileChooser檔案選擇元件-2023/10/632範例4:使用FileChooser元件(1/3)基本宣告：/*程式範例:Ch09_04.java*/importjava.io.*;importjava.awt.*;importjava.awt.event.*;importjavax.swing.*;importjavax.swing.filechooser.*;//繼承JFrame類別publicclassCh09_04extendsJFrame{//建構子

publicCh09_04(){super("JFileChooser元件範例");Containerc=getContentPane();//建立擁有捲動軸的文字區域元件

finalJTextAreaarea=newJTextArea(15,30);JScrollPanescroll=newJScrollPane(area);//建立JFileChooser元件

finalJFileChooserjfc=newJFileChooser();JPanelbutton=newJPanel();//按鈕的JPanel2023/10/632範例4:使用FileChooser元件2023/10/633範例4:使用FileChooser元件(2/3)新增兩個按鈕及傾聽者及事件處理方法：

JButtonopen=newJButton("開啟檔案");open.addActionListener(newActionListener(){publicvoidactionPerformed(ActionEventevt){intn=jfc.showOpenDialog(Ch09_04.this);if(n==JFileChooser.APPROVE_OPTION){Filefile=jfc.getSelectedFile();area.append("開啟檔案名稱:");area.append(file.getName()+"\n");}}});button.add(open);//建立儲存檔案按鈕

JButtonsave=newJButton("儲存檔案");save.addActionListener(newActionListener(){publicvoidactionPerformed(ActionEventevt){intm=jfc.showSaveDialog(Ch09_04.this);if(m==JFileChooser.APPROVE_OPTION){Filefile=jfc.getSelectedFile();area.append("儲存檔案名稱:");area.append(file.getName()+"\n");}}});button.add(save);c.add(scroll,BorderLayout.CENTER);c.add(button,BorderLayout.SOUTH);}2023/10/633範例4:使用FileChooser元件2023/10/634練習１參考範例２，範例３，範例４建立一個類似筆記本畫面的視窗2023/10/634練習１參考範例２，範例３，範例４建立一2023/10/635範例4:使用FileChooser元件(3/3)主程式：publicstaticvoidmain(String[]args){//建立Swing應用程式

Ch09_04app=newCh09_04();//關閉視窗事件,結束程式的執行

app.addWindowListener(newWindowAdapter(){publicvoidwindowClosing(WindowEventevt){System.exit(0);}});app.setSize(300,200);//設定尺寸

app.setVisible(true);//顯示視窗

}}2023/10/635範例4:使用FileChooser元件2023/10/636JColorChooser色彩選擇元件-說明JColorChooser色彩選擇元件提供多種標籤和調色盤的色彩選擇對話方塊，如果Java應用程式需要讓使用者選擇色彩，就可以使用JColorChooser元件，如右圖所示：2023/10/636JColorChooser色彩選擇元件2023/10/637JColorChooser色彩選擇元件-建立物件JColorChooser色彩選擇元件的建立，如下所示：JColorChooserjcc=newJColorChooser();程式碼建立JColorChooser物件後，使用showDialog()方法顯示色彩選擇對話方塊，如下所示：ColornewColor=jcc.showDialog(Ch11_4_2.this,"選擇背景色彩",c.getBackground());if(newColor!=null)c.setBackground(newColor);2023/10/637JColorChooser色彩選擇元件2023/10/638多重視窗介面JInternalFrame-說明一般來說，視窗應用程式都不會只有一個視窗，如果需要在JFrame視窗開啟其它視窗，就可以使用JInternalFrame類別在JFrame視窗內建立多重視窗。其繼承架構如下圖所示：2023/10/638多重視窗介面JInternalFram2023/10/639多重視窗介面JInternalFrame-JDesktopPane和JLayeredPane類別JInternalFrame物件是新增在JDesktopPane物件（在使用上如同JFrame的ContentPane），所以需要先建立JDesktopPane物件，如下所示：JDesktopPanejdesktop=newJDesktopPane();上述程式碼建立JDesktopPane物件後，JInternalFrame物件就是新增到此容器物件，因為JDesktopPane是JLayeredPane的子類別，所以能夠建立多個重疊的內層視窗。2023/10/639多重視窗介面JInternalFram2023/10/640多重視窗介面JInternalFrame-JInternalFrame類別(說明)JInternalFrame類別在JInternalFrame類別部分，筆者準備直接繼承JInternalFrame建立InternalFrame類別。2023/10/640多重視窗介面JInternalFram2023/10/641多重視窗介面JInternalFrame-JInternalFrame類別(範例)classInternalFrameextendsJInternalFrame{staticintiframeCount=0;staticfinalintoffsetX=25;staticfinalintoffsetY=25;publicInternalFrame(){super("內層視窗:"+(++iframeCount),true,//可調整尺寸

true,//可關閉

true,//可最大化

true);//可縮小成圖示

setSize(300,200);//設定尺寸

//設定位置

setLocation(offsetX*iframeCount,offsetY*iframeCount);}}2023/10/641多重視窗介面JInternalFram2023/10/642多重視窗介面JInternalFrame-JInternalFrame類別(createInternalFrame()方法)privatevoidcreateInternalFrame(){InternalFrameiframe=newInternalFrame();iframe.setVisible(true);//顯示內層視窗

jdesktop.add(iframe);//加入上層視窗

try{iframe.setSelected(true);}catch(java.beans.PropertyVetoExceptione){}}2023/10/642多重視窗介面JInternalFramCh22_Main.javaimportjavax.swing.*;importjava.awt.*;importjava.awt.event.*;classCh22_Main{publicstaticvoidmain(String[]args){Ch22_Win_09w=newCh22_Win_09();w.setSiz