axure form列表 AxureRP教程

2021-10-13 14:00:29 字數 1208 閱讀 8614

前面介紹了使用axurerp進行簡單的表單設計,主要涉及到元件元素的排版布局和使用,相對基礎一些,複雜的表單設計則是在簡單的表單設計基礎上加入了互動設計和邏輯控制,使原型顯得更加生動,更加人性化。互動設計是加上了一些自動判斷的控制,如校驗字段內容是否為空,填寫是否符合規範,以及一些友好的操作提示等;邏輯控制則一般是控制頁面的邏輯跳轉,或者互動的規則,使之互動按一定的模式呈現給使用者,如tab標籤切換,表單元素間的聯動效果等,加入了互動之後,原型就變得生動起來,而不是呆板的乙個頁面,用帶互動效果的原型去做演示,比拿著一堆文件或者去解說的效果要好的多,因此掌握一些複雜表單設計的方法還是有必要的。

還是以註冊資訊頁面和工作流表單來分別舉例,介面布局都一樣,只是增加了互動設計效果,註冊資訊頁面如下所示:

可以發現與之前簡單的表單設計頁面相比,這個加入了更多的功能,當然初始介面看上去還是一樣的,只不過帶了互動功能,這裡包含所有字段是否為空的驗證,密碼強度的驗證及確認密碼的驗證,郵箱的輸入提示及郵箱輸入是否合法的驗證,驗證碼的填寫驗證,協議的檢視控制,完成按鈕的提交控制等等,這裡不一一說明了,大家可以看原始檔,主要介紹一下密碼框的填寫互動設計。首先在使用者把游標定位在密碼輸入框之後,要提示使用者輸入什麼樣格式的密碼是正確的,因此需要使用axurerp的onfocus事件來控制滑鼠焦點行為,告訴使用者填寫6-16位字元,其次就是使用者在填寫的時候要驗證當前輸入的密碼強度是否足夠,因此需要使用axurerp的onkeyup事件來控制鍵盤釋放行為,每輸入完畢乙個字元都判斷一下當前已經輸入的字元處於哪個強度水平,這裡顯示強度的是用乙個動態面板製作的,每當輸入字元到達某個臨界點,就會根據條件切換,再就是密碼輸入完成後要判斷當前密碼是否符合規範,這裡只判斷長短,利用axurerp的onlostfocus事件來控制失去焦點的行為,判斷密碼是否超長等等,這些控制都是十分有必要的,大家可以思考一下為什麼要做這些控制。

介面差不太多,主要是增加了運維型別和執行型別兩個欄位的聯動效果,當運維型別的下拉選擇變了之後,執行型別的下拉選擇項也會跟著變動,其次是當執行型別變動了之後,下面表單的顯示內容也會跟著變動,也即可以實現不同的表單介面效果。這些邏輯控制都是利用axurerp的相應事件來實現的,顯示切換則都是通過動態面板元件來實現的,如果大家有看過之前的文章,應該都會比較的了解。

複雜表單設計基本上就是這些內容,可能還有其他的一些表單上元素的互動效果,不能一一涉及,用到的時候能想到是最重要的,熟能生巧,多多使用axurerp來設計原型,就能逐漸掌握axurerp的主要功能的使用方法了。

示例在axurerp 6.0.0.2899下除錯通過

列表基礎 列表訪問,列表遍歷

定義乙個列表 infos hello world python 正向索引01 2列表資料 hello world python 反向索引 3 2 1正向訪問列表 定義乙個列表 infos hello world python print infos 0 print infos 1 print inf...

列表list 列表巢狀 列表推導式

1 列表list l1 a b c d 列表下標 補償與字串相同。2 列表方法 函式 in not in len 方法 列表1 列表2 拼接 列表1 數字 重複列表內容 reverse 方法 反序 sort 方法 排序 max 函式 選取最大值 min 函式 選取最小值 3 增刪改查方法 增a.in...

線性列表 雙向列表

雙向鍊錶 在單鏈表中,每個節點所含的鏈域指向後繼節點,故從任一節點後繼很方便,但要找到 前驅及節點比較困難。public class dnode public dnode string name public dnode string name,dnode next,dnode prev packa...