這一篇文集名爲《Axure進階之路》自然少不了Axure的難點之一中繼器。中繼器(repeat)應該算是Axure的三大難點動態面板,函數,中繼器中最難的。網上能搜索不少關於中級器的文章,在下狗尾續貂,希望能爲大家帶來一些新思路。
不想看內容的朋友可以直接跳至文尾下載鏈接,順便幫忙點個贊。
一、中繼器的用法
看教程之前,先認清一個事實:中繼器不難。中繼器不難。中繼器不難。
還有一個事實:中繼器雖然不常用,但是很有用,真的很有用。
中繼器是漢譯之後的稱呼,英文原指repeat,就是重複。可以理解爲連續重複的項。比如:
淘寶商品列表
類似於這樣的列表頁,每一項擁有相同的元素。例如圖中的商品圖片(img),商品名稱(name),商品價格(price)等等。有這樣連續重複的項,中繼器正好有了用武之地。
中繼器還有什麼用?
這是中繼器的數據集:
數據集
這是mysql數據庫表:
mysql數據庫結構
看出來了嗎?中繼器的數據集和mysql數據庫都是數據表結構,字段和記錄。
相信我,哪些告訴你中繼器沒用的要麼自己會不想讓你學,要麼自己根本也不懂。
可以這麼說:動態面板是鍛鍊產品經理在用戶交互設計上的能力,函數是鍛鍊產品經理在業務邏輯和判定實現上的能力,而中繼器是鍛鍊產品經理在數據歸納上的能力。
同意了我的觀點,請繼續往看下文。
二、建表
本次的示例就是一個商城的商品列表頁。程序員在開始項目之前會仔細看產品寫的需求文檔,然後梳理一下業務邏輯,抽象成代碼。其中有一部分就是建庫建表。今天我也帶大家來建建表。
建表其實就是根據頁面元素來填寫每一列的表頭。
拖入一箇中繼器——》雙擊進入——》把小框框刪除掉,改爲下圖樣式。這就是每一項重複的樣式
item
由上可知,該表涉及四個元素:商品圖片(img),商品名稱(name),商品價格(sprice),商品銷量(sell)。記得給每一項元素命名並且最好和數據集的字段相同。
一次命名
也就是四個字段。所以建表如下:
中繼器數據級
小技巧:建表時可以用excel表格建表,然後直接複製進去。以爲axure8.0的中繼器數據集的位置讓人很蛋疼。
三、顯示數據
建表之後,將數據顯示到對應的元素上,需要添加用例,(每項加載時)設置文本於
例如商品價格:
設置商品價格
選擇右下角——富文本——編輯:
選擇右邊“插入變量和函數”——》Item.price。(富文本就是可以添加格式的文本,我在此處加入了¥符號,就是讓其添加數據時在每一個金額前加上¥,這個也可以加在數據庫中或頁面元素上,個人覺得我這樣最簡單)
一次添加好商品名稱和商品銷售數量。
添加圖片和添加文本的方式稍有不同:
需要選擇設置圖片,修改默認爲值,點擊fx,設置其值爲Item.img。
設置圖片
每一列代表顯示界面的一項,可以比較一下顯示界面和數據集:(圖文來自網絡)
顯示界面
作者:艾賓浩斯ace
鏈接:https://www.jianshu.com/p/cc7a227e4c14
來源:簡書
簡書著作權歸作者所有,任何形式的轉載都請聯繫作者獲得授權並註明出處。
——————————————————親測可用——————————————————————————
一。整個過程中,有個Bug,就是firefox圖片加載不出來問題????
*****解決辦法:
一定要在中繼器的數據集裏面添加img url。