第5章用戶界面

1、第第5章章 用戶界面用戶界面哈爾濱工程大學(xué) 王向輝本章學(xué)習(xí)目標(biāo)：n掌握界面布局的使用方法n了解控件分類和基本用途n掌握常用控件的使用方法5.1 控件概述n界面控件q可以被拖拽的界面元素q51個(gè)控件，9個(gè)子類界面控件的分類和數(shù)量類別類別說明說明說明說明User Interface常用控件11Layout屏幕布局3Media媒體控件9Drawing and Animation動(dòng)畫控件3Sensors傳感器控件5Social社交控件6Storage存儲(chǔ)控件3Connectivity通信控件4LEGO MINIDSTORMS樂高機(jī)器人控件75.1 控件概述n界面控件q常用控件（User Interfa

2、ce）n使用頻率最高，如按鈕、標(biāo)簽、復(fù)選框控件q屏幕布局（Layout）n設(shè)定屏幕中元素排列方式的控件q媒體控件（Media）n播放聲音、視頻，錄音、錄像控件q傳感器控件（Sensors）n與硬件設(shè)備相關(guān)，如加速度傳感器、位置傳感器、方向傳感器和進(jìn)場通訊5.1 控件概述n界面控件q社交控件（Social）n用來與他人交互的控件，如撥號(hào)、短信、選取聯(lián)系人控件q存儲(chǔ)控件（Storage）n與信息存儲(chǔ)相關(guān)的控件，如本地?cái)?shù)據(jù)庫和網(wǎng)絡(luò)數(shù)據(jù)庫控件q通訊控件（Connectivity）n信息交換的控件，如藍(lán)牙、Web控件q樂高機(jī)器人控件（LEGO MINIDSTORMS）n樂高NXT智慧型機(jī)器人的開發(fā)控件5

3、.2 屏幕布局n屏幕布局（Layout）q水平布局（HorizontalArrangement）q垂直布局（VerticalArrangement）q表格布局（TableArrangement）可視化控件布局的三種方式5.2 屏幕布局n水平布局（HorizontalArrangement）q所有界面控件都在水平方向上按照順序排列q運(yùn)行時(shí)，水平布局的邊框被隱藏水平布局在界面編輯器和手機(jī)運(yùn)行時(shí)的不同效果 5.2 屏幕布局n水平布局（HorizontalArrangement）q將水平布局拖拽到界面編輯器，形成正方形區(qū)域q將控件拖拽到正方形區(qū)域，正方形區(qū)域變成長方形q不讓控件總尺寸超出屏幕顯示范圍空

4、置的水平布局和向水平布局添加控件 5.2 屏幕布局n水平布局（HorizontalArrangement）qAlignHorizontal屬性n布局內(nèi)控件的排布方式qAlignVertical屬性n布局內(nèi)控件的列布方式qVisible屬性n控件是否可見qWidth屬性n控件寬度qHeight屬性n控件高度水平布局的屬性 5.2 屏幕布局n水平布局（HorizontalArrangement）qAlignHorizontal屬性n左對(duì)齊（Left）n居中（Center）n右對(duì)齊（Right）水平布局的AlignHorizontal屬性 5.2 屏幕布局n垂直布局（VerticalArrangem

5、ent）q所有界面控件都在垂直方向按照順序排列，類似水平布局q例：垂直布局和水平布局嵌套使用垂直布局和垂直布局嵌套水平布局5.2 屏幕布局n表格布局（TableArrangement）q將屏幕劃分成表格q通過行（Rows）、列（Columns）控制格數(shù)量q根據(jù)控件大小自動(dòng)修改表格大小垂直布局和垂直布局嵌套水平布局5.2 屏幕布局n表格布局（TableArrangement）q行（Rows）、列（Columns）表格布局的專有屬性q在界面編輯器的屬性區(qū)內(nèi)修改表格布局的屬性5.2 屏幕布局n表格布局（TableArrangement）q例：表格布局、垂直布局、水平布局的嵌套n表格布局：2*2n垂直

6、布局：左上、右下n水平布局：右上、左下表格布局的嵌套5.3 常用控件n常用控件q按鈕（Button）q復(fù)選框（CheckBox）q時(shí)鐘（Clock）q圖片（Image）q標(biāo)簽（Label）q選項(xiàng)列表（ListPiker）q通知（Notifier）q密碼框（PasswordTextBox）q文本框（TextBox）q網(wǎng)頁瀏覽器（WebViewer）5.3 常用控件n常用控件（User Interface）q點(diǎn)擊控件右側(cè)的問號(hào)，獲取控件的使用說明常用控件和按鈕控件說明5.3 常用控件n按鈕（Button）q修改按鈕屬性按鈕屬性的編輯欄5.3 常用控件n按鈕（Button）按鈕屬性的編輯欄屬性屬性說

7、明說明Background Color設(shè)置按鈕的背景色Enabled設(shè)置按鈕是否可用FontBold設(shè)置字體加粗FontItalic設(shè)置字體傾斜FontSize設(shè)置字體大小FontTypeface設(shè)置字體類型Image設(shè)置按鈕的背景圖案Shape設(shè)置按鈕的形狀，如圓角按鈕，矩形按鈕等ShowFeedback為有背景圖片的按鈕提供視覺反饋Text設(shè)置按鈕上顯示的文字，如果清空則不在按鈕上顯示任何文字TextAlignment設(shè)置按鈕上文字的對(duì)齊方式TextColor設(shè)置文本的顏色Visible設(shè)置按鈕是否可見Width設(shè)置按鈕的寬度Height設(shè)置按鈕的高度5.3 常用控件n按鈕（Button）

8、qEnable屬性n按鈕是否可用qTextAlignment屬性n按鈕上文字對(duì)齊方式qShape屬性n按鈕外部形狀按鈕的Enable、TextAlignment和Shape屬性5.3 常用控件n按鈕（Button）qWidth和Height屬性n自動(dòng)（Automatic），寬度與文字匹配n填充（Fill Parent），寬度達(dá)到父控件允許的最大值n固定尺寸（pixels），設(shè)置固定寬度像素值按鈕的Width屬性5.3 常用控件n按鈕（Button）q按鈕的4個(gè)事件：n點(diǎn)擊事件（Click），按下按鈕后快速抬起時(shí)產(chǎn)生n長按事件（LongClick），長時(shí)間按下按鈕n獲取焦點(diǎn)事件（GetFocus

9、），按鈕過去到焦點(diǎn)n失去焦點(diǎn)事件（LostFocus），按鈕失去焦點(diǎn)按鈕支持的事件5.3 常用控件n標(biāo)簽（Label）q只能顯示文字信息，無輸入操作q只有屬性，沒有事件標(biāo)簽控件5.3 常用控件n標(biāo)簽（Label）q標(biāo)簽的屬性標(biāo)簽的屬性屬性屬性說明說明Background Color設(shè)置標(biāo)簽背景色FontBold設(shè)置字體加粗FontItalic設(shè)置字體傾斜FontSize設(shè)置字體大小FontTypeface設(shè)置字體類型Text設(shè)置標(biāo)簽欄里顯示的文字TextAlignment設(shè)置標(biāo)簽內(nèi)文字的對(duì)齊方式TextColor設(shè)置文本的顏色Visible設(shè)置標(biāo)簽是否可見Width設(shè)置標(biāo)簽的寬度Height設(shè)

10、置標(biāo)簽的高度5.3 常用控件n圖像（Image）q顯示各種圖像文件，不支持事件q屬性簡單，易于使用圖像控件及其屬性表屬性屬性說明說明Picture選擇顯示的圖像Visible設(shè)置圖像是否可見Width設(shè)置圖像的寬度Height設(shè)置圖像的高度5.3 常用控件n例：Fourseasons示例q點(diǎn)擊下方四個(gè)按鈕（春天、夏天、秋天、冬天）q切換界面上方的圖片和文字Fourseasons示例運(yùn)行界面5.3 常用控件n例：Fourseasons示例q界面設(shè)計(jì)nTitle標(biāo)簽nPicture圖像nText標(biāo)簽nSpring按鈕nSummer按鈕nAutumn按鈕nWinter按鈕FourSeasons示例的

11、界面設(shè)計(jì)圖5.3 常用控件n例：Fourseasons示例qUpload File按鈕n位置：在界面編輯器的資源區(qū)（Media）中n作用：將所需圖片加載到工程將圖片加載到工程中5.3 常用控件n例：Fourseasons示例q邏輯設(shè)計(jì)nSpring按鈕的Click事件nSummer按鈕Click事件nAutumn按鈕Click事件nWinter按鈕Click事件FourSeasons示例的全部邏輯5.3 常用控件n文本框（TextBox）q主要提供輸入信息的區(qū)域，也可以顯示文字信息qHint屬性n文本框內(nèi)容為空時(shí)，文本框中以灰色文字顯示提示信息（Hint）qMultiLine屬性n控制文本框顯

12、示單行或多行文本文本框5.3 常用控件n文本框（TextBox）q文本框的屬性文本框的屬性表屬性屬性說明說明Background Color設(shè)置文本框的背景色，默認(rèn)為白色Enabled設(shè)置文本框是否可用FontBold設(shè)置字體加粗FontItalic設(shè)置字體傾斜FontSize設(shè)置字體大小FontTypeface設(shè)置字體類型Hint設(shè)置文本框的提示信息MultiLine設(shè)置是否支持多行顯示NumbersOnly設(shè)置是否只允許輸入數(shù)字Text設(shè)置文本框上默認(rèn)顯示的文字內(nèi)容TextAlignment設(shè)置按鈕上文字的對(duì)齊方式TextColor設(shè)置文本的顏色Visible設(shè)置文本框是否可見Width設(shè)

13、置文本框的寬度Height設(shè)置文本框的高度5.3 常用控件n文本框（TextBox）q文本框的事件n獲取焦點(diǎn)事件（GetFocus）n失去焦點(diǎn)事件（LostFocus）q文本框的HideKeyboard方法n隱藏軟鍵盤方法（HideKeyboard）文本框控件的事件和HideKeyboard方法5.3 常用控件n復(fù)選框（CheckBox）q復(fù)選框的屬性復(fù)選框及其屬性表屬性屬性說明說明Background Color設(shè)置復(fù)選框的背景色Checked設(shè)置復(fù)選框默認(rèn)狀態(tài)是否被選中Enabled設(shè)置復(fù)選框是否可用FontBold設(shè)置復(fù)選框字體加粗FontItalic設(shè)置復(fù)選框字體傾斜FontSize設(shè)

14、置復(fù)選框字體大小FontTypeface設(shè)置復(fù)選框字體類型Text設(shè)置復(fù)選框的文字注釋TextColor設(shè)置文本的顏色Visible設(shè)置復(fù)選框是否可見Width設(shè)置復(fù)選框的寬度Height設(shè)置復(fù)選框的高度5.3 常用控件n復(fù)選框（CheckBox）q文本框的事件n獲取焦點(diǎn)事件（GetFocus）n失去焦點(diǎn)事件（LostFocus）n選項(xiàng)更改事件（Ganged）復(fù)選框控件的事件5.3 常用控件n密碼框（PasswordTextBox）q一般用于輸入密碼q自動(dòng)屏蔽輸入內(nèi)容密碼框和密碼框?qū)傩詫傩詫傩哉f明說明Background Color 設(shè)置密碼框的背景色Enabled設(shè)置密碼框是否可用FontB

15、old設(shè)置密碼框字體加粗FontItalic設(shè)置密碼框字體傾斜FontSize設(shè)置密碼框字體大小FontTypeface設(shè)置密碼框字體類型Hint設(shè)置密碼框的提示信息Text設(shè)置密碼框里顯示的文字TextAlignment設(shè)置密碼框上文字的對(duì)齊方式TextColor設(shè)置文本的顏色Visible設(shè)置密碼框是否可見Width設(shè)置密碼框的寬度Height設(shè)置密碼框的高度5.3 常用控件n密碼框（PasswordTextBox）q密碼框的事件n獲取焦點(diǎn)事件（GetFocus）n失去焦點(diǎn)事件（LostFocus）密碼框控件的事件5.3 常用控件n例：Login示例q勾選復(fù)選框，顯示提示信息q輸入用戶名q

16、輸入密碼q點(diǎn)擊登錄Login示例運(yùn)行界面5.3 常用控件n例：Login示例q界面設(shè)計(jì)nInfoDisplay標(biāo)簽nIDTextBox文本框nPassTextBox密碼框nLoginButton按鈕nLoginHint復(fù)選框nHintInfo標(biāo)簽Login示例的界面設(shè)計(jì)圖5.3 常用控件n例：Login示例q邏輯設(shè)計(jì)nLoginButton按鈕的Click事件nLoginHint復(fù)選框的Changed事件兩個(gè)事件5.3 常用控件n選項(xiàng)列表（ListPicker）q形狀類似按鈕q點(diǎn)擊后出現(xiàn)黑色背景的列表項(xiàng)供選擇q選擇列表中某一項(xiàng)，自動(dòng)退出列表項(xiàng)界面選項(xiàng)列表5.3 常用控件n選項(xiàng)列表（ListPi

17、cker）q列表項(xiàng)在界面編輯器中定義nElementsFromString屬性，將列表項(xiàng)用逗號(hào)拼接成完整的字符串q列表項(xiàng)在模塊編輯器中定義n直接修改ElementsFromString屬性n將列表項(xiàng)拼接在Elements屬性上修改選項(xiàng)列表的列表項(xiàng)5.3 常用控件n選項(xiàng)列表（ListPicker）q選項(xiàng)列表的專有屬性nSelection、ElementsFromString、ShowFilterBar、Title屬性q例：數(shù)字選擇區(qū)nShowFilterBar屬性nTitle屬性列表的屬性及數(shù)字選擇區(qū)示例屬性屬性說明說明Selection被選中的列表項(xiàng)ElementsFromString字符串方

18、式的列表項(xiàng)ShowFilterBar顯示過濾文本框Title列表標(biāo)題5.3 常用控件n選項(xiàng)列表（ListPicker）q選項(xiàng)列表的事件n選前操作事件（BeforePicking）n選后操作事件（AfterPicking）n獲取焦點(diǎn)事件（GetFocus）n失去焦點(diǎn)事件（LostFocus）q選項(xiàng)列表的方法nOpen方法選項(xiàng)列表的BeforePicking、AfterPicking事件和Open方法 5.3 常用控件n時(shí)鐘（Clock）q非可視化組件n獲取當(dāng)前時(shí)間n格式化輸出時(shí)間n計(jì)算時(shí)間增量n在固定的時(shí)間間隔觸發(fā)事件q獲取當(dāng)前時(shí)間nNow方法n例：將Now方法的返回結(jié)果拼接在標(biāo)簽上顯示當(dāng)前時(shí)間

19、點(diǎn)和Now方法的輸出結(jié)果 5.3 常用控件n時(shí)鐘（Clock）q格式化輸出時(shí)間nFormatDate方法nFormatDateTime方法nFormatTime方法格式化日期和時(shí)間 5.3 常用控件n時(shí)鐘（Clock）q例：調(diào)用時(shí)鐘的FormatDate方法n將Clock1.Now拼接在槽instant中n輸出格式“2014-1-1”q例：調(diào)用時(shí)鐘的FormatDateTime方法n將Clock1.Now拼接在槽instant中n輸出格式“2014-1-1 下午6:00:00”q例：調(diào)用時(shí)鐘的FormatTime方法n將Clock1.Now拼接在槽instant中n輸出格式“下午6:00:00

20、”5.3 常用控件n時(shí)鐘（Clock）q獲取當(dāng)前時(shí)間部分信息n年、月、日、小時(shí)、分鐘、秒獲取當(dāng)前時(shí)間部分信息的方法 5.3 常用控件n時(shí)鐘（Clock）qAddHours方法q例：獲取一小時(shí)后時(shí)間n將Clock1.Now拼接在槽instant上n將數(shù)字1拼接在槽hours上qAddDays方法q例：獲取一天后時(shí)間n同上計(jì)算時(shí)間增量的方法5.3 常用控件n時(shí)鐘（Clock）q計(jì)算時(shí)間增量nAddHours、AddDays、AddYears、AddMonths、AddWeeks、AddSeconds方法其他計(jì)算時(shí)間增量的方法5.3 常用控件n時(shí)鐘（Clock）q時(shí)鐘的方法方法名稱方法名稱說明說明S

21、ystemTime獲取手機(jī)系統(tǒng)時(shí)間，單位微秒Now獲取當(dāng)前的時(shí)間點(diǎn)MakeInstant以“月/日/年 時(shí):分:秒”、“月/日/年”、“時(shí):分”的格式定義時(shí)間點(diǎn)MakeInstantFromMillis(Number millis)通過毫秒數(shù)定義時(shí)間點(diǎn)GetMillis(instant)從1970年到當(dāng)前時(shí)間所經(jīng)過的毫秒數(shù)量AddSeconds(instant, Number seconds)計(jì)算若干秒以后的時(shí)間點(diǎn)AddMinutes(instant, Number minutes)計(jì)算若干分鐘以后的時(shí)間點(diǎn)AddHours(instant, Number hours)計(jì)算若干小時(shí)以后的時(shí)間點(diǎn)A

22、ddDays(instant, Number days)計(jì)算若干天以后的時(shí)間點(diǎn)AddWeeks(instant, Number weeks)計(jì)算若干星期以后的時(shí)間點(diǎn)AddMonths(instant, Number months)計(jì)算若干月以后的時(shí)間點(diǎn)AddYears(instant, Number years)計(jì)算若干年以后的時(shí)間點(diǎn)Duration(Calendar start, Calendar end) 獲取兩個(gè)時(shí)間點(diǎn)的時(shí)間差值，單位毫秒時(shí)鐘的方法（1）5.3 常用控件n時(shí)鐘（Clock）q時(shí)鐘的方法方法名稱方法名稱說明說明Second(Calendar instant)獲取時(shí)間點(diǎn)的秒M

23、inute(Calendar instant)獲取時(shí)間點(diǎn)的分鐘Hour(Calendar instant)獲取時(shí)間點(diǎn)的小時(shí)DayOfMonth(Calendar instant)獲取時(shí)間點(diǎn)的日期，范圍是1到31的數(shù)字Weekday(Calendar instant)獲取時(shí)間點(diǎn)星期幾，范圍是1（周日）到7（周六）的數(shù)字WeekdayName(Calendar instant)獲取時(shí)間點(diǎn)星期幾，用名稱表述Month(Calendar instant)獲取時(shí)間點(diǎn)的月份，用數(shù)字表示MonthName(Calendar instant)獲取時(shí)間點(diǎn)的月份，用名稱表述Year(Calendar instan

24、t)獲取時(shí)間點(diǎn)的年份FormatDateTime(Calendar instant)格式化輸出日期和時(shí)間FormatDate(Calendar instant)格式化輸出日期FormatTime(Calendar instant)格式化輸出時(shí)間時(shí)鐘的方法（2）5.3 常用控件n例：SuperClock示例q按下不同按鈕，顯示相應(yīng)時(shí)間信息SuperClock示例運(yùn)行界面5.3 常用控件n例：SuperClock示例q界面設(shè)計(jì)n找到非可視化模塊（Non-visible components）的時(shí)鐘控件SuperClock示例的界面設(shè)計(jì)圖5.3 常用控件n例：SuperClock示例q邏輯設(shè)計(jì)Sup

25、erClock示例的全部邏輯模塊（1）5.3 常用控件n例：SuperClock示例q邏輯設(shè)計(jì)SuperClock示例的全部邏輯模塊（2）5.3 常用控件n時(shí)鐘（Clock）q在固定時(shí)間間隔觸發(fā)事件nTimerInterval屬性nTimerEnabled屬性nTimeerAlwaysFires屬性n觸發(fā)事件（Timer）時(shí)鐘的屬性和觸發(fā)事件模式模式說明說明TimerInterval時(shí)間間隔TimerEnabled時(shí)鐘啟動(dòng)開關(guān)TimerAlwaysFires多次產(chǎn)生定時(shí)器事件開關(guān)5.3 常用控件n例：TimerClock示例q點(diǎn)擊“啟動(dòng)計(jì)數(shù)器”按鈕，時(shí)鐘計(jì)時(shí)開始，按鈕上文字變?yōu)椤巴Ｖ褂?jì)數(shù)器”q

26、再次點(diǎn)擊按鈕，時(shí)鐘停止計(jì)時(shí)q點(diǎn)擊選項(xiàng)列表，調(diào)整時(shí)鐘觸發(fā)事件的時(shí)間間隔TimerClock示例運(yùn)行界面5.3 常用控件n例：TimerClock示例q界面設(shè)計(jì)nLabelTitle標(biāo)簽nImage1圖像nLabelCount標(biāo)簽nButton1按鈕nListPicker1選項(xiàng)列表nLabelInterval標(biāo)簽nLabelValue標(biāo)簽nClock1時(shí)鐘TimerClock示例的界面設(shè)計(jì)圖5.3 常用控件n例：TimerClock示例q邏輯設(shè)計(jì)nScreen1屏幕的Initialize事件nListPicker1選項(xiàng)列表的AfterPicking事件nClock1時(shí)鐘的Timer事件nButto

27、n1按鈕的Click事件qScreen1屏幕的Initialize事件n初始化ListPicker1選項(xiàng)列表初始化列表5.3 常用控件n例：TimerClock示例qListPicker1選項(xiàng)列表的AfterPicking事件n將選擇結(jié)果賦值給時(shí)鐘Clock1的TimerInterval屬性n同時(shí)賦值給標(biāo)簽LabelValue的Text屬性qClock1時(shí)鐘的Timer事件n每次時(shí)鐘觸發(fā)后，修改標(biāo)簽LabelCount的Text屬性選后操作和時(shí)鐘觸發(fā)事件5.3 常用控件n例：TimerClock示例qButton1按鈕的Click事件n全局布爾變量runningn若running為true，執(zhí)

28、行then后邏輯n若running為false，執(zhí)行else后邏輯TimerClock示例全部邏輯模塊5.3 常用控件n滑動(dòng)條（Slider）q可視化方法持續(xù)修改數(shù)值q滑動(dòng)條的屬性nColorLeft屬性，滑塊左側(cè)的顏色nColorRight屬性，滑塊右側(cè)的顏色nMaxValue屬性，滑動(dòng)條的最大值nMinValue屬性，滑動(dòng)條的最小值nThumbPosition屬性，滑塊的當(dāng)前值滑動(dòng)條及其屬性5.3 常用控件n滑動(dòng)條（Slider）q滑動(dòng)條的事件n位置改變事件（PositionChanged），滑動(dòng)滑塊時(shí)觸發(fā)q例：SliderColor示例nAI2的預(yù)設(shè)顏色n位置：Blocks - Buil

29、t-in - Colors滑動(dòng)條的PositionChanged事件和AI2的預(yù)設(shè)顏色5.3 常用控件n例： SliderColor示例qAI2的自定義顏色q位置：Blocks - Built-in - Colors - make colorq將三原色以列表形式傳遞給make colorn第一項(xiàng)表示紅色n第二項(xiàng)表示綠色n第三項(xiàng)表示藍(lán)色自定義顏色5.3 常用控件n例： SliderColor示例q使用滑動(dòng)條調(diào)節(jié)三原色的比例q自定義顏色在顏色顯示區(qū)顯示SliderColor示例運(yùn)行界面5.3 常用控件n例： SliderColor示例q界面設(shè)計(jì)nLabelTitle標(biāo)簽nLabelArea標(biāo)簽nL

30、abelColor標(biāo)簽nLabelValue標(biāo)簽nLabelRed標(biāo)簽nSliderRed滑動(dòng)條nLabelGreen標(biāo)簽nSliderGreen滑動(dòng)條nLabelBlue標(biāo)簽nSliderBlue滑動(dòng)條SliderColor示例界面設(shè)計(jì)圖5.3 常用控件n例： SliderColor示例q邏輯設(shè)計(jì)n全局變量red、全局變量green、全局變量bluenChangeColor函數(shù)n滑動(dòng)條的PositionChanged事件全局變量red、green、blue5.3 常用控件n例： SliderColor示例qChangeColor函數(shù)n根據(jù)三原色的值改變“顏色顯示區(qū)”的顏色n將三原色的值分別顯

31、示在標(biāo)簽LabelValue中ChangeColor函數(shù)5.3 常用控件n例： SliderColor示例q滑動(dòng)條的PositionChanged事件n將滑動(dòng)條的值直接賦值給全局變量n調(diào)用ChangeColor函數(shù)改變“顏色顯示區(qū)”的顏色滑動(dòng)條的PositionChanged事件5.3 常用控件n例： SliderColor示例q邏輯設(shè)計(jì)SliderColor示例全部邏輯模塊5.3 常用控件n網(wǎng)頁瀏覽器（WebViewer）q顯示網(wǎng)頁的控件q設(shè)置主頁（HomeUrl）q打開指定頁面q查看瀏覽記錄q返回鍵直接退出網(wǎng)頁瀏覽器5.3 常用控件n網(wǎng)頁瀏覽器（WebViewer）q網(wǎng)頁瀏覽器的屬性網(wǎng)頁瀏

32、覽器的屬性屬性屬性說明說明CurrentPageTitle當(dāng)前頁面的的標(biāo)題CurrentUrl當(dāng)前頁面的URLFollowLinks是否允許用戶通過點(diǎn)擊頁面的鏈接計(jì)入其它頁面。若允許，則可以使用GoBack或GoForward函數(shù)在瀏覽器的歷史記錄中進(jìn)行導(dǎo)航HomeUrl用來設(shè)置主頁，標(biāo)識(shí)網(wǎng)頁瀏覽器初始化打開時(shí)加載的頁面PromptforPermission是否允許網(wǎng)頁瀏覽器訪問有關(guān)地理位置的API.UsesLocation 是否允許應(yīng)用使用Javascript的地理位置API，僅在界面編輯器中有效Visible設(shè)置網(wǎng)頁瀏覽器是否可見Width設(shè)置網(wǎng)頁瀏覽器的寬度Height設(shè)置網(wǎng)頁瀏覽器的高

33、度5.3 常用控件網(wǎng)頁瀏覽器的事件n網(wǎng)頁瀏覽器（WebViewer）q不支持任何事件q網(wǎng)頁瀏覽器的方法nGoToUrl方法，打開指定的URLnGoHome方法，打開主頁nClearLocations方法，清楚位置信息nCanGoForward（CanGoBack）方法，檢測是否可以在歷史記錄中前進(jìn)（后退）nGoForward（GoBack）方法，打開史記記錄的前（后）一個(gè)頁面5.3 常用控件MiniWeb示例運(yùn)行界面n例：MiniWeb示例q點(diǎn)擊“對(duì)號(hào)”按鈕，打開網(wǎng)頁，默認(rèn)是http:/.hkq“回退”和“前進(jìn)”按鈕，在頁面間切換5.3 常用控件MiniWeb示例的界面設(shè)計(jì)圖n例：MiniWe

34、b示例q界面設(shè)計(jì)nButtonBack按鈕nLabelUrlTitle標(biāo)簽nButtonForward按鈕nTextBox1文本框nButtonGo按鈕nLabelUrl標(biāo)簽nWebViewer1網(wǎng)頁瀏覽器nClock1時(shí)鐘n上傳圖像到Media5.3 常用控件ButtonGo的Click事件和Clock1的Timer事件n例：MiniWeb示例q邏輯設(shè)計(jì)nButtonGo按鈕的Click事件nClock1時(shí)鐘的Timer事件5.3 常用控件n例：MiniWeb示例q邏輯設(shè)計(jì)nButtonBack和ButtonForward按鈕的Click事件ButtonBack和ButtonForward的

35、Click事件5.3 常用控件n例：MiniWeb示例q邏輯設(shè)計(jì)nButtonGo按鈕的Click事件nClock1時(shí)鐘的Timer事件nButtonBack按鈕的Click事件nButtonForward按鈕的Click事件MiniWeb示例全部邏輯模塊5.3 常用控件通知n通知（Notifier）q顯示對(duì)話框信息和浮動(dòng)提示信息q可輸出Android系統(tǒng)的Log日志5.3 常用控件n通知（Notifier）q通知的方法通知的方法方法方法說明說明ShowMessageDialog顯示消息對(duì)話框，只有一個(gè)按鈕，可設(shè)定按鈕顯示的文字ShowChooseDialog顯示選擇對(duì)話框，有兩個(gè)或三個(gè)按鈕，

36、并可設(shè)定按鈕顯示的文字ShowTextDialog顯示文本對(duì)話框，可在對(duì)話框中輸入文字ShowAlert顯示浮動(dòng)信息LogErrorLog日志的錯(cuò)誤信息LogInfoLog日志的提示信息LogWarningLog日志的警告信息5.3 常用控件n通知（Notifier）q通知的屬性，只對(duì)浮動(dòng)信息生效nBackgroundColor屬性，文本背景顏色nTextColor屬性，文本顏色nNotifierLength屬性，浮動(dòng)消息顯示時(shí)間通知的屬性5.3 常用控件n通知（Notifier）q通知的事件n選擇后事件（AfterChoosing）在對(duì)話框中做出選擇后產(chǎn)生，常與ShowChooseDialog方法結(jié)合使用n輸入后事件（AfterTextInput ）在對(duì)話框中輸入文本并關(guān)閉對(duì)話框是產(chǎn)生，常與ShowTextDialog方法結(jié)合使用通知的事件5.3 常用控件n例：ShowMessage示例q點(diǎn)擊不同按鈕，在“提示信息”處有相應(yīng)顯示ShowMessage示例5.3 常用控件n例：ShowMessage示例q邏輯設(shè)計(jì)nButt