JAVA用戶界面設(shè)計(jì)

JAVA用戶界面設(shè)計(jì)課程目標(biāo)Swing簡(jiǎn)介Swing常用的控件窗體布局事件和事件處理設(shè)計(jì)窗體swing簡(jiǎn)介Swing類Swing類是一組類，它提供比AWT標(biāo)準(zhǔn)組件更強(qiáng)大和更靈活的功能。除了我們已經(jīng)熟悉的組件如按鈕、復(fù)選框和標(biāo)簽外，Swing類還提供了許多新的組件，如選項(xiàng)卡窗格、滾動(dòng)窗格、樹、表格等。Swing類的層次結(jié)構(gòu)

java.awt.Component

-java.awt.Container

-java.awt.Window

-java.awt.Frame-javax.swing.JFrame

-javax.Dialog-javax.swing.JDialog

-javax.swing.JWindow

-java.awt.Applet-javax.swing.JApplet

-javax.swing.Box

-javax.swing.Jcomponet

JFrame與FrameJFrame是在Swing中經(jīng)常使用到的組件，大家可以把它看成是最底層的容器。這個(gè)容器里面可以裝載各種Swing的控件類（例如JLabel、JButton等等），也可以裝載其他的容器。至于如何擺放這些控件和容器，Swing的解決辦法和AWT是一樣的，都應(yīng)用了一套相同的版面管理器。JFrame類繼承了Frame類，所以JFrame的功能要比Frame的功能多得多。常用控件組件類名稱功能JButton按鈕用來(lái)進(jìn)行點(diǎn)擊觸發(fā)事件，實(shí)現(xiàn)具體操作JLabel標(biāo)簽放置提示性的圖片或文字JTextField文本域支持單行文本輸入JTextArea文本區(qū)支持多行文本輸入JRadioButton單選框支持單項(xiàng)選擇JCheckbox復(fù)選框支持多項(xiàng)選擇JList列表框列出所有的選項(xiàng)進(jìn)行選擇JComboBox選擇框列出所有的選項(xiàng)進(jìn)行選擇，并且支持自定義選項(xiàng)按鈕（JButton）按鈕在窗體界面程序設(shè)計(jì)中是最常用的控件，Swing中提供以下的構(gòu)造函數(shù)來(lái)建立一個(gè)按鈕對(duì)象： JButton() 建立一個(gè)按鈕JButton(Iconicon) 建立一個(gè)有圖像的按鈕JButton(Stringtext) 建立一個(gè)有文字標(biāo)簽的按鈕JButton(Stringtext,Iconicon) 建立一個(gè)有圖像和文字的按鈕

JButton常用的方法如下： addActionListener(ActionListenerI) 在按鈕上添加事件監(jiān)聽器 grabFocus() 請(qǐng)求焦點(diǎn) setEnable(booleanb) 設(shè)置按鈕是否可用 setVisible(booleanb) 設(shè)置按鈕是否可見(jiàn)示例

importjava.awt.*; importjavax.swing.*; publicclassJButtonAppextendsJFrame{ Containercon=this.getContentPane(); JButtonbutton1=newJButton("按鈕一"); JButtonbutton2=newJButton("按鈕二"); JButtonbutton3=newJButton("按鈕三"); publicJButtonApp(){ super("JButton示例"); con.setLayout(newFlowLayout()); button1.setEnabled(false); button2.setVisible(false); con.add(button1); con.add(button2); con.add(button3); this.pack(); this.show(); } publicstaticvoidmain(String[]args){ newJButtonApp(); } }標(biāo)簽（JLabel）這個(gè)組件主要用來(lái)放置提示性的文本或圖形。以下是JLabel類的構(gòu)造函數(shù)和常用方法。構(gòu)造函數(shù)：

JLabel() 建立一個(gè)空白的標(biāo)簽組件。 JLabel(Iconimage)

建立一個(gè)含有圖標(biāo)的標(biāo)簽組件，默認(rèn)排列方式為CENTER。 JLabel(Iconimage,inthorizontalAlignment)

建立一個(gè)含有圖標(biāo)的標(biāo)簽組件，并指定其排列方式。 JLabel(Stringtext)

建立一個(gè)含有文字的標(biāo)簽組件，默認(rèn)排列方式為L(zhǎng)EFT。 JLabel(Stringtext,inthorizontalAlignment)

建立一個(gè)含有文字的標(biāo)簽組件，并指定其排列方式。 JLabel(Stringtext,Iconicon,inthorizontalAlignment)

建立一個(gè)含有文字和圖標(biāo)的標(biāo)簽組件，并指定其排列方式。Jlabel的常用方法setHorizontalAlignment(intalignment)

設(shè)置標(biāo)簽內(nèi)文字或圖像的水平位置。setHorizontalTextPosition(inttextPosition)

設(shè)置標(biāo)簽內(nèi)文字相對(duì)于圖像的水平位置。setIcon(Iconicon)

設(shè)置標(biāo)簽內(nèi)的圖像。setIconTextGap(inticonTextGap)

設(shè)置標(biāo)簽內(nèi)文字與圖像的間距。setText(Stringtext)

設(shè)置標(biāo)簽內(nèi)的文字。setVerticalAlignment(intalignment)

設(shè)置標(biāo)簽內(nèi)文字或圖像的垂直位置。setVerticalTextPosition(inttextPosition)

設(shè)置標(biāo)簽內(nèi)文字相對(duì)于圖像的垂直位置。示例 importjava.awt.*; importjavax.swing.*; publicclassJLabelAppextendsJFrame{ Containercon=this.getContentPane(); JLabellabel1=newJLabel("第一個(gè)標(biāo)簽"); JLabellabel2=newJLabel("第二個(gè)標(biāo)簽"); JLabellabel3=newJLabel("第三個(gè)標(biāo)簽");

publicJLabelApp(){ super("JLabel示例");

con.setLayout(newGridLayout(1,3));

label1.setHorizontalAlignment(JLabel.RIGHT);

label2.setVerticalAlignment(JLabel.BOTTOM);

con.add(label1);

con.add(label2);

con.add(label3);

this.setSize(300,200);

this.show();

}

publicstaticvoidmain(String[]args){

newJLabelApp();

}

}文本域（JTextField）JTextField是一種單行文本輸入組件。構(gòu)造函數(shù)：JTextField()

建立一個(gè)文本域。JTextField(Documentdoc,Stringtext,intcolumns)

使用指定的文件存儲(chǔ)模式建立一個(gè)文本域，并且設(shè)置其 初始字符串和字段長(zhǎng)度。JTextField(intcolumns)

建立一個(gè)文本域，并設(shè)置其初始字段長(zhǎng)度。JTextField(Stringtext)

建立一個(gè)文本域，并設(shè)置其初始字符串。JTextField(Stringtext,intcolumns)

建立一個(gè)文本域，并設(shè)置其初始字符串和字段長(zhǎng)度。JTextField的常用方法setColumns(intcolumns) 設(shè)置文本域的字段長(zhǎng)度setEditable(booleanb) 設(shè)置文本域是否可編輯setFont(Fontfont) 設(shè)置文本域內(nèi)文本字體setText(Stringtext) 設(shè)置文本域的字符串JTextField示例

importjava.awt.*; importjavax.swing.*; publicclassJTextFieldAppextendsJFrame{ Containercon=this.getContentPane(); JTextFieldtextField1=newJTextField(); JTextFieldtextField2=newJTextField("第二個(gè)文本框"); JTextFieldtextField3=newJTextField("第三個(gè)文本框",10); publicJTextFieldApp(){ super("JTextField示例"); con.setLayout(newFlowLayout()); textField1.setColumns(10); textField2.setEditable(false); con.add(textField1); con.add(textField2); con.add(textField3); this.pack(); this.show(); } publicstaticvoidmain(String[]args){ newJTextFieldApp(); } }選擇框（JComboBox）JComboBox組件一般被稱為下拉式列表框，它可以讓用戶瀏覽一系列的選項(xiàng)并選出或自己輸入想要的值。JComboBox的構(gòu)造方法和常用的使用方法如下：構(gòu)造方法：

JComboBox()

建立一個(gè)新的JComboBox組件 JComboBox(ComboBoxModelaModel)

利用ComboBoxModel建立一個(gè)新的JComboBox組件 JComboBox(Object[]items)

利用Array數(shù)組對(duì)象建立一個(gè)新的JComboBox組件 JComboBox(Vectoritems)

利用Vector矢量集對(duì)象建立一個(gè)新的JComboBox組件JComboBox常用的方法：

voidaddItem(Objectobj)

將對(duì)象obj添加到下拉列表框顯示的項(xiàng)目中。intgetItemCount()

返回下拉列表框的項(xiàng)目的總數(shù)。ObjectgetSelectedItem()

返回當(dāng)前選中的項(xiàng)目。voidremoveAllItems()

移除下拉列表框中所有的項(xiàng)目。voidremoveItemAt(intindex)

移除項(xiàng)目索引值為index的項(xiàng)目。voidsetEditable(booleanb)

設(shè)置下拉列表框是否可編輯。voidsetSelectedIndex(intindex)

設(shè)置索引值為index的項(xiàng)目的狀態(tài)為已選中。示例

importjava.awt.*; importjavax.swing.*; publicclassJComboBoxAppextendsJFrame{ JComboBoxyearBox1=newJComboBox(); JComboBoxyearBox2=newJComboBox(); JComboBoxmonthBox1=newJComboBox(); JComboBoxmonthBox2=newJComboBox(); JPanelpanel=newJPanel(); JLabelstartDate=newJLabel("開始日期"); JLabelendDate=newJLabel("終止日期");

publicJComboBoxApp(){ super("JComboBox示例"); this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); panel.add(startDate); for(inti=2000;i<=2008;i++) yearBox1.addItem(i+""); for(inti=1;i<31;i++) monthBox1.addItem(i+""); panel.add(yearBox1); panel.add(monthBox1); panel.add(endDate); for(inti=2000;i<=2008;i++) yearBox2.addItem(i+""); for(inti=1;i<31;i++) monthBox2.addItem(i+""); panel.add(yearBox2); panel.add(monthBox2); this.setSize(180,110); this.setContentPane(panel); this.show(); } publicstaticvoidmain(Stringargs[]){ newJComboBoxApp(); } }小結(jié)1.JTextField創(chuàng)建及常用方法2.JLabel創(chuàng)建及常用方法3.JComboBox創(chuàng)建及常用方法4.什么是容器窗體布局為什么要使用布局管理不同的平臺(tái)對(duì)圖形界面的管理也是不盡相同的，所以如果我們采用絕對(duì)定位的方法管理JAVA圖形界面的布局，那么當(dāng)程序運(yùn)行在不同的設(shè)備上的時(shí)候（比如分辨率變化了、現(xiàn)實(shí)設(shè)備不同了），窗體外觀就會(huì)變形。最長(zhǎng)常見(jiàn)的變形是：窗口超出了屏幕邊緣，跑到外邊了；控件位置亂了，甚至相互重疊在一起；窗口特別小，看不清（往往是分辨率極高的情況下）等超出顯示區(qū)域無(wú)法滿屏顯示三種常用的布局FlowLayout布局GridLayout布局BorderLayout布局流水布局網(wǎng)格布局邊框布局布局FlowLayout布局FlowLayout布局是一個(gè)相當(dāng)簡(jiǎn)單的排列方法，形如其名FlowLayout就如同流水一般，將加入其中的組件一個(gè)接著一個(gè)從左往右依次排列下去構(gòu)造方法：FlowLayout()

建立一個(gè)新的FlowLayout，此FlowLayout默認(rèn)為居中對(duì)齊，而且組件彼此之間有5單位的水平與垂直間距。FlowLayout(intalign)

建立一個(gè)新的FlowLayout，此FlowLayout可設(shè)置排列方式，而且組件彼此之間有5單位的水平與垂直間距。FlowLayout(intalign,inthgap,intvgap)

建立一個(gè)新的FlowLayout，此FlowLayout可設(shè)置排列方式與組件間距。FlowLayout類的后兩個(gè)構(gòu)造方法均有參數(shù)，其中參數(shù)align可以設(shè)定FlowLayout布局中的組件靠什么方向排列。FlowLayout共有五種排列方式CENTER(默認(rèn)值)LEFTRIGHTLEADINGTRAILING示例

importjava.awt.*; publicclassFlowLayoutAppextendsFrame{ ButtonbuttonLeft=newButton("左按鈕"); ButtonbuttonCenter=newButton("中間按鈕"); ButtonbuttonRight=newButton("右按鈕"); publicFlowLayoutApp(){ super("FlowLayout示例"); this.setLayout(newFlowLayout()); this.add(buttonLeft); this.add(buttonCenter); this.add(buttonRight); this.setSize(200,120); this.show(); } publicstaticvoidmain(Stringargs[]){ newFlowLayoutApp(); } }GridLayout布局GridLayout比FlowLayout多了行和列的設(shè)置，也就是說(shuō)你要先設(shè)置GridLayout共有幾行幾列，就如同一個(gè)二維平面一般，然后添加GridLayout布局中的組件會(huì)填充第一行的格子，然后再?gòu)牡诙虚_始填。依此類推，就像是填充一個(gè)個(gè)格子一般，而且GridLayout布局管理器會(huì)將填進(jìn)去的組件設(shè)置為一樣大。構(gòu)造方法：

GridLayout() 建立一個(gè)新的GridLayout布局，默認(rèn)值為一行一列 GridLayout(introws,intcols)建立一個(gè)指定了幾行幾列的GridLayout布局 GridLayout(introws,intcols,inthgap,intvgap) 建立一個(gè)指定了幾行幾列GridLayout 布局，并設(shè)置組件的垂直和水平間距示例

importjava.awt.*; publicclassGridLayoutAppextendsFrame{ Buttonbutton11=newButton("第一行第一列"); Buttonbutton12=newButton("第一行第二列"); Buttonbutton21=newButton("第二行第一列"); Buttonbutton22=newButton("第二行第二列"); publicGridLayoutApp(){ super("GridLayout示例"); this.setLayout(newGridLayout(2,2)); this.add(button11); this.add(button12); this.add(button21); this.add(button22); setSize(180,160); show(); } publicstaticvoidmain(Stringargs[]){ newGridLayoutApp(); } }BorderLayout布局BorderLayout將版面劃分成東、西、南、北、中五個(gè)區(qū)域，大家可以將組件放在這五個(gè)區(qū)域中的某個(gè)區(qū)域里。要使用BorderLayout，只要在容器中設(shè)置使用BorderLayout這種版面管理即可。構(gòu)造方法：

BorderLayout()建立一個(gè)組件間沒(méi)有間距的BorderLayout布局

BorderLayout(inthgap,intvgap)建立一個(gè)組件間有間距的BorderLayout布局。示例

importjava.awt.*; publicclassBorderLayoutAppextendsFrame{ ButtonbuttonNorth=newButton("北邊"); ButtonbuttonWest=newButton("西邊"); ButtonbuttonSouth=newButton("南邊"); ButtonbuttonEast=newButton("東邊"); ButtonbuttonCenter=newButton("中間"); publicBorderLayoutApp(){ super("BorderLayout示例"); this.setLayout(newBorderLayout()); this.add(buttonNorth,BorderLayout.NORTH); this.add(buttonWest,BorderLayout.WEST); this.add(buttonSouth,BorderLayout.SOUTH); this.add(buttonEast,BorderLayout.EAST); this.add(buttonCenter,BorderLayout.CENTER); setSize(180,160); show(); } publicstaticvoidmain(Stringargs[]) { newBorderLayoutApp(); }其它布局方式另外還有兩種布局CardLayout布局和GridBagLayout布局。

CardLayout布局的功能就如同你將很多張卡片疊在一起，你一次只能看到其中一張卡片，但是你可以任意抽出其中一張卡片來(lái)看。

GridBagLayout布局是使用網(wǎng)格單元，指定組件的相對(duì)布置，即在一個(gè)網(wǎng)格的單元中指定它們的位置，每個(gè)組件的網(wǎng)格單元的大小可以不同，每個(gè)網(wǎng)格的每一行可以有不同的列數(shù)。對(duì)話框在Windows平臺(tái)下用MessageBox來(lái)實(shí)現(xiàn)和用戶的交互功能，在JAVA中也有同樣的類來(lái)實(shí)現(xiàn)這樣的功能，利用Swing中提供的JOptionPane類。四個(gè)標(biāo)準(zhǔn)對(duì)話框如下：MessageDialog（消息對(duì)話框） 用來(lái)顯示信息給用戶。ConfirmDialog（確認(rèn)對(duì)話框） 提出問(wèn)題，然后由用戶自己來(lái) 確認(rèn)（按"Yes"或"No"按鈕）InputDialog（輸入對(duì)話框） 提示輸入文本。OptionDialog（選項(xiàng)對(duì)話框） 組合其它三個(gè)對(duì)話框類型。消息對(duì)話框消息對(duì)話框是一個(gè)簡(jiǎn)單的顯示消息的窗口，只是給用戶提供提示信息。如圖所示消息對(duì)話框：消息對(duì)話框可以通過(guò)調(diào)用JOptionPane類的showMessageDialog(Compont,Object)方法來(lái)創(chuàng)建，參數(shù)是父組件和字符串（或者組件、顯示的圖標(biāo)）。如以下語(yǔ)句創(chuàng)建一個(gè)顯示簡(jiǎn)單字符的消息對(duì)話框：

JOptionPane.showMessagDialog(null,”WelcomeToQinghuaIT…”);還可以使用showMessageDialog(Component,Object,String,int)方法來(lái)創(chuàng)建一個(gè)顯示警告消息的對(duì)話框，可以自己設(shè)置想要顯示的消息對(duì)話框的標(biāo)題。用法同showInputDialog()方法，參數(shù)相同但無(wú)返回值。如以下語(yǔ)句創(chuàng)建一個(gè)消息輸入對(duì)話框：

JOptionPane.showMessagDialog(null,”文件被刪除”,”刪除警告”,JOptionPane.WARNING_MESSAGE);確認(rèn)對(duì)話框創(chuàng)建確認(rèn)對(duì)話框的最簡(jiǎn)單方法就是調(diào)用showConfirmDialog(Component,Object)方法，參數(shù)意義同消息對(duì)話框中的參數(shù)相同。 不同的是該方法返回一個(gè)整數(shù)，JOptionPane的三個(gè)屬性：YES_OPTIONNO_OPTIONCANCEL_OPTION示例

importjava.awt.*; importjavax.swing.*; importjava.awt.event.*; importjava.util.EventListener; publicclassMessageDialogAppextendsJFrameimplementsActionListener{ JButtonbutton1=newJButton("顯示消息對(duì)話框一");

JButtonbutton2=newJButton("顯示消息對(duì)話框二");

publicMessageDialogApp(){

super("MessageDialog示例");

this.setLayout(newFlowLayout());

button1.addActionListener(this);

button2.addActionListener(this);

this.add(button1);

this.add(button2);

this.setSize(180,160);

this.show();

}

publicstaticvoidmain(Stringargs[]){

newMessageDialogApp();

}

publicvoidactionPerformed(ActionEvente){

if(e.getSource()==button1){

JOptionPane.showMessageDialog(null,"WelcomeToQinghuaIT...");

}

if(e.getSource()==button2){

JOptionPane.showMessageDialog(null,"出現(xiàn)錯(cuò)誤",

"錯(cuò)誤警告",JOptionPane.WARNING_MESSAGE);

}

}

}輸入對(duì)話框輸入對(duì)話框提出一個(gè)問(wèn)題，并使用文本域來(lái)存儲(chǔ)響應(yīng)。創(chuàng)建輸入對(duì)話框的最簡(jiǎn)單方法就是調(diào)用showInoutDialog(ComponertObject)方法，參數(shù)和消息對(duì)話框中的參數(shù)相同。調(diào)用輸入對(duì)話框方法返回一個(gè)表示用戶響應(yīng)的字符串。如以下語(yǔ)句創(chuàng)建了一個(gè)簡(jiǎn)單的輸入對(duì)話框：

StringinputText=IOptionPane.showInputDialog(null,“請(qǐng)輸入你的姓名:”);示例

importjava.awt.*; importjavax.swing.*; importjava.awt.event.*; importjava.awt.event.ActionListener; importjava.util.EventListener; publicclassInputDialogAppextendsJFrameimplementsActionListener{ JButtonbutton1=newJButton("輸入你的姓名"); JLabellabel=newJLabel("你的姓名是："); publicInputDialogApp(){ super("InputDialog示例"); this.setLayout(newFlowLayout()); button1.addActionListener(this); this.add(button1); this.add(label); this.setSize(200,120); this.show(); } publicstaticvoidmain(Stringargs[]){ newInputDialogApp(); } publicvoidactionPerformed(ActionEvente){ if(e.getSource()==button1){ StringinputText=JOptionPane.showInputDialog(this,"你的姓名是："); this.label.setText("你的姓名是:"+inputText); } } }小結(jié)1.對(duì)話框的種類(消息、警告、確認(rèn)、輸入對(duì)話框) 2.如何打開各種對(duì)話框事件用戶對(duì)程序進(jìn)行控制的過(guò)程，實(shí)際上是通過(guò)激發(fā)系統(tǒng)的一些事件而通知程序的程序根據(jù)事件不同，進(jìn)行不同的處理，比如：鍵盤輸入鼠標(biāo)點(diǎn)擊手寫輸入U(xiǎn)盤插入常用事件對(duì)于java開發(fā)來(lái)說(shuō)，能夠接受事件信息并處理的類主要是AWT和后續(xù)講解的swing圖形界面類中絕大多數(shù)界面設(shè)計(jì)元素都支持事件處理，而常用的是：鼠標(biāo)和鍵盤操作當(dāng)程序收到用戶的操作，則執(zhí)行相應(yīng)事件代碼，并進(jìn)行必要處理發(fā)生事件AWT中的事件JAVA事件的處理機(jī)制大家可能已經(jīng)注意到了上面的程序中，按下按鈕后不會(huì)觸發(fā)任何事件。如果想在按下按鈕時(shí)，實(shí)現(xiàn)一定的功能，就必須進(jìn)入程序內(nèi)部，編寫用于決定要發(fā)生什么事情的代碼。在這里就用到了JAVA的事件處理機(jī)制。在事件的處理過(guò)程中，主要涉及三個(gè)對(duì)象：Event-事件EventSource-事件源Eventhandler-事件處理者用戶對(duì)界面操作在JAVA語(yǔ)言上的描述，以類的形式出現(xiàn)，例如鍵盤操作對(duì)應(yīng)的事件類是KeyEvent事件發(fā)生的場(chǎng)所，通常就是各個(gè)組件，例如按鈕Button接收事件并對(duì)其進(jìn)行處理的對(duì)象事件按鈕事件importjava.awt.*; importjava.awt.event.ActionEvent; importjava.awt.event.ActionListener; publicclassButtonEventAppextendsJFrame{

JButtonmyButton=newJButton("測(cè)試按鈕"); publicButtonEventApp(){ super