Java圖形界面設(shè)計(jì).ppt

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

第12章圖形界面設(shè)計(jì) 2 本章主要內(nèi)容 12 1圖形用戶界面設(shè)計(jì)12 2圖形用戶界面工具包 Swing12 3創(chuàng)建組件12 4布局管理器 3 12 1圖形用戶界面設(shè)計(jì) 圖形用戶界面 GraphicsUserInterface GUI 用圖形的方式 借助菜單 按鈕等標(biāo)準(zhǔn)界面元素和鼠標(biāo)操作 幫助用戶方便地向計(jì)算機(jī)系統(tǒng)發(fā)出指令 啟動(dòng)操作 并將系統(tǒng)運(yùn)行的結(jié)果同樣以圖形方式顯示給用戶的技術(shù) Java的GUI程序設(shè)計(jì)是Java程序設(shè)計(jì)的基礎(chǔ) 4 12 1圖形用戶界面設(shè)計(jì) Java提供的兩個(gè)處理圖形用戶界面的類庫(kù) Java awt包和javax swing包 Sun已經(jīng)提供了一個(gè)跨平臺(tái)GUI開(kāi)發(fā)工具包java awt 抽象窗口工具箱 Sun又開(kāi)發(fā)了一個(gè)新的GUI開(kāi)發(fā)工具包javax swing解決了awt中存在的本地化問(wèn)題 5 12 1圖形用戶界面設(shè)計(jì) AWT和Swing是Java設(shè)計(jì)GUI用戶界面的基礎(chǔ) 與AWT的重量級(jí)組件不同 Swing中大部分是輕量級(jí)組件 正是這個(gè)原因 Swing幾乎無(wú)所不能 不但有各式各樣先進(jìn)的組件 而且更為美觀易用 所以一開(kāi)始使用AWT的程序員很快就轉(zhuǎn)向使用Swing了 但是因?yàn)镾wing是架構(gòu)在AWT之上的 沒(méi)有AWT就沒(méi)有Swing 所以程序員可以根據(jù)自己的習(xí)慣選擇使用AWT或者是Swing 但是 最好不要二者混用 除開(kāi)顯示風(fēng)格不同不說(shuō) 還很可能造成層次 Z Order 錯(cuò)亂 6 12 2圖形用戶界面工具包 Swing Java圖形用戶界面的基本元素包括 用戶界面組件 組件類 事件處理模塊 事件類 圖形和圖像工具 圖形類 圖像類 布局管理器 布局類 它們主要都在javax swing包中 Swing是Java包的一部分 7 8 12 2 1Swing組件分類 組件 構(gòu)成圖形用戶界面的各種元素 構(gòu)建圖形用戶界面的類可以分成三組 容器類 containerclass 輔助類 helperclass 組件類 componentclass 9 12 2 1Swing組件分類 容器類容器類組件中可以包含其他組件 也可以包含其他容器 容器又分為兩種 頂層容器和非頂層容器 頂層容器是可以獨(dú)立的窗口 Swing的頂層容器有JFrame JApplet和JDialog等 非頂層容器 不是獨(dú)立的窗口 它們必須位于窗口之內(nèi) 非頂層容器包括JPanel及JScrollPanel等 10 12 2 1Swing組件分類 輔助類和組件類都屬于非容器類組件不能包含其他組件的組件 其種類較多 輔助類輔助類是用來(lái)描述組件屬性的 輔助類通常包含在java awt包中 Swing組件不能取代AWT的全部類 只能替代AWT的GUI組件類 AWT輔助類保持不變 組件類所有SwingGUI組件類 除JFrame JApplet和JDialog 都是JComponent類的子類 例如 JButton JTextField JTextArea JComboBox JList JRadioButton和JMenu等 Swing輕型組件分類參見(jiàn)教材P202表12 1 11 12 2 1Swing組件分類 一般獨(dú)立應(yīng)用程序主要是要框架JFrame作為容器 在JFrame上通過(guò)放置JPanel面板來(lái)控制圖形界面的布局 如果應(yīng)用到瀏覽器中 則主要使用JApplet來(lái)做容器 JApplet是一個(gè)能夠嵌入到瀏覽器中運(yùn)行的特殊容器 12 12 2 1Swing組件分類 1 Swing容器的層次關(guān)系一般的Swing窗口 實(shí)際上包含幾個(gè) 層次 13 12 2 1Swing組件分類 1 Swing容器的層次關(guān)系一般的Swing窗口 實(shí)際上包含幾個(gè) 層次 各個(gè)層的關(guān)系如教材P202圖12 2所示 頂層容器 是一個(gè)窗口容器對(duì)象 該對(duì)象包含了Swing窗口的各個(gè)層次 在該對(duì)象里面可以加入其它窗口對(duì)象 根窗格 是在創(chuàng)建頂層容器后自動(dòng)創(chuàng)建的 供Swing頂層容器在后臺(tái)使用 是頂層容器中做包含的最內(nèi)層 通常無(wú)法在這一層上做任何操作與處理 分層窗格 加入分層窗格中的組件可以設(shè)置其圖層層次 且不會(huì)被內(nèi)容窗格中的對(duì)象屏蔽 是其它窗格的父級(jí) 14 12 2 1Swing組件分類 菜單欄 菜單欄被添加到分層窗格的頂部 是可選的 內(nèi)容窗格 是分層窗格中的某一層 是一個(gè)JPanel對(duì)象 在窗體中起著工作區(qū)的作用 可以放置大部分的可見(jiàn)組件 玻璃窗格 主要用來(lái)產(chǎn)生繪圖效果 以及用來(lái)觸發(fā)窗口程序的各種事件 玻璃窗格浮在最上面 默認(rèn)情況下是隱藏的 15 12 2 1Swing組件分類 16 12 2 1Swing組件分類 2 框架類JFrame是Java應(yīng)用程序的頂層容器 JFrame是java awt Frame的擴(kuò)展版本 是一個(gè)window子類 在使用Swing類庫(kù)實(shí)現(xiàn)用戶圖形接口 必須繼承該類 JFrame容器包括窗口標(biāo)題 窗口外觀 窗口邊界 調(diào)整窗口大小的圖標(biāo) 關(guān)閉和最小化窗口的圖標(biāo) 并且可以直接在容器上添加組件 如按鈕 文本等 17 12 2 1Swing組件分類 構(gòu)造方法 publicJFrame throwsHeadlessException 創(chuàng)建了一個(gè)新的容器窗口 默認(rèn)該窗口是不可見(jiàn)的 publicJFrame Stringtitle throwsHeadlessException創(chuàng)建一個(gè)新的容器窗口 通過(guò)方法的參數(shù)設(shè)置窗口標(biāo)題 該窗口默認(rèn)是不可見(jiàn)的 18 12 2 1Swing組件分類 該類的常用方法 P203 204 getContentPane 該方法返回一個(gè)框架對(duì)象 使用該框架對(duì)象來(lái)添加組件 如增加按鈕 菜單 工具欄 列表框等組件 setSize intwidth inthight 設(shè)置窗口尺寸 窗口大小以像素為單位計(jì)算 getJMenuBar 返回此窗體上設(shè)置的菜單欄 setJMenuBar JMenuBarmenubar 設(shè)置此窗體的菜單欄 setIconImage Imageimage 設(shè)置要作為此窗口圖標(biāo)顯示的圖像 19 例App12 1 輔助類 組件類 20 例App12 1 為什么在該實(shí)例中被沒(méi)有顯示背景色 JFrame默認(rèn)采用了FlowLayout布局管理器 你的組件在該布局管理器中被塞滿整個(gè)frame 擋住了背景 就是說(shuō) 實(shí)際上JFrame還是有背景的一般用JFrame的時(shí)候要初始化一個(gè)JPanel 把組件放在JPanel里 然后把JPanel放到JFrame里 這樣可以較好的控制組建位置等其他的東西 在這種方式下直接給JPanel設(shè)置setBackground就可以一直看到背景了 命令提示符環(huán)境 21 例App12 1 1 22 例App12 1 1 例App12 1 2 23 12 2 1Swing組件分類 3 面板類JPanel面板是一種沒(méi)有標(biāo)題欄 沒(méi)有邊框的中間層容器 在該容器上可以放置其他組件如單選按鈕 列表框等 還可以包含其他容器 如一個(gè)新的JPanel對(duì)象 從而方便地實(shí)現(xiàn)容器的嵌套 在面板創(chuàng)建后是無(wú)法單獨(dú)顯示的 面板不是頂層容器 必須放到其他容器內(nèi) 也可以放入另一個(gè)面板內(nèi) 必須放在JFrame或Applet這樣的頂層窗口中才可以顯示 一個(gè)界面只可以有一個(gè)JFrame窗體組件 但可以有多個(gè)JPanel面板組件 24 12 2 1Swing組件分類 3 面板類JPanel該類的構(gòu)造函數(shù) JPanel 創(chuàng)建一個(gè)面板 并且該面板組件的布局管理器為FlowLayout JPanel LayoutManagerlayout 創(chuàng)建一個(gè)面板 且該面板設(shè)置了指定的布局管理器 布局管理器管理在容器上放置的組件 具體的內(nèi)容會(huì)在12 4節(jié)詳細(xì)介紹 25 12 2 1Swing組件分類 3 面板類JPanel常用方法 JPanel默認(rèn)的布局管理器是FlowLayout 可以使用setLayout 方法改變其默認(rèn)布局 也可以采用包含它的容器不同的布局管理器 26 例App12 2 在框架中加入面板 27 例App12 2 在框架中加入面板 28 例App12 2 在框架中加入面板 29 12 2 1Swing組件分類 4 組件類又稱控制組件 控件 它里面不能包含其他組件 作用 完成與用戶的交互 包括接收用戶的命令 接收用戶輸入的文本或用戶的選擇 向用戶顯示文本或圖形 常用控件 命令類 選擇類 文字處理類等 30 12 2 1Swing組件分類 5 圖形界面設(shè)計(jì)的步驟創(chuàng)建組件 Component 創(chuàng)建組成界面的各種元素 如按鈕 文本框等 指定布局 Layout 根據(jù)具體需要排列界面上各元素的位置關(guān)系 響應(yīng)事件 Event 定義圖形用戶界面的事件和各界面元素對(duì)不同事件的響應(yīng) 從而實(shí)現(xiàn)圖形用戶界面與用戶的交互功能 31 12 2 2顏色類 字體類 圖像圖標(biāo)類 1 顏色類Color屬于java awt每種顏色均看作是由紅 R 綠 G 藍(lán) B 三色組成 構(gòu)造方法 Color intr intg intb 顏色常量值Color black Color blue Color gray Color redColor white例如Colorc newColor intrgb 參數(shù)取值0 255 越大則表明這種顏色的成分越重 32 12 2 2顏色類 字體類 圖像圖標(biāo)類 2 字體類Font用來(lái)規(guī)范組件所用的字體樣式 大小與字形等 構(gòu)造方法 Font Stringfont name intstyle intsize 字體名稱 字形樣式 PLAIN BOLD ITALIC 字號(hào)大小 33 Font類的成員方法publicstringgetName 獲得字體的名稱publicintgetStyle 獲得字體的樣式publicintgetSize 獲得字體的大小publicbooleanisPlain 若字體是正常型 則返回truepublicbooleanisBold 若字體是粗體 則返回truepublicbooleanisItalic 若字體是斜體 則返回true 12 2 2顏色類 字體類 圖像圖標(biāo)類 34 12 2 2顏色類 字體類 圖像圖標(biāo)類 3 圖標(biāo)圖像類ImageIconJava語(yǔ)言使用javax swing ImageIcon類表示圖標(biāo) 表12 12給出了ImageIcon類的常用構(gòu)造方法 表12 13給出了ImageIcon類的常用方法 35 Java中Image類與ImageIcon類的區(qū)別 Image類一般尺寸過(guò)大 不適合作ImageIcon類 ImageIconimageIcon newImageIcon duke gif Icon由圖片文件形成Imageimage imageIcon getImage 但這個(gè)圖片太大不適合做Icon 為把它縮小點(diǎn) 先要取出這個(gè)Icon的image 然后縮放到合適的大小ImagesmallImage image getScaledInstance 30 20 Image SCALE FAST 再由修改后的Image來(lái)生成合適的IconImageIconsmallIcon newImageIcon smallImage 最后設(shè)置它為按鈕的圖片JButtoniconButton newJButton smallIcon 36 Java中Image類與ImageIcon類的區(qū)別 而由ImageIcon類到Image類 可以通過(guò) ImageIconimageIcon newImageIcon duke gif Icon由圖片文件形成JFramejf null jf setImageIcon ImageIcon getImage 37 12 3創(chuàng)建組件 12 3 1標(biāo)簽12 3 2命令按鈕 復(fù)選框 單選按鈕12 3 3文本編輯組件 滾動(dòng)窗格12 3 4選項(xiàng)窗格 38 12 3 1標(biāo)簽JLabel 標(biāo)簽用來(lái)在窗口中顯示文字的控件在整個(gè)應(yīng)用程序中 不僅把JLabel用作文本描述 還將它用作圖片描述 每當(dāng)在Swing應(yīng)用程序中看到圖片的時(shí)候 它就有可能是JLabel JLabel對(duì)于Swing初學(xué)者來(lái)說(shuō)沒(méi)有許多意料之外的方法 39 12 3 1標(biāo)簽JLabel 基本的方法get setText 獲取 設(shè)置標(biāo)簽的文本 get seticon 獲取 設(shè)置標(biāo)簽的圖片 get setHorizontalAlignment 獲取 設(shè)置文本的水平位置 get setVerticalAlignment 獲取 設(shè)置文本的垂直位置 get setDisplayedMnemonic 獲取 設(shè)置標(biāo)簽的訪問(wèn)鍵 下劃線文字 get setLableFor 獲取 設(shè)置這個(gè)標(biāo)簽附著的組件 所以當(dāng)用戶按下Alt 訪問(wèn)鍵時(shí) 焦點(diǎn)轉(zhuǎn)移到指定的組件 40 例App12 3 41 例App12 3 42 例App12 3 43 例App12 4 在框架窗口中加入指定大小的標(biāo)簽 并設(shè)置當(dāng)鼠標(biāo)懸停在標(biāo)簽上時(shí)給出相應(yīng)的提示信息 Swing中的幾乎所有組件都是繼承自JComponent 它提供了一個(gè)setToolTipText Stringstr 方法 來(lái)創(chuàng)建工具提示 44 例App12 4 45 例App12 4 46 12 3 2命令按鈕 復(fù)選框 單選按鈕 1 命令按鈕Jbutton用戶用鼠標(biāo)單擊它來(lái)控制程序運(yùn)行的流程 JButton創(chuàng)建后通過(guò)容器的add 將其放入容器 構(gòu)造方法及常用方法見(jiàn)教材P212 213表12 16 12 17 47 例App12 5 48 例App12 5 49 12 3 2命令按鈕 復(fù)選框 單選按鈕 2 復(fù)選框JCheckBox 單選按鈕JbuttonJCheckBox可以單獨(dú)使用 而單選按鈕必須配合javax swing包中的ButtonGroup類將其組成單選按鈕組來(lái)使用 如果有多個(gè)復(fù)選框 那么也需要ButtonGroup類將其組成復(fù)選框按鈕組來(lái)使用 重要的ButtonGroup方法是 add 添加JCheckBox或JRadioButton到ButtonGroup getElements 獲得ButtonGroup中的全部組件 允許對(duì)它們進(jìn)行迭代 找到其中選中的那個(gè) 50 例App12 6 51 例App12 6 注意 ButtonGroup不是java awt Component的子類 所以不能添加到容器中 52 例App12 6 53 例App12 6 54 12 3 3文本編輯組件與滾動(dòng)窗格 1 文本行組件JTextField文本行組件JTextField主要用于接收用戶鍵盤(pán)輸入的文本 設(shè)置文本的方法 get setText 用于獲取 設(shè)置JTextField中的文本 55 12 3 3文本編輯組件與滾動(dòng)窗格 2 密碼文本行組件JPasswordFieldPasswordField主要用于輸入密碼getEchoChar 獲取每次字符輸入時(shí)在JPasswordField中顯示的字符 默認(rèn)值為 setEchoChar 設(shè)置每次字符輸入時(shí)在JPasswordField中顯示的字符 getPassword 這是從JPasswordField中獲得口令的恰當(dāng)方法 因?yàn)樗祷匾粋€(gè)包含口令的char 為了保證恰當(dāng)?shù)陌踩?數(shù)組應(yīng)當(dāng)被清為0 以確保它不會(huì)保留在內(nèi)存中 56 12 3 3文本編輯組件與滾動(dòng)窗格 3 文本區(qū)組件JTextAreais setLineWrap 設(shè)置在行過(guò)長(zhǎng)的時(shí)候是否要自動(dòng)換行 is setWrapStyleWord 設(shè)置在單詞過(guò)長(zhǎng)的時(shí)候是否要把長(zhǎng)單詞移到下一行 文本區(qū)組件JTextArea通常與滾動(dòng)窗格組件JScrollPane一起使用 4 滾動(dòng)窗格組件JScrollPane用JTextArea調(diào)用JScrollPane的構(gòu)造函數(shù) 這為JTextArea創(chuàng)建了在文本過(guò)長(zhǎng)時(shí)滾動(dòng)的能力 JScrollPanescroll newJScrollPane getTextArea add scroll 57 例App12 7 58 例App12 7 59 例App12 7 60 12 3 4選項(xiàng)窗格JTabbedPane JTabbedPane組件中允許包含多個(gè)選項(xiàng)卡 用戶選取項(xiàng)目的一種組件 用戶利用該組件來(lái)表JTabbedPane類的構(gòu)造方法及常用方法見(jiàn)教材中表12 25 12 26例如 JTabbedPanetab newJTabbedPane tab add Java newJLabel Java JTabbedPane類有多個(gè)addTab 方法 這里采用了其中一種 第一個(gè)參數(shù)是頁(yè)簽的標(biāo)題 第二個(gè)參數(shù)是頁(yè)簽上放置的組件 如JLabel 當(dāng)然可以是任意的組件 61 例App12 8 62 例App12 8 63 例App12 8 64 12 4布局管理器 布局管理即頁(yè)面管理 頁(yè)面管理 layout 指窗口上的組件遵循一定的規(guī)則來(lái)排列 并會(huì)隨著窗口大小的變化來(lái)改變組件大小與位置的一種布局方式 自動(dòng)布局 當(dāng)為一個(gè)容器指定一個(gè)布局管理器后 將一個(gè)組件加入該容器中時(shí) 布局管理器就能自動(dòng)設(shè)置該組件的大小和位置 65 12 4布局管理器 java awt包中共定義了五種布局管理器 每個(gè)布局管理器對(duì)應(yīng)一種布局策略 分別是 流式布局管理器FlowLayout邊界式布局管理器BorderLayout卡片式布局管理器CardLayout網(wǎng)格式布局管理器GridLayout網(wǎng)格包布局管理器GridBagLayout 66 12 4布局管理器 java Swing包提供的布局管理器有 盒式布局管理器BoxLayout重疊布局管理器OverlayLayout彈簧布局管理器SpringLayout 67 12 4 1流式布局管理器FlowLayout 布局策略組件按照加入容器的先后順序從左向右排列 一行排滿后就自動(dòng)地轉(zhuǎn)到下一行繼續(xù)從左向右排列 每一行中的組件都居中排列 默認(rèn)居中對(duì)齊 可以通過(guò)FlowLayout intalign 方法指定對(duì)齊方式 68 12 4 1流式布局管理器FlowLayout FlowLayout布局管理器是Panel Applet和JPanel默認(rèn)的布局管理方式 布局管理器的容器中的組件大小不隨容器大小的變化而改變 當(dāng)容器中的組件不多時(shí) 使用這種布局策略非常方便 是JPanel默認(rèn)的布局管理方式 構(gòu)造方法及常用方法見(jiàn)教材表12 27 12 29見(jiàn)教材例12 9 69 例App12 9 70 例App12 9 71 12 4 2邊界式布局管理器BorderLayout 將顯示區(qū)域按地理方位分為東 East 西 West 南 South 北 North 中 Center 五個(gè)區(qū)域 將組件加入容器中 若沒(méi)有指定區(qū)域 則默認(rèn)為中間 若將組件加入到已被占用的位置 將會(huì)取代原先的組件 72 12 4 2邊界式布局管理器BorderLayout 利用add 添加組件時(shí)必須指出組件的擺放位置 是JFrame JApplet JDialog默認(rèn)的布局管理方式 在BorderLayout類的定義中這5個(gè)區(qū)域用5個(gè)常量值表示 EAST WEST SOUTH NORTH和CENTER 假設(shè)容器為cp組件為jb 則將組件添加到容器上的方式為 BorderLayoutbl newBorderLayout Cp add jb BorderLayout CENTER 不是五個(gè)部分都必須添加中間組件會(huì)自動(dòng)調(diào)節(jié)大小 73 例App12 10 74 例App12 9 75 12 4 3網(wǎng)格式布局管理器GridLayout 提供的頁(yè)面布局規(guī)則是將容器的空間劃分成若干行與列的網(wǎng)格形式 在容器上添加組件時(shí) 它們會(huì)按從左到右 從上到下的順序在網(wǎng)格中均勻排列 網(wǎng)格的行數(shù)和列數(shù)可以在創(chuàng)建GridLayout對(duì)象的構(gòu)造方法里指定 若控件數(shù)正好是行 列 則按行 列數(shù)放置 若控件數(shù)超過(guò)了行 列 則先滿足行 利用GridLayout布局策略時(shí) 容器中各組件的寬度相同 所有組件的高度也相同 當(dāng)容器尺寸發(fā)生變化時(shí) 各組件的相對(duì)位置不變 構(gòu)造方法及常用方法見(jiàn)教材表12 33 12 34 76 例App12 11 77 例App12 11 78 例App12 11 79 例App12 11 80 例App12 11 81 12 4 4卡片式布局管理器CardLayout 頁(yè)面布局方式是把 窗口容器 中的所有組件如同堆疊起來(lái)的一付 撲克牌 每次只能顯示最上面的一張一樣 這個(gè)被顯示的組件將占據(jù)所有的容器空間 使用add 往窗口容器中加入組件時(shí)應(yīng)為每個(gè)組件賦予一個(gè)名字 依據(jù)這個(gè)名字利用CardLayout類所提供的方法來(lái)控制其他組件是否顯示 該布局方式每次僅有一個(gè)組件是可見(jiàn)的 利用卡片布局管理器時(shí) 通常要用到多個(gè)容器 其中一個(gè)容器使用卡片布局管理器 而另外的容器使用其它布局管理器 82 例App12 12 83 例App12 12 84 例App12 12 85 12 4 5網(wǎng)格包布局管理器GridBagLayout 將容器中的組件按行 列的位置擺放 但各組件所占據(jù)的空間可以是互不相同的 可以為每個(gè)組件指定其占據(jù)的網(wǎng)格數(shù) 可以保留組件原來(lái)的大小 可以按任意順序隨意加入容器的任意位置 從而可以真正自由地安排容器中的組件的大小和位置 每個(gè)組件都要與一個(gè)網(wǎng)格包約束條件的實(shí)例對(duì)象來(lái)配合使用 該實(shí)例對(duì)象指定組件如何放置在它的顯示區(qū)域內(nèi) 86 例App12 13 87 例App12 13 88 例App12 13 89 例App12 13 90 12 4 6盒式布局管理器BoxLayout BoxLayout是一種Swing布局管理器 這種布局策略是在一行或一列中擺放組件 假設(shè)容器為jp 設(shè)置該容器的盒子布局管理器的方式為 jp setLayout newBoxLayout jp BoxLayout Y AXIS BoxLayout的構(gòu)造函數(shù)要求把欲接受管理器控制的容器對(duì)象作為第一個(gè)參數(shù) 而第二個(gè)參數(shù)說(shuō)明了組件的布局方向 91 例App12 14 92 12 4 7重疊布局管理器OverlayLayout和彈簧布局管理器SpringLayout簡(jiǎn)介 重疊布局管理器OverlayLayout和彈簧布局管理器SpringLayout均是Swing中定義的布局管理器 具有OverlayLayout布局策略的容器 將加入該容器的所有組件疊放在一起 第一個(gè)被家人容器的組件會(huì)放在容器的最前面 SpringLayout的主要思想是在組件的周圍放置一個(gè)靈活的彈簧 這種彈簧可以壓縮或伸長(zhǎng) 把組件堆放到要求的位置