場景:
這幾天在前端,要用Axure畫原型做前端交互方案給客戶看,於是學了一些axure的基礎操作(主要從師妹那學的,哈哈哈),這里記錄一下中繼器做表格和下拉框的實現。
實現:
一、中繼器實現表格
- 在元件庫中使用中繼器,中繼器就相當於表格,但是功能比表格強大
在元件的樣式中添加數據的列(列名只能是英文),同時可以添加數據的行,注意這里只是數據的信息
雙擊進入中繼器,,可以看到一個默認的矩陣,添加新的矩陣(也可以是其他元件),這里的矩陣就是中繼器樣式的一列。添加的同時給矩陣命名,比如:列2
退出中繼器,可以看到中繼器的樣式以及多了幾列,而中繼器的行數是數據的行數。
接下來,綁定中繼器數據和樣式。在中繼器的交互中,點擊交互事件每項加載時->設置文本,添加設置文本,選擇之前添加的樣式列(比如這里選擇列3),在文本的value選擇中,選擇右邊的fx,
清除編輯文本中的值,選擇“插入變量或函數”
選擇要綁定的數據列,就是中繼器樣式中的列:
綁定結束,回到頁面就可以看到數據和樣式已經綁定。再加個列表頭,表格就完成了。
二、中繼器實現下拉菜單
- 先拉一個中繼器和內聯框架,內聯框架可以用來顯示頁面
中繼器里面,用一個矩陣表示一級菜單,一個動態面板表示二級菜單,動態面板默認隱藏。動態面板有兩個狀態,一個是二級菜單,一個是空的,點擊一級菜單才出現。交互內容如下,需要用到條件。
二級菜單動態面板的交互,其實就是點擊時在內聯框架中打開鏈接。
回到頁面,最后綁定中繼器的樣式和數據,其中數據要右擊單元格選擇“引用頁面”。如下:
最后,我把這個小demo發布出來了,演示地址:https://9w425p.axshare.com
- 如果有人需要,就留言給我吧。