《SWT圖形用戶界面》PPT課件.ppt

《《SWT圖形用戶界面》PPT課件.ppt》由會(huì)員分享，可在線閱讀，更多相關(guān)《《SWT圖形用戶界面》PPT課件.ppt（46頁(yè)珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。

第四章SWT圖形用戶界面,本章要點(diǎn)1．SWT程序開(kāi)發(fā)步驟。2．SWT常用組件的使用。3．SWT的布局。4．SWT的事件處理。5．SWTDesigner簡(jiǎn)介。本章難點(diǎn)1．SWT常用組件的使用。2.SWT的布局。3.SWT的事件處理。,4.1SWT/JFace簡(jiǎn)介,SWT（StandardWidgetToolkit）即標(biāo)準(zhǔn)小窗口工具箱，是IBM公司推出的一種在Eclipse中使用的集成開(kāi)發(fā)環(huán)境。JFace是一個(gè)用戶界面工具箱，也是一個(gè)易用、功能強(qiáng)大的圖形包，它簡(jiǎn)化了常見(jiàn)的圖形用戶界面的編程任務(wù)。SWT和JFace都是Eclipse平臺(tái)上的主要組件。,4.1.1SWT程序開(kāi)發(fā)步驟,在eclipse的plugins目錄下，可以找到文件org.eclipse.swt.win32.win32.x86_3.2.1.v3235.jar，在DOS狀態(tài)下，用jar命令將該文件解壓，命令格式如下：Jarxforg.eclipse.swt.win32.win32.x86_3.2.1.v3235.jar解壓后得到以下4個(gè)SWT的原生庫(kù)文件：swt-win32-3235.dllswt-awt-win32-3235.dllswt-gdip-win32-3235.dllswt-wgl-win32-3235.dll,按以下方法設(shè)置SWT原生庫(kù)文件，以便Java啟動(dòng)時(shí)訪問(wèn)：方法一：將這四個(gè)DLL文件復(fù)制到j(luò)re的bin目錄下。方法二：設(shè)置環(huán)境變量，在PATH中加入這幾個(gè)dll文件所在的目錄。方法三：在eclipse的Java項(xiàng)目中導(dǎo)入原生庫(kù)文件。操作方法：在eclipse的包資源管理器中，右單擊項(xiàng)目名→導(dǎo)入→常規(guī)→文件系統(tǒng)→下一步→瀏覽→選擇DLL文件所在目錄→確定→勾選DLL文件→完成。,,導(dǎo)入SWT的原生庫(kù)文件后，還要在eclipse的Java項(xiàng)目中配置構(gòu)建路徑，添加外部JAR，將文件org.eclipse.swt.win32.win32.x86_3.2.1.v3235.jar加入到項(xiàng)目中，操作方法：在eclipse的包資源管理器中，右單擊項(xiàng)目名→構(gòu)建路徑→配置構(gòu)建路徑→庫(kù)（L）→添加外部JAR→在eclipse的plugins文件夾中找到該jar文件→打開(kāi)→確定。例4.1在Java應(yīng)用程序中使用SWT的組件。,創(chuàng)建一個(gè)典型的SWT應(yīng)用程序需要以下步驟：①創(chuàng)建一個(gè)Display②創(chuàng)建一個(gè)或多個(gè)Shell③設(shè)置Shell的布局④創(chuàng)建Shell中的組件⑤用open()方法打開(kāi)Shell窗體⑥寫一個(gè)事件轉(zhuǎn)發(fā)循環(huán)⑦銷毀display,4.1.2SWT中的包,org.eclipse.swt.widgetsorg.eclipse.swt.layoutorg.eclipse.swt.customorg.eclipse.swt.eventorg.eclipse.swt.graphicsorg.eclipse.swt.ole.win32OLE是微軟的組件技術(shù)，全稱叫對(duì)象鏈接與嵌入。通過(guò)這個(gè)包使得SWT程序也可以內(nèi)嵌IE瀏覽器或Word、Excel等程序。,4.2SWT/JFace常用組件,4.2.1按鈕組件Button類的構(gòu)造方法：Button(Compositeparent,intstyle)該方法有兩個(gè)參數(shù)：parent是指Button創(chuàng)建在哪一個(gè)容器上。Composite（面板）是最常用的容器，Shell（窗體）繼承自Composite，此參數(shù)也能接受Shell和任何繼承自Compsite的類。style用來(lái)指定Button的式樣。SWT組件可以在構(gòu)造方法中使用式樣（style）來(lái)聲明組件的外觀形狀和文字的式樣。SWT其他組件的構(gòu)造方法和Button類相似，參數(shù)的含義也相同。,Button組件常用式樣SWT.PUSH：按鈕。SWT.CHECK：多選按鈕。SWT.RADIO：?jiǎn)芜x按鈕。SWT.ARROW：箭頭按鈕。SWT.NONE：默認(rèn)按鈕。SWT.CENTER：文字居中，與SWT.NONE相同。SWT.LEFT：文字靠左。SWT.RIGHT：文字靠右。SWT.BORDER：深陷型按鈕。SWT.FLAT：平面型按鈕。一個(gè)Button也可以指定多個(gè)式樣，只要將指定的各個(gè)式樣用符號(hào)“|”連接起來(lái)即可,Button組件的常用方法：setText(Stringstring)：設(shè)置組件的標(biāo)簽文字。setBounds(intx,inty,intwidth,intheight)：設(shè)置組件的坐標(biāo)位置和大?。▁軸坐標(biāo)，y軸坐標(biāo)，組件寬度width，組件高度height）。setEnabled(Booleanenabled)：設(shè)置組件是否可用。true：可用（默認(rèn)值），false：不可用。setFont(Fontfont)：設(shè)置文字的字體。setForeground(Colorcolor)：設(shè)置前景色。setBackgrount(Colorcolor)：設(shè)置背景色。setImage(Imageimage)：設(shè)置顯示的圖片。,setSelection(Booleanselected)：設(shè)置是否選中（僅對(duì)復(fù)選框或單選框有效）。true：選中，false：未選中（默認(rèn)值）。setToolTipText(Stringstring)：設(shè)置鼠標(biāo)停留在組件上時(shí)出現(xiàn)的提示信息。例4.2按鈕示例。,4.2.2標(biāo)簽組件,標(biāo)簽（Label類）組件是SWT中最簡(jiǎn)單的組件。Label類的構(gòu)造方法和Button類相似，參數(shù)的含義與相同，格式如下：Label(Compositeparent,intstyle)Label類的常用式樣有以下幾種：Label類常用的式樣如下：SWT.CENTER：文字居中。SWT.RIGHT：文字靠右。SWT.LEFT：文字靠左。SWT.NONE：默認(rèn)式樣。,SWT.WRAP：自動(dòng)換行。SWT.BORDER：深陷型。SWT.SEPARATOR：分欄符，默認(rèn)為豎線分欄。SWT.HORIZONTAL：橫線分欄符。例4.3標(biāo)簽示例,4.2.3文本框組件,文本框（Text類）的式樣如下：SWT.NONE：默認(rèn)式樣。SWT.CENTER：文字居中。SWT.LEFT：文字靠左。SWT.RIGHT：文字靠右。SWT.MULTI：可以輸入多行，須回車換行。SWT.WRAP：可以輸入多行，到行尾后自動(dòng)換行。SWT.PASSWORD：密碼型，輸入字符顯示成“*”。SWT.BORDER：深陷型。SWT.V_SCROLL：帶垂直滾動(dòng)條。SWT.H_SCROLL：帶水平滾動(dòng)條。例4.4各種文本框示例。,4.2.4下拉框組件,1．下拉框（Combo類）的式樣SWT.NONE：默認(rèn)式樣。SWT.READ_ONLY：只讀。SWT.SIMPLE：無(wú)須單擊下拉框，列表會(huì)一直顯示。2．下拉框（Combo類）的常用方法add(Stringstring)：在Combo中增加一項(xiàng)。add(Stringstring,intindex)：在Combo的第index項(xiàng)后插入一項(xiàng)。deselectAll()：使Combo組件中的當(dāng)前選擇項(xiàng)置空。removeAll()：將Combo中的所有選項(xiàng)清空。,setItems(String[]items)：將數(shù)組中的各項(xiàng)依次加入到Combo中。select(intindex)：將Combo的第index+1項(xiàng)設(shè)置為當(dāng)前選擇項(xiàng)。例4.5下拉框示例,4.2.5列表框組件,1．列表框（List類）的式樣SWT.NONE：默認(rèn)式樣。SWT.V_SCROLL：帶垂直滾動(dòng)條。SWT.MULTI：允許復(fù)選。SWT.SINGLE：允許單選。2．常用方法列表框（List類）組件的方法和下拉框（Combo類）是一樣的，但由于List可選擇多項(xiàng)，而Combo只能選擇一項(xiàng)，所以List沒(méi)有g(shù)etText()方法，List的取值是用getSelection()方法，返回一個(gè)所有選項(xiàng)組成的String數(shù)組。例4.6列表框示例。,4.2.6菜單,菜單（Menu類，MenuItem類）是常用的SWT組件，Menu是一個(gè)菜單欄，同時(shí)也是一個(gè)容器，可以容納菜單項(xiàng)（MenuItem）。1．Menu的式樣SWT.BAR：菜單欄，用于主菜單。SWT.DROP_DOWN：下拉菜單，用于子菜單。SWT.POP_UP：鼠標(biāo)右鍵彈出式菜單。2．MenuItem的式樣SWT.CASCADE：有子菜單的菜單項(xiàng)。SWT.CHECK：選中后前面顯示一個(gè)小勾。SWT.PUSH：普通型菜單。SWT.RADIO：選中后前面顯示一個(gè)圓點(diǎn)。SWT.SEPARATOR：分隔符。,3．建立菜單的一般步驟：①首先建立一個(gè)菜單欄，需要使用SWT.BAR屬性。MenumainMenu=newMenu(shell,SWT.BAR);②在窗體中指定需要顯示的菜單欄。shell.setMenuBar(mainMenu);③創(chuàng)建頂級(jí)菜單項(xiàng)，需要使用SWT.CASCADE屬性。MenuItemfileItem=newMenuItem(mainMenu,SWT.CASCADE);fileItem.setText("文件,⑤將頂級(jí)菜單項(xiàng)與下拉菜單關(guān)聯(lián)。fileItem.setMenu(fileMenu);二級(jí)菜單的創(chuàng)建只需重復(fù)以上步驟③～⑤。注意：本例創(chuàng)建所有Menu對(duì)象的第一個(gè)參數(shù)都是shell；創(chuàng)建MenuItem對(duì)象的第一個(gè)參數(shù)是該MenuItem所在的Menu對(duì)象；如果某Menu是某MenuItem的子菜單，則還要建立關(guān)聯(lián)：MenuItem.setMenu(Menu)。例4.7菜單的創(chuàng)建。,4.3容器類,通常，組件構(gòu)建在容器類中，容器構(gòu)建在主窗體（shell）中，主窗體也是容器，也就是說(shuō)，容器不僅可以容納組件，也可以容納容器。4.3.1面板,面板（Composite類）是最常用的容器。主窗體（shell）是面板（Composite）的子類。面板的構(gòu)造方法格式如下：Composite(Compositeparent,intstyle)第一個(gè)參數(shù)表示該容器創(chuàng)建在哪個(gè)容器上，第二個(gè)參數(shù)表示容器的式樣。Composite的式樣一般都是用SWT.NONE，這時(shí)Composite在界面是不顯示出來(lái)的，只是發(fā)揮著容器的作用。如果要讓容器形成凹陷效果，可以用SWT.BORDER式樣。,Composite的常用方法：getLayout()：得到布局管理器。getLayoutData()：得到布局?jǐn)?shù)據(jù)。getParent()：得到容納該容器的父容器。getShell()：得到容納該容器的Shell。layout()：將容器上的組件重新布局，相當(dāng)于刷新。例4.8面板示例。,4.3.2分組框,分組框（Group類）是面板（Composite類）的子類，所以兩者用法基本相同。主要區(qū)別是Group顯示有一個(gè)方框，且方框線上還可以顯示說(shuō)明文字。例4.9分組框示例。,4.3.3選項(xiàng)卡,選項(xiàng)卡包括一個(gè)選項(xiàng)卡（TabFolder類）和一個(gè)選項(xiàng)頁(yè)（TabItem類），TabFolder是容器，可以容納其他容器和組件，但TabItem不是容器，可以把它看成是一個(gè)選項(xiàng)標(biāo)簽，TabFolder通過(guò)TabItem來(lái)對(duì)其中的組件進(jìn)行控制。每一個(gè)TabItem用setControl()方法來(lái)控制一個(gè)界面組件。例4.10選項(xiàng)卡示例。,4.4布局管理器,布局管理器常常是專為某一個(gè)復(fù)合組件設(shè)計(jì)的。一些布局管理器只使用它們自身的參數(shù)就可以控制，而另一些布局管理器還需要其它參數(shù)（LayoutData），該參數(shù)是在設(shè)置布局管理器的復(fù)合組件中的每個(gè)控件上指定的。SWT中常用的布局管理器有如下一些：FillLayout：充滿式布局，在容器中以相同的大小以單行或單列排列組件。RowLayout：行列式布局，以單行或多行的方式定制組件的排列方式。GridLayout：網(wǎng)格式布局，以網(wǎng)格的方式進(jìn)行布局，組件可以占用指定的一個(gè)或幾個(gè)網(wǎng)格。FormLayout：表格式布局，通過(guò)定義組件四個(gè)邊的距離來(lái)排列組件，被引用的相對(duì)的組件可以是父組件，也可以是同一容器中的其它組件。,4.4.1充滿式布局,1．構(gòu)造方法：FillLayout()創(chuàng)建按一行充滿容器的對(duì)象。FillLayout(inttype)創(chuàng)建按指定類型充滿容器的對(duì)象，指定類型（type）有：SWT.HORIZONTAL按一行充滿容器。SWT.VERTICAL按一列充滿容器。2．常用屬性：inttype指定組件充滿容器的類型。type的取值同上。例4.11,4.4.2行列式布局,行列式布局（RowLayout類）可以使組件折行顯示，可以設(shè)置邊界距離和間距。另外，還可以對(duì)每個(gè)組件通過(guò)setLayoutData()方法設(shè)置RowData對(duì)象。RowData用來(lái)設(shè)置組件的大小。1．構(gòu)造方法：RowLayout()創(chuàng)建按行放置組件的對(duì)象。RowLayout(inttype)創(chuàng)建按指定類型放置組件的對(duì)象。指定類型（type）有：SWT.VERTICAL按列放置組件。SWT.HORIZONTAL按行放置組件。,2．常用屬性：intmarginWidth：組件距容器邊緣的寬度intmarginHeight：組件距容器邊緣的高度intmarginTop：組件距容器上邊緣的距離intmarginBottom：組件距容器下邊緣的距離intspacing：組件之間的距離，默認(rèn)值為3。booleanjustify：如果該屬性為true，則組件間的距離隨容器的拉伸而變大。默認(rèn)值為false。booleanwrap：如果該屬性為true，則當(dāng)容器空間不足時(shí)會(huì)自動(dòng)折行；如果該屬性為false，不自動(dòng)折行。默認(rèn)值為true。booleanpack：如果該屬性為true，組件大小為設(shè)定值；如果該屬性為false，則強(qiáng)制組件的大小相同。默認(rèn)值為true。inttype：使組件按指定式樣放置，（type=SWT.HORIZONTAL|SWT.VERTICAL），默認(rèn)為按行放置：SWT.HORIZONTAL。,3．RowData類：RowData稱為RowLayout的布局?jǐn)?shù)據(jù)類，可用于改變?nèi)萜髦薪M件的外觀形狀。其構(gòu)造方法：RowData(intwidth,intheight);例4.12,4.4.3網(wǎng)格式布局,1．GridLayout的屬性intnumColumns：設(shè)置容器的列數(shù)，組件從左到右按列放置，當(dāng)組件數(shù)大于列數(shù)時(shí)，下一個(gè)組件將自動(dòng)添加新的一行。booleanmakeColumnsEqualWidth：強(qiáng)制使列都具有相同的寬度，默認(rèn)值為false。intmarginWidth：設(shè)置組件與容器邊緣的水平距離intmarginHeight：設(shè)置組件與容器邊緣的垂直距離，默認(rèn)值為5。inthorizontalSpacing：設(shè)置列與列之間的間隔，intverticalSpacing：設(shè)置行與行之間的間隔，默認(rèn)值為5。例4.13,2．布局?jǐn)?shù)據(jù)類（GridData類）GridData是GridLayout專用的布局?jǐn)?shù)據(jù)類，用GridData可以構(gòu)建很多復(fù)雜的布局方式。①GridData的構(gòu)造方法如下：GridData();創(chuàng)建一個(gè)屬性值為默認(rèn)值的對(duì)象。GridData(inttype);創(chuàng)建一個(gè)指定類型（type）的對(duì)象。②GridData常用類型如下：GridData.FILL通常與GridData類的對(duì)象屬性horizontalAlignment和verticalAlignment配合使用，充滿對(duì)象屬性指定的空間。GridData.FILL_HORIZONTAL水平充滿，組件充滿網(wǎng)格水平方向的空間。GridData.FILL_VERTICAL垂直充滿，組件充滿網(wǎng)格垂直方向的空間。GridData.FILL_BOTH雙向充滿，組件充滿水平和垂直方向的空間。,③GridData常用對(duì)象屬性如下：inthorizontalSpan設(shè)置組件占用的列數(shù)，默認(rèn)值為1。intverticalSpan設(shè)置組件占用的行數(shù)，默認(rèn)值為1。horizontalAlignment設(shè)置組件的對(duì)齊方式為水平方向。verticalAlignment設(shè)置組件的對(duì)齊方式為垂直方向。grabExcessHorizontalSpace搶占額外的水平空間。grabExcessVerticalSpace搶占額外的垂直空間。,horizontalAlignment和verticalAlignment可以取以下值：BEGINNING開(kāi)始（水平對(duì)齊時(shí)居左；垂直對(duì)齊時(shí)居上）CENTER居中END結(jié)束（水平對(duì)齊時(shí)居右；垂直對(duì)齊時(shí)居下）FILL充滿默認(rèn)的horizontalAlignment值是BEGINNING。默認(rèn)的verticalAlignment值是CENTER。例4.14使用gridData布局。,4.4.4表格式布局,表格式布局（FormLayout類）是一種非常靈活、精確的布局方式。FormLayout也有專用的布局?jǐn)?shù)據(jù)類FormData，此外，還增加了一個(gè)FormAttachment類。1．FormLayout的屬性intmarginWidth：設(shè)置組件與容器邊緣的水平距離，默認(rèn)值為0。intmarginHeight：設(shè)置組件與容器邊緣的垂直距離，默認(rèn)值為0。,2．FormData類①FormData的構(gòu)造方法FormData()默認(rèn)構(gòu)造方法，組件的寬度和高度要用屬性width和height設(shè)置。FormData(intwidth,intheight)參數(shù)width和height設(shè)置組件的寬度和高度。②FormData的屬性width設(shè)置組件的寬度。height設(shè)置組件的高度。top和FormAttachment配合設(shè)置組件頂部和父容器頂部的邊距。,bottom和FormAttachment配合設(shè)置組件底部和父容器底部的邊距。left和FormAttachment配合設(shè)置組件左邊和父容器左邊的邊距。right和FormAttachment配合設(shè)置組件右邊和父容器右邊的邊距。,3．FormAttachment類Attachment的含義是附著、粘貼。FormAttachment類就是用來(lái)指定組件在父容器中的粘貼位置。FormAttachment計(jì)算組件粘貼位置和組件大小的方法是依據(jù)下面的表達(dá)式：y=ax+b表達(dá)式中y是縱坐標(biāo)，從上往下是正方向；x是橫坐標(biāo)，從左至右是正方向；a是斜率（a=m/n，n≠0），b是偏移量，沿x、y軸正方向的偏移量為正，反之為負(fù)。.,FormAttachment的構(gòu)造方法FormAttachment()FormAttachment(Controlcontrol)FormAttachment(Controlcontrol,intoffset)FormAttachment(Controlcontrol,intoffset,intalignment)FormAttachment(intm,intn,intoffset)FormAttachment(intm,intoffset)FormAttachment(intm)例4.15FormData與FormAttachment的配合使用例4.16構(gòu)造方法FormAttachment(intm,intn,intoffset)的使用示例。例4.17綜合布局示例。,4.5SWT的事件處理,4.5.1SWT的常用事件1．a(chǎn)ddMouseListener鼠標(biāo)監(jiān)聽(tīng)器。常用方法：mouseDown()鼠標(biāo)按下時(shí)觸發(fā)。mouseUP()鼠標(biāo)放開(kāi)時(shí)觸發(fā)。mouseDoubleClick()鼠標(biāo)雙擊時(shí)觸發(fā)。2．a(chǎn)ddKeyListener按鍵監(jiān)聽(tīng)器。常用方法：keyPressed()當(dāng)焦點(diǎn)在組件上時(shí)，按下鍵盤任一鍵時(shí)觸發(fā)。但對(duì)某些組件（如按鈕Button），按回車鍵時(shí)不能觸發(fā)。keyReleased()按鍵彈起時(shí)觸發(fā)。,3．a(chǎn)ddSelectionListener組件選擇監(jiān)聽(tīng)器。常用方法：widgetSelected()當(dāng)組件被選擇（單擊鼠標(biāo)、焦點(diǎn)在組件上時(shí)按回車鍵）時(shí)觸發(fā)。4．a(chǎn)ddFocusListener焦點(diǎn)監(jiān)聽(tīng)器。常用方法：focusGained()得到焦點(diǎn)時(shí)觸發(fā)。focusLost()失去焦點(diǎn)時(shí)觸發(fā)。,4.5.2SWT的常用監(jiān)聽(tīng)器應(yīng)用實(shí)例,例4.18鼠標(biāo)監(jiān)聽(tīng)器，監(jiān)聽(tīng)鼠標(biāo)雙擊事件。例4.19鍵盤監(jiān)聽(tīng)器，監(jiān)聽(tīng)鍵盤事件。例4.20組件選擇監(jiān)聽(tīng)器，監(jiān)聽(tīng)組件選擇事件。,4.6SWTDesigner簡(jiǎn)介,SWTDesigner是一種功能強(qiáng)大且容易使用的基于EclipseSWT技術(shù)的圖形用戶界面設(shè)計(jì)工具，是一個(gè)很好的Eclipse的界面開(kāi)發(fā)插件包。利用SWTDesigner的可視化界面，只需采用拖拉操作，就可以很快地在窗體上創(chuàng)建各種組件，設(shè)計(jì)出來(lái)的窗體和組件的外觀和操作系統(tǒng)平臺(tái)下其他軟件的外觀相似，具有本機(jī)系統(tǒng)的風(fēng)格。SWTDesigner可以自動(dòng)生成Java代碼，利用它的屬性編輯器還可以改變組件的各種屬性，使SWT界面開(kāi)發(fā)變得非常容易。,4.6.1SWTDesigner的下載和安裝,1．下載下載版本：SWTDesigner6.1.0，文件名：Designer_v6.1.0_win32_x86.exe，下載地址：http://www.swt-,4.6.2SWTDesigner開(kāi)發(fā)實(shí)例,操作步驟如下：創(chuàng)建SWT/JFace項(xiàng)目創(chuàng)建ApplicationWindow窗體在窗體中加入組件添加事件處理代碼,4.7本章小結(jié),與AWT和SWING相比，SWT提供了和本機(jī)系統(tǒng)相同的用戶界面組件，具有較好的運(yùn)行效率和穩(wěn)定的平臺(tái)表現(xiàn)，因此近年來(lái)取得了很快的發(fā)展。本章介紹了SWT常用組件、SWT常用容器類、SWT常用的布局方式、SWT事件處理方法等圖形化用戶界面開(kāi)發(fā)技術(shù)。最后介紹了一款SWT可視化界面開(kāi)發(fā)插件包——SWTDesigner。通過(guò)大量實(shí)例，演示了SWT開(kāi)發(fā)桌面應(yīng)用程序的基本技術(shù)和技巧。,