當(dāng)我們利用B4A程式來開發(fā)AndroidAPP時(shí)課件

第十一章

使用者基本介面設(shè)計(jì)課程名稱：程式設(shè)計(jì)授課老師：李春雄博士第十一章

使用者基本介面設(shè)計(jì)課程名稱：程式設(shè)計(jì)本章學(xué)習(xí)目標(biāo)

1.讓讀者瞭解在B4A開發(fā)環(huán)境中「使用者基本介面

設(shè)計(jì)」物件種類及各物件的主要與共同屬性。2.讓讀者瞭解B4A開發(fā)環(huán)境中「使用者基本介面設(shè)

計(jì)」物件的使用方法與應(yīng)用。本章學(xué)習(xí)目標(biāo)1.讓讀者瞭解在B4A開發(fā)環(huán)境中「使用者基本介本章內(nèi)容11-1B4A的使用者介面設(shè)計(jì)工具11-2標(biāo)籤物件(Label)11-3輸入方塊物件(EditText)11-4命令控制項(xiàng)(Button)11-5對(duì)話訊息方塊11-6單選鈕物件(RadioButton)11-7複選鈕物件(CheckBox)11-8使用者螢?zāi)晃锛?Activity)本章內(nèi)容11-1B4A的使用者介面設(shè)計(jì)工具11-1B4A的使用者介面設(shè)計(jì)工具【功能】可以讓設(shè)計(jì)者在「設(shè)計(jì)介面」的同時(shí)，可以看到「呈現(xiàn)方式」。【工具】1.設(shè)計(jì)介面工具：Designer與AbstractDesigner設(shè)計(jì)視窗2.呈現(xiàn)方式工具：連結(jié)到Android模擬器與實(shí)體手機(jī)或平板【完整步驟】步驟一、在B4A功能選單中，開啟「Designer」設(shè)計(jì)視窗11-1B4A的使用者介面設(shè)計(jì)工具【功能】可以讓設(shè)計(jì)者在步驟二、從「Designer」設(shè)計(jì)視窗上方「AddView」功能選項(xiàng)，加入物件到「AbstractDesigner」介面中(亦即是一種抽像設(shè)計(jì)，因?yàn)橹豢吹桨婷媾渲?，而無法看到物件屬性值)，分別為：Label1與Button1。步驟二、從「Designer」設(shè)計(jì)視窗上方「AddView步驟三、在「Designer」設(shè)計(jì)視窗中設(shè)定物件的屬性之屬性值物件名稱屬性屬性值Label1NamelblResultButton1NamebtnRunButton1Text執(zhí)行結(jié)果btnRun執(zhí)行結(jié)果步驟三、在「Designer」設(shè)計(jì)視窗中設(shè)定物件的屬性之屬性步驟四：透過「Designer」設(shè)計(jì)視窗中的「Tools」工具選項(xiàng)，將「AbstractDesigner介面」連結(jié)到Android模擬器(即可看到版面配置中物件的屬性值)步驟四：透過「Designer」設(shè)計(jì)視窗中的「Tools」工步驟五：建立物件及事件之程式碼(一)建立介面表單中的物件及相關(guān)事件，其方式有兩種：第一種方法：從「Designer」設(shè)計(jì)視窗上方「Tools」功能表下的「GenerateMembers」選項(xiàng)來建立物件及事件之程式碼第二種方法：直接在「物件」上方按滑鼠右鍵，此時(shí)，請?jiān)诠δ苓x單中選擇「Generate」，並選取宣告的程式碼及相關(guān)事件。步驟五：建立物件及事件之程式碼第一種方法:「GenerateMembers」【適用時(shí)機(jī)】一次可以設(shè)定多個(gè)物件及事件之程式碼例如：一次宣告兩個(gè)物件(Button1,Label1)及一個(gè)事件程序(Button1_Click)【說明】請勾選需要使用的物件及事件即可，最後，再按「Close」鈕。第一種方法:「GenerateMembers」【適用時(shí)機(jī)】第二種方法：選擇「Generate」【適用時(shí)機(jī)】一次只針對(duì)某一物件宣告或事件程序產(chǎn)生程式碼例如1：宣告Label物件來顯示資料時(shí)，則只選「DimlalResultAsLabel」DimlalResultAsLabel第二種方法：選擇「Generate」【適用時(shí)機(jī)】一次只針對(duì)某例如2：宣告Button物件具有執(zhí)行功能時(shí)，則必須選

「DimbtnRunAsButton」及「Click」事件DimbtnRunAsButtonClick例如2：宣告Button物件具有執(zhí)行功能時(shí)，則必須選Dim此時(shí)，在Basic4Android程式碼編輯區(qū)中的「SubGlobals」程序中自動(dòng)產(chǎn)生以下兩行程式碼及btnRun_Click事件：此時(shí)，在Basic4Android程式碼編輯區(qū)中的「Sub【有關(guān)AddView表單物件】在B4A程式語言中，它的表單物件如下圖：【有關(guān)AddView表單物件】在B4A程式語言中，它的表單【說明】在上圖中，AddView表單物件共有18種，常被使用有17種，並分成「基本介面物件」與「進(jìn)階介面物件」?！驹]】「基本介面物件」在本章節(jié)介紹。而「進(jìn)階介面物件」會(huì)在第十二章介紹。基本介面物件進(jìn)階介面物件1.標(biāo)籤物件(Label)2.輸入方塊物件(EditText)3.命令控制項(xiàng)(Button)4.單選鈕物件(RadioButton)5.複選鈕物件(CheckBox)1.開關(guān)式核取物件(ToggleButton)2.下拉式清單物件(Spinner)3.清單選項(xiàng)物件(ListView)4.容器物件(Panel)5.標(biāo)籤頁物件(TabHost)6.瀏覽器物件(WebView)7影像物件(ImageView)8.可捲動(dòng)的容器物件(ScrollView)9.可水平捲動(dòng)的容器物件(HorizontalScrollView)10.進(jìn)度軸(ProgressBar)11.讓用戶調(diào)整進(jìn)度(SeekBar)12.系統(tǒng)自動(dòng)顯示關(guān)鍵字(AutoCompleteEditText)【說明】基本介面物件進(jìn)階介面物件1.標(biāo)籤物件(Label)1【各物件的主要與共同屬性】屬性說明-MainName物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Type物件型態(tài)(唯讀)不提供使用者修改名稱EventName事件處理程序名稱(預(yù)設(shè)與物件名稱相同)建議使用預(yù)設(shè)即可Parent父物件的名稱(預(yù)設(shè)為最上層的Activity)當(dāng)在介面表單中，有加入Panel容器物件時(shí)，則可以讓其他物件選擇。-CommonpropertiesLeft與父物件左邊界的距離(用來調(diào)整物件「水平」位置)Top與父物件上邊界的距離(用來調(diào)整物件「垂直」位置)Width調(diào)整物件的寬度設(shè)定物件的大小Height調(diào)整物件的高度Enabled設(shè)定物件是否可被使用(預(yù)設(shè)為True(可被使用))Visible設(shè)定物件是否可被看見(預(yù)設(shè)為True(可被看見))Tag用來註記物件的額外資訊Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」【各物件的主要與共同屬性】屬性說明-MainName物件名稱11-2標(biāo)籤物件(Label)【定義】是一種用來提示使用者在輸入或輸出資料時(shí)的說明?！灸康摹刻崾臼褂谜呦嚓P(guān)的訊息內(nèi)容?！臼褂脮r(shí)機(jī)】提示訊息或說明?！緢D解說明】【注意】「Label標(biāo)籤物件」一般是用來「顯示」的資料給予提示訊息和說明，但不提供使用者「輸入或修改」的動(dòng)作。11-2標(biāo)籤物件(Label)【定義】是一種用來提示使用【實(shí)作】標(biāo)籤物件(Label)的實(shí)作步驟如下所示：【實(shí)作】標(biāo)籤物件(Label)的實(shí)作步驟如下所示：【設(shè)定屬性值】一般在設(shè)定屬性值有兩種方法：第一種：靜態(tài)設(shè)定(利用屬性表來設(shè)定)【說明】表單中的Label1物件其內(nèi)容是要透過「屬性表」的設(shè)定，方法如下：

物件名稱.屬性名稱

=屬性值【設(shè)定屬性值】一般在設(shè)定屬性值有兩種方法：【標(biāo)籤物件(Label)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」TextStyle設(shè)定文字樣式：Typeface(設(shè)定字型)Style(設(shè)定字體樣式：正常、粗體、斜體及粗斜體)HorizontalAlignment(水平排列：靠左、置中及靠右)VerticalAlignment(垂直排列：頂上、置中及底下)Size(設(shè)定字體大小)TextColor(設(shè)定字體顏色)Drawable三種模式(一)ColorDrawable(色彩模式)預(yù)設(shè)模式1.Cornerradius(設(shè)定圓滑角大小)2.Color(設(shè)定背景顏色)3.Alpha(設(shè)定深淺度)(二)GradientDrawable(漸層模式)(三)BitmapDrawable(圖片模式)【標(biāo)籤物件(Label)中常被設(shè)定的屬性】屬性說明Name物第二種：動(dòng)態(tài)設(shè)定(利用撰寫程式方式)步驟一：建立物件Label1第二種：動(dòng)態(tài)設(shè)定(利用撰寫程式方式)步驟二：撰寫程式碼【說明】要利用程式來撰寫時(shí)，必須先要知道，表單中是否已經(jīng)有Label物件，否則指示給不存在的物件，將會(huì)產(chǎn)生錯(cuò)誤。步驟二：撰寫程式碼步驟三：執(zhí)行結(jié)果【注意】要在「執(zhí)行後」才能看得到設(shè)定的結(jié)果。步驟三：執(zhí)行結(jié)果11-3輸入方塊物件(EditText)【定義】是指用來讓使用者輸入「開放式」資料的介面?！灸康摹孔屖褂谜咻斎氤淌剿杼幚淼脑假Y料?！臼褂脮r(shí)機(jī)】輸入或修改文字內(nèi)容?！緢D解說明】11-3輸入方塊物件(EditText)【定義】是指用來【實(shí)作】輸入方塊物件(EditText)的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText1NameedtUserNameEditText1HintText輸入帳號(hào)【實(shí)作】輸入方塊物件(EditText)的實(shí)作步驟如下所示：【輸入方塊物件(EditText)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text使用者輸入的內(nèi)容Password設(shè)定為密碼文字方塊。例如：登入介面的密碼方塊。SingleLine單行文字方塊(預(yù)設(shè)為True)，如果設(shè)為False則為多行文字方塊。例如：討論區(qū)與留言板。InputType設(shè)定使用者允許輸入內(nèi)容的資料型態(tài)。NUMBERS(整數(shù)型態(tài))TEXT(文字型態(tài))PHONE(電話號(hào)碼型態(tài))DECIMALNUMBERS(小整數(shù)型態(tài))HintText提示字(用來提醒使用者，該欄位要輸入的資料類型)HintColor設(shè)定提示字的顏色Wrap當(dāng)SingleLine設(shè)定為False則為多行文字方塊預(yù)設(shè)值True代表會(huì)自動(dòng)換行；False代表不會(huì)自動(dòng)換行【輸入方塊物件(EditText)中常被設(shè)定的屬性】屬性說明11-3.1密碼文字方塊【目的】保護(hù)個(gè)人的隱私及資料安全?！臼褂脮r(shí)機(jī)】保護(hù)隱私時(shí)。例如登入介面的「密碼」?！緢D解說明】11-3.1密碼文字方塊【目的】保護(hù)個(gè)人的隱私及資料安全【實(shí)作】設(shè)定密碼文字方塊的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText2NameedtPasswordEditText2PasswordTrueEditText2HintText輸入密碼【實(shí)作】設(shè)定密碼文字方塊的實(shí)作步驟如下所示：物件名稱屬性屬性11-3.2多行文字方塊【目的】可以完整顯示「文章式」的內(nèi)容?！臼褂脮r(shí)機(jī)】資料量較多時(shí)。例如：討論區(qū)與留言板?！緢D解說明】11-3.2多行文字方塊【目的】可以完整顯示「文章式」的【實(shí)作】設(shè)定多行文字方塊的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText3NameedtTalkAreaEditText3SingleLineFalseEditText3HintText輸入留言內(nèi)容EditText3WrapTrue【實(shí)作】設(shè)定多行文字方塊的實(shí)作步驟如下所示：物件名稱屬性屬性11-4命令控制項(xiàng)(Button)【定義】是指用來執(zhí)行Click事件中的「事件程序」之程式?！灸康摹繉ｉT來「處理」使用者輸入的原始資料?！臼褂脮r(shí)機(jī)】命令程式碼【圖解說明】1.使用者按下按「登入」鈕。2.按鈕就會(huì)觸發(fā)「Click事件」。3.自動(dòng)執(zhí)行「事件處理程序」。11-4命令控制項(xiàng)(Button)【定義】是指用來執(zhí)行C圖解說明【說明】當(dāng)使用者按一下「Button命令控制項(xiàng)」時(shí)，馬上就會(huì)觸發(fā)「Click事件」，並且執(zhí)行對(duì)映的「事件處理程序」。圖解說明【說明】11-4.1文字按鈕(TextButton)【目的】是指命令控制項(xiàng)是以「文字標(biāo)題」呈現(xiàn)?！臼褂脮r(shí)機(jī)】一般性的資訊系統(tǒng)的介面設(shè)計(jì)【圖解說明】11-4.1文字按鈕(TextButton)【目的】是【實(shí)作】文字按鈕(TextButton)的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值Buton1NamebtnLoginButon1Text登入【實(shí)作】文字按鈕(TextButton)的實(shí)作步驟如下所示【命令控制項(xiàng)(Button)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」TextStyle設(shè)定文字樣式：1.Typeface(設(shè)定字型)2.Style(設(shè)定字體樣式：正常、粗體、斜體及粗斜體)3.HorizontalAlignment(水平排列：靠左、置中及靠右)4.VerticalAlignment(垂直排列：頂上、置中及底下)5.Size(設(shè)定字體大小)6.TextColor(設(shè)定字體顏色)【兩個(gè)重要的事件】物件名稱事件功能Buton1Click當(dāng)使用者「按一下」Buton鈕觸發(fā)的事件Buton1LongClick當(dāng)使用者「長按一下」Buton鈕觸發(fā)的事件【命令控制項(xiàng)(Button)中常被設(shè)定的屬性】屬性說明Nam【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)使用者「按一下」，出現(xiàn)「短按圖示」只能開啟應(yīng)用程式，而當(dāng)使用者「長按一下」，出現(xiàn)「長按開關(guān)」才能開啟電腦主機(jī)。

【註】「短按」是指「點(diǎn)一下」?！搁L按」是指「停留大約1~2秒」?！緟⒖冀獯稹俊緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)使用者「按一下」，出現(xiàn)「短按圖示」11-4.2圖片按鈕(PictureButton)【目的】是指命令控制項(xiàng)是以「圖片標(biāo)題」呈現(xiàn)。【使用時(shí)機(jī)】遊戲或多媒體的資訊系統(tǒng)的介面設(shè)計(jì)。【圖解說明】11-4.2圖片按鈕(PictureButton)【目【命令控制項(xiàng)(Button)之圖片按鈕設(shè)定的屬性】在B4A程式語言中，它的按鈕之背景圖片所支援的格式有：BMP,JPG,GIF及PNG等四種。其相關(guān)屬性的設(shè)定如下表：屬性說明Drawable一、DefaultDrawable(預(yù)設(shè))二、StatelistDrawable(一)EnabledDrawable(正常按鈕)1.ColorDrawable(色彩模式)預(yù)設(shè)模式(1)Cornerradius(設(shè)定圓滑角大小)(2)Color(設(shè)定背景顏色)(3)Alpha(設(shè)定深淺度)2.GradientDrawable(漸層模式)3.BitmapDrawable(圖片模式)(1)Imagefile(圖檔)(二)DisabledDrawable(沒有作用按鈕)(三)PressedDrawable(按下按鈕)【命令控制項(xiàng)(Button)之圖片按鈕設(shè)定的屬性】在B4A程【實(shí)作步驟】請?jiān)O(shè)計(jì)一個(gè)按鈕物件同時(shí)具有「圖片+文字」步驟一：開啟「Designer」設(shè)計(jì)視窗，並在右邊的「ImageFiles」

框框加入圖檔?！緦?shí)作步驟】請?jiān)O(shè)計(jì)一個(gè)按鈕物件同時(shí)具有「圖片+文字」步驟二：選擇欲加入的圖檔。步驟二：選擇欲加入的圖檔。步驟三：在屬性表中的「Drawable」屬性，選擇「StatelistDrawable」屬性值，並再選「EnabledDrawable」屬性下的「BitmapDrawable」屬性值。因此，再到「Imagefile」屬性下，選擇「Login_icon.gif」圖檔。如下圖所示。步驟三：在屬性表中的「Drawable」屬性，選擇「Stat步驟四：執(zhí)行結(jié)果【參考解答】------------SubbtnLogin_ClickIfedtUserName.Text=""ORedtPassword.Text=""ThenMsgbox("您尚未輸入帳號(hào)或密碼哦!","產(chǎn)生錯(cuò)誤...")ElseDimUsernameAsStringDimPasswordAsStringUsername=edtUserName.TextPassword=edtPassword.TextIfUsername="LeechPhd"ANDPassword="123456"ThenMsgbox("您是合法使用者！","系統(tǒng)回覆")ElseMsgbox("您是非法使用者！","系統(tǒng)回覆")EndIfEndIf步驟四：執(zhí)行結(jié)果【參考解答】------11-5對(duì)話訊息方塊【定義】是指用來讓使用者與正在執(zhí)行中程式進(jìn)行互動(dòng)，並作適時(shí)的回覆?！灸康摹匡@示程式執(zhí)行中的狀態(tài)?！臼褂脮r(shí)機(jī)】提醒目前程式執(zhí)行過程的狀態(tài)?！纠纭看_認(rèn)視窗或錯(cuò)誤訊息視窗?！境尸F(xiàn)方式】1.訊息方塊(只提供訊息)2.對(duì)話訊息方塊(除了提供訊息，也提供對(duì)話功能)【圖解說明】11-5對(duì)話訊息方塊【定義】是指用來讓使用者與正在執(zhí)行中程11-5.1訊息方塊(MsgBox)【功能】只顯示訊息，但不傳回值?！靖袷健縈sgbox("訊息內(nèi)容","標(biāo)題")【範(fàn)例】Msgbox("這是我的簡單訊息窗內(nèi)容!!!","公告事項(xiàng)")【程式碼】ch11-5.1.b4a11-5.1訊息方塊(MsgBox)【功能】只顯示訊息，11-5.2對(duì)話訊息方塊(MsgBox2)【功能】可以顯示訊息，也可以傳回值?！靖袷健縈sgbox2("第1個(gè)參數(shù)_訊息內(nèi)容","第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【說明】在以上六個(gè)參數(shù)中，第1~2個(gè)參數(shù)務(wù)必要有資料內(nèi)容。而第3~5個(gè)參數(shù)可以依照使用者的需要加入，如果沒有需要，則填入「""」空字串。但是，第6個(gè)參數(shù)如果沒有需要，則填入「null」空值。11-5.2對(duì)話訊息方塊(MsgBox2)【功能】可以顯示【範(fàn)例1】只有第1~2個(gè)參數(shù)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例1】只有第1~2個(gè)參數(shù)【格式再提示】【範(fàn)例2】只有第1,2及6個(gè)參數(shù)(含有圖片)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字",

"第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例2】只有第1,2及6個(gè)參數(shù)(含有圖片)【格式再提示】【範(fàn)例3】只有第1~5個(gè)參數(shù)(不含圖片)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題",

"第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例3】只有第1~5個(gè)參數(shù)(不含圖片)【格式再提示】【範(fàn)例4】6個(gè)參數(shù)(全部)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題",

"第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【程式碼】ch11-5.2A.b4a【範(fàn)例4】6個(gè)參數(shù)(全部)【格式再提示】【程式碼】ch11-【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)訊息視窗，可以讓使用者點(diǎn)選「同意」、「取消」或「不同意」，並且傳回值?！緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)訊息視窗，可以讓使用者點(diǎn)選「同意」、「取消【參考解答】【參考解答】11-5.3彈跳式訊息方塊(ToastMessageShow)【功能】在短時(shí)間顯示訊息，用來提醒使用者即將發(fā)生的狀況?！靖袷健縏oastMessageShow("訊息內(nèi)容","設(shè)定時(shí)間長短")【說明】設(shè)定時(shí)間長短時(shí)，當(dāng)True代表3秒，而False代表2秒【範(fàn)例】ToastMessageShow("考試時(shí)間即將結(jié)束!!!","True")11-5.3彈跳式訊息方塊(ToastMessageShow11-5.4狀態(tài)列通知【引言】一套功能完整的AndroidApp應(yīng)用程式，除了避免以上三種錯(cuò)誤之外，也必須要將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用者，以便讓使用者了解?！境Ｒ姷淖鞣ā?.利用MsgBox訊息對(duì)話方塊。Msgbox("訊息內(nèi)容","標(biāo)題")

2.彈跳式訊息方塊(ToastMessageShow)ToastMessageShow("訊息內(nèi)容","設(shè)定時(shí)間長短")3.開啟新的Activity活動(dòng)之活動(dòng)頁面。StartActivity("活動(dòng)頁面")4.利用狀態(tài)列通知

本單元介紹！!!11-5.4狀態(tài)列通知【引言】[利用狀態(tài)列通知]【功能】將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用者，以便讓使用者了解?！靖袷健縎etInfo("標(biāo)題","訊息內(nèi)容",Activity活動(dòng)之活動(dòng)頁面)【說明】如果在Main活動(dòng)執(zhí)行並顯示時(shí)，則第三個(gè)參數(shù)設(shè)為Null?！竟?fàn)例】[利用狀態(tài)列通知]【功能】將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用【注意】圖示檔案要先複製到指定的目錄下，亦即本支程式資料夾中的「Objects／res／drawable／並且每一位圖檔都必需要設(shè)定為「唯讀」?fàn)顟B(tài)。設(shè)定為「唯讀」?fàn)顟B(tài)【注意】圖示檔案要先複製到指定的目錄下，亦即本支程式資料夾中【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)學(xué)生的成績?yōu)椴煌?jí)數(shù)時(shí)，其條件如下：1.80~100為優(yōu)等生。2.60~79為及格。3.60以下為不及格。並且以上三種不同情況，顯示不同的圖示?！緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)學(xué)生的成績?yōu)椴煌?jí)數(shù)時(shí)，其條件如下【參考解答】【參考解答】11-6單選鈕物件(RadioButton)【定義】是指用來讓使用者輸入單一「封閉式」資料的介面?！灸康摹坷谩更c(diǎn)選方式」來輸入程式所需處理的原始資料?！緝?yōu)點(diǎn)】確保資料的一致性與正確性?！救秉c(diǎn)】無法讓使用者填入「開放式」資料?！臼褂脮r(shí)機(jī)】當(dāng)程式中需要有多個(gè)選項(xiàng)可供選擇，但只能單選時(shí)，我們可以使用「選項(xiàng)鈕」控制項(xiàng)來設(shè)計(jì)。實(shí)務(wù)上的應(yīng)用方面如下：11-6單選鈕物件(RadioButton)【定義】是指【實(shí)作】單選鈕物件(RadioButton)的實(shí)作步驟如下所示：【常見的屬性設(shè)定】屬性功能Name設(shè)定控制項(xiàng)的名稱Text設(shè)定控制項(xiàng)的內(nèi)容Checked當(dāng)Checked屬性的屬性值為True時(shí)，代表被核取(勾選)，當(dāng)Checked屬性的屬性值為False時(shí)，代表不核取(不勾選)。預(yù)設(shè)值為False?！緦?shí)作】單選鈕物件(RadioButton)的實(shí)作步驟如下所【重要觀念】先了解RadioButton1如何被點(diǎn)選，其原理是Checked屬性，當(dāng)Checked屬性的屬性值為True時(shí)，代表被點(diǎn)選了，否則就沒有被點(diǎn)選。實(shí)務(wù)上的應(yīng)用：在程式中應(yīng)該撰寫成

RadioButton1.Checked=True

物件名稱?屬性=屬性值說明：若要判斷那個(gè)RadioButton1控制項(xiàng)的核取方塊是否被選取，只要透過下列敘述即可。IfRadioButton1.checked=TrueThen‘判斷控制項(xiàng)是否被選取…………EndIf【重要觀念】先了解RadioButton1如何被點(diǎn)選，其原理【實(shí)作】請利用「RadioButton」物件來設(shè)計(jì)介面表單，可以讓學(xué)生輸入「姓名」並點(diǎn)選「一門」最喜歡的「科目名稱」，最後顯示姓名及所選的科目名稱?！緦?shí)作】請利用「RadioButton」物件來設(shè)計(jì)介面表單，【參考解答】【參考解答】11-7複選鈕物件(CheckBox)【定義】是指用來讓使用者同時(shí)輸入多個(gè)「封閉式」資料的介面?！灸康摹坷谩腹催x方式」來輸入程式所需處理的原始資料?！緝?yōu)點(diǎn)】確保資料的一致性與正確性?！救秉c(diǎn)】無法讓使用者填入「開放式」資料?！臼褂脮r(shí)機(jī)】輸入的資料項(xiàng)目三個(gè)或以上時(shí)。11-7複選鈕物件(CheckBox)【定義】是指用來【實(shí)作】複選鈕物件(CheckBox)的實(shí)作步驟如下所示：【常見的屬性設(shè)定】屬性功能Name設(shè)定控制項(xiàng)的名稱Text設(shè)定控制項(xiàng)的內(nèi)容Checked當(dāng)Checked屬性的屬性值為True時(shí)，代表被核取(勾選)，當(dāng)Checked屬性的屬性值為False時(shí)，代表不核取(不勾選)。預(yù)設(shè)值為False?！緦?shí)作】複選鈕物件(CheckBox)的實(shí)作步驟如下所示：屬【重要觀念】先了解CheckBox1如何被點(diǎn)選，其原理是Checked屬性，當(dāng)Checked屬性的屬性值為True時(shí)，代表被點(diǎn)選了，否則就沒有被點(diǎn)選。實(shí)務(wù)上的應(yīng)用：在程式中應(yīng)該撰寫成

CheckBox1.Checked=True

物件名稱?屬性=屬性值說明：若要判斷那個(gè)CheckBox1控制項(xiàng)的核取方塊是否被選取，只要透過下列敘述即可。IfCheckBox1.checked=TrueThen‘判斷控制項(xiàng)是否被選取…………EndIf【重要觀念】先了解CheckBox1如何被點(diǎn)選，其原理是Ch【實(shí)作】請利用「CheckBox」物件來設(shè)計(jì)介面表單，可以讓學(xué)生輸入「姓名」並點(diǎn)選「多門」喜歡的「科目名稱」，最後顯示姓名及所選的科目名稱。【實(shí)作】請利用「CheckBox」物件來設(shè)計(jì)介面表單，可以讓【參考解答】程式檔案名稱ch11-7B.b4a01020304050607080910111213141516171819202122232425SubbtnRun_ClickIfedtName.Text=""ThenMsgbox("您尚未輸入姓名哦!","產(chǎn)生錯(cuò)誤...")ElseDimTempAsStringTemp=edtName.Text&"同學(xué)

您好："&CRLFTemp=Temp&"你喜歡的科目為："&CRLFIfchkProgram.Checked=TrueThenTemp=Temp&chkProgram.Text&CRLFEndIfIfchkDB.Checked=TrueThenTemp=Temp&chkDB.Text&CRLFEndIfIfchkDS.Checked=TrueThenTemp=Temp&chkDS.Text&CRLFEndIfIfchkSA.Checked=TrueThenTemp=Temp&chkSA.Text&CRLFEndIfIfchkComputer.Checked=TrueThenTemp=Temp&chkComputer.Text&CRLFEndIflblResult.Text=TempEndIfEndSub【參考解答】程式檔案名稱ch11-7B.b4a01Subb11-8使用者螢?zāi)晃锛?Activity)【定義】是指使用者將螢?zāi)划?dāng)作一個(gè)物件來使用?！境Ｒ姷氖录縏ouch事件：使用者在觸模螢?zāi)粫r(shí)，就會(huì)立即觸發(fā)此事件，並且會(huì)傳回

該事件的動(dòng)作及座標(biāo)所在位置。KeyPress事件：是指「按下」鍵盤之按鍵就會(huì)對(duì)映到某一KeyCode碼。KeyUp事件：是指「放開」鍵盤。11-8使用者螢?zāi)晃锛?Activity)【定義】是指使【實(shí)作1】請利用「Touch事件」來偵測你目前在觸發(fā)動(dòng)作及座標(biāo)所在位置?！緦?shí)作1】請利用「Touch事件」來偵測你目前在觸發(fā)動(dòng)作及座【參考解答】【參考解答】【實(shí)作2】請利用以上兩種結(jié)束活動(dòng)事件的方法，來結(jié)束「實(shí)作1」的執(zhí)行畫面?！緦?shí)作2】請利用以上兩種結(jié)束活動(dòng)事件的方法，來結(jié)束「實(shí)作1」【參考解答】【參考解答】【結(jié)束活動(dòng)事件的方法】1.Activity.Finish()2.ExitApplication()【結(jié)束活動(dòng)事件的方法】1.Activity.Finish(11-9行動(dòng)裝置之螢?zāi)怀叽纭疽浴慨?dāng)我們利用B4A程式來開發(fā)AndroidAPP時(shí)，您一定會(huì)遇到不同行動(dòng)裝置之螢?zāi)怀叽绱笮∫约拔災(zāi)恢毕蚧驒M向旋轉(zhuǎn)的問題。換言之，不同螢?zāi)怀叽缭谠O(shè)計(jì)時(shí)，必須要設(shè)定不同的版面編排(Layout)方式?！境Ｒ姷奈?zāi)怀叽纭磕壳靶袆?dòng)裝置之螢?zāi)怀叽?，大致上可以分為三大類：一?吋(含以上)：是指智慧型手機(jī)二、7吋(含以上)：小型平版電腦三、10吋(含以上)：平版電腦11-9行動(dòng)裝置之螢?zāi)怀叽纭疽浴砍Ｒ娙N不同行動(dòng)裝置之螢?zāi)怀叽缍贐4A開發(fā)環(huán)境中，它可以讓設(shè)計(jì)者設(shè)定三種不同螢?zāi)怀叽缫约懊恳环N尺寸配置方式(直向與橫向)，所以共有六種不同的情況。如下圖所示：常見三種不同行動(dòng)裝置之螢?zāi)怀叽缍贐4A開發(fā)環(huán)境中，它可以讓配置方式(直向與橫向)配置方式(直向與橫向)【實(shí)作】請你將原先「直向」呈現(xiàn)的版面配置，另外設(shè)計(jì)可以「水平」呈現(xiàn)。步驟一：建立一個(gè)新的版面配置變異(1)在B4A環(huán)境中開啟「Designer」設(shè)計(jì)視窗(2)從「Designer」設(shè)計(jì)視窗右下方「LayoutVariants」來建立另一個(gè)新的

版面配置表單，您只需按一下「NewVariant」鈕即可?！緦?shí)作】請你將原先「直向」呈現(xiàn)的版面配置，另外設(shè)計(jì)可以「水平【實(shí)作】請你將原先「直向」呈現(xiàn)的版面配置，另外設(shè)計(jì)可以「水平」呈現(xiàn)。步驟一：建立一個(gè)新的版面配置變異(1)在B4A環(huán)境中開啟「Designer」設(shè)計(jì)視窗(2)從「Designer」設(shè)計(jì)視窗右下方「LayoutVariants」來建立另一個(gè)新的

版面配置表單，您只需按一下「NewVariant」鈕即可?！緦?shí)作】請你將原先「直向」呈現(xiàn)的版面配置，另外設(shè)計(jì)可以「水平建立一個(gè)新的版面配置變異建立一個(gè)新的版面配置變異步驟二：重新配置「水平」版面1.從「Designer」設(shè)計(jì)視窗上方「Tools」功能表來選擇「AbstractDesigner」視窗。步驟二：重新配置「水平」版面2.再從「AbstractDesigner」設(shè)計(jì)視窗上方「Layout」功能表來選擇

手機(jī)橫向配置「Phone(landscape)」功能?！驹]】當(dāng)你設(shè)定完成之後，務(wù)必要再連接到實(shí)機(jī)進(jìn)行測試，

以確保介面的正確性。【其他解析度設(shè)定】符合大部份手機(jī)(4吋~7吋)2.再從「AbstractDesigner」設(shè)計(jì)視窗上方「筆者建議，如果你不知道你的手機(jī)解析度時(shí)，可以參考以下的設(shè)定：(一)直向呈現(xiàn)(垂直)筆者建議，如果你不知道你的手機(jī)解析度時(shí)，可以參考以下的設(shè)定：【取得自己手機(jī)的解析度方法】程式碼DimdpiAsLayoutValuesdpi=GetDeviceLayoutValuesMsgbox(dpi,"您的手機(jī)解析度")【取得自己手機(jī)的解析度方法】程式碼DimdpiAsLa第十一章

使用者基本介面設(shè)計(jì)課程名稱：程式設(shè)計(jì)授課老師：李春雄博士第十一章

使用者基本介面設(shè)計(jì)課程名稱：程式設(shè)計(jì)本章學(xué)習(xí)目標(biāo)

1.讓讀者瞭解在B4A開發(fā)環(huán)境中「使用者基本介面

設(shè)計(jì)」物件種類及各物件的主要與共同屬性。2.讓讀者瞭解B4A開發(fā)環(huán)境中「使用者基本介面設(shè)

計(jì)」物件的使用方法與應(yīng)用。本章學(xué)習(xí)目標(biāo)1.讓讀者瞭解在B4A開發(fā)環(huán)境中「使用者基本介本章內(nèi)容11-1B4A的使用者介面設(shè)計(jì)工具11-2標(biāo)籤物件(Label)11-3輸入方塊物件(EditText)11-4命令控制項(xiàng)(Button)11-5對(duì)話訊息方塊11-6單選鈕物件(RadioButton)11-7複選鈕物件(CheckBox)11-8使用者螢?zāi)晃锛?Activity)本章內(nèi)容11-1B4A的使用者介面設(shè)計(jì)工具11-1B4A的使用者介面設(shè)計(jì)工具【功能】可以讓設(shè)計(jì)者在「設(shè)計(jì)介面」的同時(shí)，可以看到「呈現(xiàn)方式」?！竟ぞ摺?.設(shè)計(jì)介面工具：Designer與AbstractDesigner設(shè)計(jì)視窗2.呈現(xiàn)方式工具：連結(jié)到Android模擬器與實(shí)體手機(jī)或平板【完整步驟】步驟一、在B4A功能選單中，開啟「Designer」設(shè)計(jì)視窗11-1B4A的使用者介面設(shè)計(jì)工具【功能】可以讓設(shè)計(jì)者在步驟二、從「Designer」設(shè)計(jì)視窗上方「AddView」功能選項(xiàng)，加入物件到「AbstractDesigner」介面中(亦即是一種抽像設(shè)計(jì)，因?yàn)橹豢吹桨婷媾渲?，而無法看到物件屬性值)，分別為：Label1與Button1。步驟二、從「Designer」設(shè)計(jì)視窗上方「AddView步驟三、在「Designer」設(shè)計(jì)視窗中設(shè)定物件的屬性之屬性值物件名稱屬性屬性值Label1NamelblResultButton1NamebtnRunButton1Text執(zhí)行結(jié)果btnRun執(zhí)行結(jié)果步驟三、在「Designer」設(shè)計(jì)視窗中設(shè)定物件的屬性之屬性步驟四：透過「Designer」設(shè)計(jì)視窗中的「Tools」工具選項(xiàng)，將「AbstractDesigner介面」連結(jié)到Android模擬器(即可看到版面配置中物件的屬性值)步驟四：透過「Designer」設(shè)計(jì)視窗中的「Tools」工步驟五：建立物件及事件之程式碼(一)建立介面表單中的物件及相關(guān)事件，其方式有兩種：第一種方法：從「Designer」設(shè)計(jì)視窗上方「Tools」功能表下的「GenerateMembers」選項(xiàng)來建立物件及事件之程式碼第二種方法：直接在「物件」上方按滑鼠右鍵，此時(shí)，請?jiān)诠δ苓x單中選擇「Generate」，並選取宣告的程式碼及相關(guān)事件。步驟五：建立物件及事件之程式碼第一種方法:「GenerateMembers」【適用時(shí)機(jī)】一次可以設(shè)定多個(gè)物件及事件之程式碼例如：一次宣告兩個(gè)物件(Button1,Label1)及一個(gè)事件程序(Button1_Click)【說明】請勾選需要使用的物件及事件即可，最後，再按「Close」鈕。第一種方法:「GenerateMembers」【適用時(shí)機(jī)】第二種方法：選擇「Generate」【適用時(shí)機(jī)】一次只針對(duì)某一物件宣告或事件程序產(chǎn)生程式碼例如1：宣告Label物件來顯示資料時(shí)，則只選「DimlalResultAsLabel」DimlalResultAsLabel第二種方法：選擇「Generate」【適用時(shí)機(jī)】一次只針對(duì)某例如2：宣告Button物件具有執(zhí)行功能時(shí)，則必須選

「DimbtnRunAsButton」及「Click」事件DimbtnRunAsButtonClick例如2：宣告Button物件具有執(zhí)行功能時(shí)，則必須選Dim此時(shí)，在Basic4Android程式碼編輯區(qū)中的「SubGlobals」程序中自動(dòng)產(chǎn)生以下兩行程式碼及btnRun_Click事件：此時(shí)，在Basic4Android程式碼編輯區(qū)中的「Sub【有關(guān)AddView表單物件】在B4A程式語言中，它的表單物件如下圖：【有關(guān)AddView表單物件】在B4A程式語言中，它的表單【說明】在上圖中，AddView表單物件共有18種，常被使用有17種，並分成「基本介面物件」與「進(jìn)階介面物件」?！驹]】「基本介面物件」在本章節(jié)介紹。而「進(jìn)階介面物件」會(huì)在第十二章介紹?；窘槊嫖锛M(jìn)階介面物件1.標(biāo)籤物件(Label)2.輸入方塊物件(EditText)3.命令控制項(xiàng)(Button)4.單選鈕物件(RadioButton)5.複選鈕物件(CheckBox)1.開關(guān)式核取物件(ToggleButton)2.下拉式清單物件(Spinner)3.清單選項(xiàng)物件(ListView)4.容器物件(Panel)5.標(biāo)籤頁物件(TabHost)6.瀏覽器物件(WebView)7影像物件(ImageView)8.可捲動(dòng)的容器物件(ScrollView)9.可水平捲動(dòng)的容器物件(HorizontalScrollView)10.進(jìn)度軸(ProgressBar)11.讓用戶調(diào)整進(jìn)度(SeekBar)12.系統(tǒng)自動(dòng)顯示關(guān)鍵字(AutoCompleteEditText)【說明】基本介面物件進(jìn)階介面物件1.標(biāo)籤物件(Label)1【各物件的主要與共同屬性】屬性說明-MainName物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Type物件型態(tài)(唯讀)不提供使用者修改名稱EventName事件處理程序名稱(預(yù)設(shè)與物件名稱相同)建議使用預(yù)設(shè)即可Parent父物件的名稱(預(yù)設(shè)為最上層的Activity)當(dāng)在介面表單中，有加入Panel容器物件時(shí)，則可以讓其他物件選擇。-CommonpropertiesLeft與父物件左邊界的距離(用來調(diào)整物件「水平」位置)Top與父物件上邊界的距離(用來調(diào)整物件「垂直」位置)Width調(diào)整物件的寬度設(shè)定物件的大小Height調(diào)整物件的高度Enabled設(shè)定物件是否可被使用(預(yù)設(shè)為True(可被使用))Visible設(shè)定物件是否可被看見(預(yù)設(shè)為True(可被看見))Tag用來註記物件的額外資訊Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」【各物件的主要與共同屬性】屬性說明-MainName物件名稱11-2標(biāo)籤物件(Label)【定義】是一種用來提示使用者在輸入或輸出資料時(shí)的說明?！灸康摹刻崾臼褂谜呦嚓P(guān)的訊息內(nèi)容?！臼褂脮r(shí)機(jī)】提示訊息或說明。【圖解說明】【注意】「Label標(biāo)籤物件」一般是用來「顯示」的資料給予提示訊息和說明，但不提供使用者「輸入或修改」的動(dòng)作。11-2標(biāo)籤物件(Label)【定義】是一種用來提示使用【實(shí)作】標(biāo)籤物件(Label)的實(shí)作步驟如下所示：【實(shí)作】標(biāo)籤物件(Label)的實(shí)作步驟如下所示：【設(shè)定屬性值】一般在設(shè)定屬性值有兩種方法：第一種：靜態(tài)設(shè)定(利用屬性表來設(shè)定)【說明】表單中的Label1物件其內(nèi)容是要透過「屬性表」的設(shè)定，方法如下：

物件名稱.屬性名稱

=屬性值【設(shè)定屬性值】一般在設(shè)定屬性值有兩種方法：【標(biāo)籤物件(Label)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」TextStyle設(shè)定文字樣式：Typeface(設(shè)定字型)Style(設(shè)定字體樣式：正常、粗體、斜體及粗斜體)HorizontalAlignment(水平排列：靠左、置中及靠右)VerticalAlignment(垂直排列：頂上、置中及底下)Size(設(shè)定字體大小)TextColor(設(shè)定字體顏色)Drawable三種模式(一)ColorDrawable(色彩模式)預(yù)設(shè)模式1.Cornerradius(設(shè)定圓滑角大小)2.Color(設(shè)定背景顏色)3.Alpha(設(shè)定深淺度)(二)GradientDrawable(漸層模式)(三)BitmapDrawable(圖片模式)【標(biāo)籤物件(Label)中常被設(shè)定的屬性】屬性說明Name物第二種：動(dòng)態(tài)設(shè)定(利用撰寫程式方式)步驟一：建立物件Label1第二種：動(dòng)態(tài)設(shè)定(利用撰寫程式方式)步驟二：撰寫程式碼【說明】要利用程式來撰寫時(shí)，必須先要知道，表單中是否已經(jīng)有Label物件，否則指示給不存在的物件，將會(huì)產(chǎn)生錯(cuò)誤。步驟二：撰寫程式碼步驟三：執(zhí)行結(jié)果【注意】要在「執(zhí)行後」才能看得到設(shè)定的結(jié)果。步驟三：執(zhí)行結(jié)果11-3輸入方塊物件(EditText)【定義】是指用來讓使用者輸入「開放式」資料的介面?！灸康摹孔屖褂谜咻斎氤淌剿杼幚淼脑假Y料?！臼褂脮r(shí)機(jī)】輸入或修改文字內(nèi)容?！緢D解說明】11-3輸入方塊物件(EditText)【定義】是指用來【實(shí)作】輸入方塊物件(EditText)的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText1NameedtUserNameEditText1HintText輸入帳號(hào)【實(shí)作】輸入方塊物件(EditText)的實(shí)作步驟如下所示：【輸入方塊物件(EditText)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text使用者輸入的內(nèi)容Password設(shè)定為密碼文字方塊。例如：登入介面的密碼方塊。SingleLine單行文字方塊(預(yù)設(shè)為True)，如果設(shè)為False則為多行文字方塊。例如：討論區(qū)與留言板。InputType設(shè)定使用者允許輸入內(nèi)容的資料型態(tài)。NUMBERS(整數(shù)型態(tài))TEXT(文字型態(tài))PHONE(電話號(hào)碼型態(tài))DECIMALNUMBERS(小整數(shù)型態(tài))HintText提示字(用來提醒使用者，該欄位要輸入的資料類型)HintColor設(shè)定提示字的顏色Wrap當(dāng)SingleLine設(shè)定為False則為多行文字方塊預(yù)設(shè)值True代表會(huì)自動(dòng)換行；False代表不會(huì)自動(dòng)換行【輸入方塊物件(EditText)中常被設(shè)定的屬性】屬性說明11-3.1密碼文字方塊【目的】保護(hù)個(gè)人的隱私及資料安全?！臼褂脮r(shí)機(jī)】保護(hù)隱私時(shí)。例如登入介面的「密碼」?！緢D解說明】11-3.1密碼文字方塊【目的】保護(hù)個(gè)人的隱私及資料安全【實(shí)作】設(shè)定密碼文字方塊的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText2NameedtPasswordEditText2PasswordTrueEditText2HintText輸入密碼【實(shí)作】設(shè)定密碼文字方塊的實(shí)作步驟如下所示：物件名稱屬性屬性11-3.2多行文字方塊【目的】可以完整顯示「文章式」的內(nèi)容。【使用時(shí)機(jī)】資料量較多時(shí)。例如：討論區(qū)與留言板?！緢D解說明】11-3.2多行文字方塊【目的】可以完整顯示「文章式」的【實(shí)作】設(shè)定多行文字方塊的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值EditText3NameedtTalkAreaEditText3SingleLineFalseEditText3HintText輸入留言內(nèi)容EditText3WrapTrue【實(shí)作】設(shè)定多行文字方塊的實(shí)作步驟如下所示：物件名稱屬性屬性11-4命令控制項(xiàng)(Button)【定義】是指用來執(zhí)行Click事件中的「事件程序」之程式。【目的】專門來「處理」使用者輸入的原始資料?！臼褂脮r(shí)機(jī)】命令程式碼【圖解說明】1.使用者按下按「登入」鈕。2.按鈕就會(huì)觸發(fā)「Click事件」。3.自動(dòng)執(zhí)行「事件處理程序」。11-4命令控制項(xiàng)(Button)【定義】是指用來執(zhí)行C圖解說明【說明】當(dāng)使用者按一下「Button命令控制項(xiàng)」時(shí)，馬上就會(huì)觸發(fā)「Click事件」，並且執(zhí)行對(duì)映的「事件處理程序」。圖解說明【說明】11-4.1文字按鈕(TextButton)【目的】是指命令控制項(xiàng)是以「文字標(biāo)題」呈現(xiàn)?！臼褂脮r(shí)機(jī)】一般性的資訊系統(tǒng)的介面設(shè)計(jì)【圖解說明】11-4.1文字按鈕(TextButton)【目的】是【實(shí)作】文字按鈕(TextButton)的實(shí)作步驟如下所示：【設(shè)定屬性值】物件名稱屬性屬性值Buton1NamebtnLoginButon1Text登入【實(shí)作】文字按鈕(TextButton)的實(shí)作步驟如下所示【命令控制項(xiàng)(Button)中常被設(shè)定的屬性】屬性說明Name物件名稱(與變數(shù)名稱相同)建議使用有意義命名方式Text設(shè)定物件呈現(xiàn)的「標(biāo)題名稱」TextStyle設(shè)定文字樣式：1.Typeface(設(shè)定字型)2.Style(設(shè)定字體樣式：正常、粗體、斜體及粗斜體)3.HorizontalAlignment(水平排列：靠左、置中及靠右)4.VerticalAlignment(垂直排列：頂上、置中及底下)5.Size(設(shè)定字體大小)6.TextColor(設(shè)定字體顏色)【兩個(gè)重要的事件】物件名稱事件功能Buton1Click當(dāng)使用者「按一下」Buton鈕觸發(fā)的事件Buton1LongClick當(dāng)使用者「長按一下」Buton鈕觸發(fā)的事件【命令控制項(xiàng)(Button)中常被設(shè)定的屬性】屬性說明Nam【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)使用者「按一下」，出現(xiàn)「短按圖示」只能開啟應(yīng)用程式，而當(dāng)使用者「長按一下」，出現(xiàn)「長按開關(guān)」才能開啟電腦主機(jī)。

【註】「短按」是指「點(diǎn)一下」?！搁L按」是指「停留大約1~2秒」?！緟⒖冀獯稹俊緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)使用者「按一下」，出現(xiàn)「短按圖示」11-4.2圖片按鈕(PictureButton)【目的】是指命令控制項(xiàng)是以「圖片標(biāo)題」呈現(xiàn)?！臼褂脮r(shí)機(jī)】遊戲或多媒體的資訊系統(tǒng)的介面設(shè)計(jì)?！緢D解說明】11-4.2圖片按鈕(PictureButton)【目【命令控制項(xiàng)(Button)之圖片按鈕設(shè)定的屬性】在B4A程式語言中，它的按鈕之背景圖片所支援的格式有：BMP,JPG,GIF及PNG等四種。其相關(guān)屬性的設(shè)定如下表：屬性說明Drawable一、DefaultDrawable(預(yù)設(shè))二、StatelistDrawable(一)EnabledDrawable(正常按鈕)1.ColorDrawable(色彩模式)預(yù)設(shè)模式(1)Cornerradius(設(shè)定圓滑角大小)(2)Color(設(shè)定背景顏色)(3)Alpha(設(shè)定深淺度)2.GradientDrawable(漸層模式)3.BitmapDrawable(圖片模式)(1)Imagefile(圖檔)(二)DisabledDrawable(沒有作用按鈕)(三)PressedDrawable(按下按鈕)【命令控制項(xiàng)(Button)之圖片按鈕設(shè)定的屬性】在B4A程【實(shí)作步驟】請?jiān)O(shè)計(jì)一個(gè)按鈕物件同時(shí)具有「圖片+文字」步驟一：開啟「Designer」設(shè)計(jì)視窗，並在右邊的「ImageFiles」

框框加入圖檔?！緦?shí)作步驟】請?jiān)O(shè)計(jì)一個(gè)按鈕物件同時(shí)具有「圖片+文字」步驟二：選擇欲加入的圖檔。步驟二：選擇欲加入的圖檔。步驟三：在屬性表中的「Drawable」屬性，選擇「StatelistDrawable」屬性值，並再選「EnabledDrawable」屬性下的「BitmapDrawable」屬性值。因此，再到「Imagefile」屬性下，選擇「Login_icon.gif」圖檔。如下圖所示。步驟三：在屬性表中的「Drawable」屬性，選擇「Stat步驟四：執(zhí)行結(jié)果【參考解答】------------SubbtnLogin_ClickIfedtUserName.Text=""ORedtPassword.Text=""ThenMsgbox("您尚未輸入帳號(hào)或密碼哦!","產(chǎn)生錯(cuò)誤...")ElseDimUsernameAsStringDimPasswordAsStringUsername=edtUserName.TextPassword=edtPassword.TextIfUsername="LeechPhd"ANDPassword="123456"ThenMsgbox("您是合法使用者！","系統(tǒng)回覆")ElseMsgbox("您是非法使用者！","系統(tǒng)回覆")EndIfEndIf步驟四：執(zhí)行結(jié)果【參考解答】------11-5對(duì)話訊息方塊【定義】是指用來讓使用者與正在執(zhí)行中程式進(jìn)行互動(dòng)，並作適時(shí)的回覆。【目的】顯示程式執(zhí)行中的狀態(tài)?！臼褂脮r(shí)機(jī)】提醒目前程式執(zhí)行過程的狀態(tài)?！纠纭看_認(rèn)視窗或錯(cuò)誤訊息視窗?！境尸F(xiàn)方式】1.訊息方塊(只提供訊息)2.對(duì)話訊息方塊(除了提供訊息，也提供對(duì)話功能)【圖解說明】11-5對(duì)話訊息方塊【定義】是指用來讓使用者與正在執(zhí)行中程11-5.1訊息方塊(MsgBox)【功能】只顯示訊息，但不傳回值?！靖袷健縈sgbox("訊息內(nèi)容","標(biāo)題")【範(fàn)例】Msgbox("這是我的簡單訊息窗內(nèi)容!!!","公告事項(xiàng)")【程式碼】ch11-5.1.b4a11-5.1訊息方塊(MsgBox)【功能】只顯示訊息，11-5.2對(duì)話訊息方塊(MsgBox2)【功能】可以顯示訊息，也可以傳回值?！靖袷健縈sgbox2("第1個(gè)參數(shù)_訊息內(nèi)容","第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【說明】在以上六個(gè)參數(shù)中，第1~2個(gè)參數(shù)務(wù)必要有資料內(nèi)容。而第3~5個(gè)參數(shù)可以依照使用者的需要加入，如果沒有需要，則填入「""」空字串。但是，第6個(gè)參數(shù)如果沒有需要，則填入「null」空值。11-5.2對(duì)話訊息方塊(MsgBox2)【功能】可以顯示【範(fàn)例1】只有第1~2個(gè)參數(shù)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例1】只有第1~2個(gè)參數(shù)【格式再提示】【範(fàn)例2】只有第1,2及6個(gè)參數(shù)(含有圖片)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題","第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字",

"第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例2】只有第1,2及6個(gè)參數(shù)(含有圖片)【格式再提示】【範(fàn)例3】只有第1~5個(gè)參數(shù)(不含圖片)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題",

"第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【範(fàn)例3】只有第1~5個(gè)參數(shù)(不含圖片)【格式再提示】【範(fàn)例4】6個(gè)參數(shù)(全部)【格式再提示】Msgbox2("第1個(gè)參數(shù)_訊息內(nèi)容",

"第2個(gè)參數(shù)_標(biāo)題",

"第3個(gè)參數(shù)_同意鈕之標(biāo)題文字","第4個(gè)參數(shù)_取消鈕之標(biāo)題文字","第5個(gè)參數(shù)_不同意鈕之標(biāo)題文字","第6個(gè)參數(shù)_圖示之圖檔名稱")【程式碼】ch11-5.2A.b4a【範(fàn)例4】6個(gè)參數(shù)(全部)【格式再提示】【程式碼】ch11-【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)訊息視窗，可以讓使用者點(diǎn)選「同意」、「取消」或「不同意」，並且傳回值?！緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)訊息視窗，可以讓使用者點(diǎn)選「同意」、「取消【參考解答】【參考解答】11-5.3彈跳式訊息方塊(ToastMessageShow)【功能】在短時(shí)間顯示訊息，用來提醒使用者即將發(fā)生的狀況?！靖袷健縏oastMessageShow("訊息內(nèi)容","設(shè)定時(shí)間長短")【說明】設(shè)定時(shí)間長短時(shí)，當(dāng)True代表3秒，而False代表2秒【範(fàn)例】ToastMessageShow("考試時(shí)間即將結(jié)束!!!","True")11-5.3彈跳式訊息方塊(ToastMessageShow11-5.4狀態(tài)列通知【引言】一套功能完整的AndroidApp應(yīng)用程式，除了避免以上三種錯(cuò)誤之外，也必須要將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用者，以便讓使用者了解。【常見的作法】1.利用MsgBox訊息對(duì)話方塊。Msgbox("訊息內(nèi)容","標(biāo)題")

2.彈跳式訊息方塊(ToastMessageShow)ToastMessageShow("訊息內(nèi)容","設(shè)定時(shí)間長短")3.開啟新的Activity活動(dòng)之活動(dòng)頁面。StartActivity("活動(dòng)頁面")4.利用狀態(tài)列通知

本單元介紹！!!11-5.4狀態(tài)列通知【引言】[利用狀態(tài)列通知]【功能】將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用者，以便讓使用者了解?！靖袷健縎etInfo("標(biāo)題","訊息內(nèi)容",Activity活動(dòng)之活動(dòng)頁面)【說明】如果在Main活動(dòng)執(zhí)行並顯示時(shí)，則第三個(gè)參數(shù)設(shè)為Null?！竟?fàn)例】[利用狀態(tài)列通知]【功能】將程式目前的執(zhí)行狀態(tài)適時(shí)的通知使用【注意】圖示檔案要先複製到指定的目錄下，亦即本支程式資料夾中的「Objects／res／drawable／並且每一位圖檔都必需要設(shè)定為「唯讀」?fàn)顟B(tài)。設(shè)定為「唯讀」?fàn)顟B(tài)【注意】圖示檔案要先複製到指定的目錄下，亦即本支程式資料夾中【實(shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)學(xué)生的成績?yōu)椴煌?jí)數(shù)時(shí)，其條件如下：1.80~100為優(yōu)等生。2.60~79為及格。3.60以下為不及格。並且以上三種不同情況，顯示不同的圖示?！緦?shí)例】請?jiān)O(shè)計(jì)一個(gè)程式，當(dāng)學(xué)生的成績?yōu)椴煌?jí)數(shù)時(shí)，其條件如下【參考解答】【參考解答】11-6單選鈕物件(RadioButton)【定義】是指用來讓使用者輸入單一「封閉式」資料的介面。【目的】利用「點(diǎn)選方式」來輸入程式所需處理的原始資料?！緝?yōu)點(diǎn)】確保資料的一致性與正確性?！救秉c(diǎn)】無法讓使用者填入「開放式」資料?！臼褂脮r(shí)機(jī)】當(dāng)程式中需要有多個(gè)選項(xiàng)可供選擇，但只能單選時(shí)，我們可以使用「選項(xiàng)鈕」控制項(xiàng)來設(shè)計(jì)。實(shí)務(wù)上的應(yīng)用方面如下：11-6單選鈕物件(RadioButton)【定義】是指【實(shí)作】單選鈕物件(RadioButton)的實(shí)作步驟如下所示：【常見的屬性設(shè)定】屬性功能Name設(shè)定控制項(xiàng)的名稱Text設(shè)定控制項(xiàng)的內(nèi)容Checked當(dāng)Checked屬性的屬性值為True時(shí)，代表被核取(勾選)，當(dāng)Checked屬性的屬性值為False時(shí)，代表不核取(不勾選)。預(yù)設(shè)值為False?！緦?shí)作】單選鈕物件(RadioButton)的實(shí)作步驟如下所【重要觀念】先了解RadioBu