原型設(shè)計(jì)工具Axure RP入門教程(十):條款和條件教程
Axure RP是一套專門為網(wǎng)站或應(yīng)用程序所設(shè)計(jì)的快速原型設(shè)計(jì)工具, 可以讓應(yīng)用網(wǎng)站策劃人員或網(wǎng)站功能界面設(shè)計(jì)師更加快速方便的建立Web AP和Website的線框圖、流程圖、原型和規(guī)格。
免費(fèi)下載Axure RP 優(yōu)惠購(gòu)買Axure RP
在本教程中,您將學(xué)習(xí)如何創(chuàng)建一個(gè)表單,該表單要求用戶選中一個(gè)復(fù)選框并輸入其名稱,然后再繼續(xù)。
小部件和頁(yè)面設(shè)置
第1頁(yè)–條款和條件表格
- 打開一個(gè)新的RP文件,然后在畫布上打開Page 1。
- 將復(fù)選框小部件,標(biāo)簽小部件,文本字段小部件和按鈕小部件拖到畫布上。
- 將復(fù)選框上的文本設(shè)置為我同意條款和條件。
- 將標(biāo)簽小部件上的文本設(shè)置為請(qǐng)?jiān)诖颂幒灻缓髮⑵浞旁谖谋咀侄紊戏健?/span>
- 將按鈕上的文本設(shè)置為下一頁(yè)。
- 在項(xiàng)目中添加一個(gè)新頁(yè)面,并在畫布上打開它。
- 將標(biāo)題小部件拖到畫布上,并將其文本設(shè)置為Success。
取消選中復(fù)選框時(shí)禁用文本字段
使文本字段默認(rèn)為禁用
- 打開第1頁(yè),然后選擇文本字段小部件。
- 在交互窗格的右上角,單擊更多選項(xiàng)下拉列表,然后選中禁用框。
- 這將觸發(fā)文本字段的默認(rèn):disabled樣式效果,將其變?yōu)榛疑?。它還將阻止用戶與Web瀏覽器中的文本字段進(jìn)行交互。
- 選擇復(fù)選框窗口小部件,然后在交互窗格中單擊新建交互。
- 在出現(xiàn)的列表中選擇Selected事件,然后選擇Enable / Disable操作。
- 在目標(biāo)下拉列表中選擇文本字段小部件,然后在其下方保留啟用處于選中狀態(tài)。
- 單擊確定以保存操作。
取消選中復(fù)選框時(shí),再次禁用文本字段
- 在復(fù)選框小部件仍處于選中狀態(tài)的情況下,再次在交互窗格中單擊新建交互。
- 在出現(xiàn)的列表中選擇未選定事件,然后選擇啟用/禁用操作。
- 在目標(biāo)下拉列表中選擇文本字段小部件,然后在其下方選擇禁用。
- 單擊確定以保存操作。
取消選中復(fù)選框時(shí)清除文本字段的文本
- 在復(fù)選框小部件仍處于選中狀態(tài)的情況下,單擊未選中塊底部的插入動(dòng)作圖標(biāo),然后在出現(xiàn)的列表中選擇設(shè)置文本動(dòng)作。
- 在目標(biāo)下拉列表中選擇文本字段小部件。
- 將值字段留為空白.(這將清除文本字段的文本。)
- 單擊確定以保存操作。
使按鈕默認(rèn)為禁用
- 選擇按鈕小部件。
- 在交互窗格的右上角,單擊更多選項(xiàng)下拉列表,然后選中禁用框。
使按鈕具有禁用的樣式效果
- 在仍選擇按鈕小部件的情況下,在交互窗格中單擊新建交互。
- 在出現(xiàn)的列表的底部,選擇:disabled樣式效果。
- 在出現(xiàn)的:disabled塊中,檢查填充顏色屬性,然后在顏色選擇器中選擇一種灰色。
- 單擊確定保存樣式效果。
- 選擇文本字段窗口小部件,然后在交互窗格中單擊新建交互。
- 在出現(xiàn)的列表中選擇文本更改事件,然后選擇啟用/禁用”操作。
- 在目標(biāo)下拉列表中選擇下一頁(yè)按鈕,并在其下方保留啟用處于選中狀態(tài)。
- 單擊確定以保存操作。
- 在仍然選擇文本字段的情況下,將鼠標(biāo)懸停在交互窗格中的文本已更改標(biāo)題上,然后單擊右側(cè)的啟用案例。
- 在出現(xiàn)的條件構(gòu)建器對(duì)話框中,單擊添加邏輯。
- 在出現(xiàn)的條件行中,中間的下拉列表中選擇不等于。
- 對(duì)話框底部的摘要應(yīng)顯示為:If text on This does not equal ""。只要文本字段不是空白(一旦用戶在其中輸入文本),就將滿足此條件。
- 單擊確定關(guān)閉條件生成器對(duì)話框。
- 在仍然選擇文本字段小部件的情況下,將鼠標(biāo)懸停在交互窗格中的文本已更改標(biāo)題上,然后單擊右側(cè)的添加大小寫。
- 在出現(xiàn)的條件構(gòu)建器對(duì)話框中,單擊確定而不添加任何邏輯。
- 單擊新案例標(biāo)題下方的插入操作圖標(biāo),然后在出現(xiàn)的列表中選擇啟用/禁用操作。
- 在目標(biāo)下拉菜單中選擇下一頁(yè)按鈕,然后在其下方選擇禁用。
- 單擊確定以保存操作。
將下一頁(yè)按鈕鏈接到頁(yè)面2
- 選擇下一頁(yè)按鈕,然后在交互窗格中單擊Click或Tap →Open Link 。
- 在出現(xiàn)的列表中選擇第2頁(yè),然后單擊確定以保存操作。
預(yù)覽互動(dòng)
- 預(yù)覽第1頁(yè),然后嘗試單擊文本字段和下一頁(yè)按鈕。兩者都被禁用,因此什么也不會(huì)發(fā)生。
- 選中并取消選中復(fù)選框幾次。文本字段應(yīng)交替啟用和禁用。
- 在文本字段中輸入一些文本,然后通過(guò)手動(dòng)刪除文本或取消選中復(fù)選框再次將其清除。下一頁(yè)按鈕應(yīng)啟用,然后再次禁用。
- 填寫表格,然后單擊下一頁(yè)按鈕。您應(yīng)該轉(zhuǎn)到第2頁(yè)。
關(guān)注慧聚IT微信公眾號(hào)???,了解產(chǎn)品的最新動(dòng)態(tài)及最新資訊。