《Axure8.0原型案例：制作手機(jī)撥號界面.doc》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在學(xué)術(shù)論文-天天文庫。

1、Axure8.0原型案例：制作手機(jī)撥號界面　　今早上在去公司的班車上打開手機(jī)撥號界面，突然想怎么能用Axure把它做出來，到了公司花了半小時(shí)就做出來，然后把制作過程分享給大家?！　　　⌒Ч枋觥　∈謾C(jī)撥號，想必大家都知道，就是點(diǎn)擊數(shù)字時(shí)有按下反饋，且會組成一串手機(jī)號碼，同時(shí)按錯(cuò)數(shù)字，會有撤退按鈕刪除剛輸入的數(shù)字，效果鏈接：http://flpa2p.axshare.com　　一、首先畫頁面原型　　主要元件為無邊框文本框“顯示”（設(shè)置輸入文字為居中），數(shù)字按鍵“1”、“2”….（設(shè)置白色圓形背景），撤銷按鈕“撤銷”?！　　　《?、添加交互事件　　1、為數(shù)字按鍵添

2、加鼠標(biāo)按下狀態(tài)全部選中數(shù)字按鍵，在右側(cè)統(tǒng)一設(shè)置交互樣式為“鼠標(biāo)按下時(shí)，填充顏色為綠色、字體顏色為白色”，即鼠標(biāo)點(diǎn)擊時(shí)顯示綠色背景+白色文字，松開恢復(fù)默認(rèn)狀態(tài)?！　　　?、為數(shù)字按鍵添加“鼠標(biāo)單擊該數(shù)字按鍵時(shí)，在顯示框依次顯示單擊的數(shù)字”，即執(zhí)行“單擊數(shù)字按鍵設(shè)置顯示框文本為…”命令。選中數(shù)字按鍵“1”，設(shè)置鼠標(biāo)單擊時(shí)，設(shè)置文本-選擇“顯示”文本框；點(diǎn)擊fx，設(shè)置文本框顯示文本，因?yàn)槲谋究蚶锏闹凳亲兓模覀冊O(shè)置局部變量LAVR1=元件文字=“顯示”，然后設(shè)置fx=[[LVAR1]]1，即上一個(gè)變量值后面再顯示剛剛單擊的數(shù)字1，注意不是[[LVAR1]]+1，

3、那就變成加法了；為其他數(shù)字按鍵也添加這個(gè)命令，設(shè)置fx=[[LVAR1]]2、[[LVAR1]]3…，這樣就完成了“鼠標(biāo)單擊數(shù)字按鍵時(shí)，在文本框依次顯示單擊的數(shù)字”?！　　　?、設(shè)置點(diǎn)擊“撤銷”按鈕，文本框“顯示”會相應(yīng)刪除一個(gè)數(shù)字。也是執(zhí)行“單擊撤銷按鍵設(shè)置顯示框文本為…”命令。選中“撤銷”按鈕，設(shè)置鼠標(biāo)單擊時(shí)，設(shè)置文本-選擇“顯示”文本框。點(diǎn)擊fx，設(shè)置文本框顯示文本，設(shè)置局部變量LAVR1=元件文字=“顯示”，設(shè)置fx=[[LVAR1]]？？，該怎么設(shè)置呢？這時(shí)我們用到一個(gè)函數(shù)“substring(from，to)”，即從截取變量的第from位到to位

4、字符串，舉例LVAR=123456，那截取第1位到第4位字符串LVAR.substring(1，4)=234（從第1位，不包括第1位的數(shù)字，到第4位包括第4位的數(shù)字，所以為234，而不是1234）。點(diǎn)擊”撤銷”按鍵，文本框應(yīng)該截取0位到倒數(shù)第2位的字符串，那倒數(shù)第2位該怎么表示，這時(shí)又用到一個(gè)函數(shù)LVAR.length，即變量值字符串長度，這里可以理解為字符串?dāng)?shù)字個(gè)數(shù)，那倒數(shù)第2位就表示為LVAR.length-1。所以fx=[[LVAR1.substring(0,LVAR1.length-1)]]，設(shè)置好并確認(rèn)，就達(dá)到了“點(diǎn)擊撤銷按鈕，文本框會相應(yīng)刪除一個(gè)

5、數(shù)字”的效果?！　　　“聪隆癋5”生成Html預(yù)覽一下吧！　　今天主要通過局部變量和兩個(gè)函數(shù)LVAR.substring(from，to)、LVAR.length來做手機(jī)撥號，希望大家能通過練習(xí)掌握，有什么問題大家可以一起交流學(xué)習(xí)呀。