axure商城

【Axure 教程】中繼器入門教程-數據排序

入門教程會分為 6 個小節,本節主要講解如何實現中繼器的數據排序

原型展示:https://5ejk3o.axshare.com

所需原件:

  1. 中繼器
  2. 小三角

本文主要講解中繼器的基本用法,以便大家更容易去理解和學習中繼器的高級用法,入門教程會分為 6 個小節,本節主要講解如何實現中繼器的數據排序


一、列表制作

這里我們直接引用課程 【Axure 教程】中繼器入門教程-列表制作 中制作的列表,快速修改表頭和中繼器數據后,得到一個列表,如上圖;

二、狀態設置

拖入兩個小三角,拼成一個排序 icon,組合后創建動態面板,并設置三個狀態:默認、升序、降序,如上圖所示;

選中表頭的【年齡】文本標簽,創建交互,在點擊時,設置排序 icon 的面板狀態,并添加中繼器的排序,如上圖所示;

注意在不同的狀態下,對應的排序規則,并在【降序】切換到【默認】狀態時,移除所有排序;

同理,生日的排序,大家可以自己嘗試一下 : )


四、細節優化

我們希望在年齡和生日兩個排序切換時,重置對方的排序狀態,因此為每個交互添加將對方面板狀態置為【默認】狀態的交互動作,如上圖所示;


更多內容,微信搜索“愛學兒”,一起交流探討吧!

給TA買糖
共{{data.count}}人
人已贊賞
基礎教程

【實用案例教程】如何用axure中繼器制作圖片水印和文字水印

2021-5-25 12:40:14

基礎教程

【Axure 教程】中繼器入門教程-列表查詢

2021-5-27 12:58:42

axure商城
2 條回復 A文章作者 M管理員
  1. 兔子大仙??

    您好,想問下,點擊一個按鈕對中繼器里一列數據排序,在axure8上沒問題,axure9上就是不成功是什么原因?

    • SamDesigner

      我猜,你應該是用了 Axure 9 的漢化包了,只有移除漢化包才能恢復正常喔,另外,如果想繼續用漢化包,那就試試【發布到 Axure 云】,一樣可以看到排序效果的。

?
個人中心
購物車
優惠劵
今日簽到
有新私信 私信列表
搜索
俄罗斯videoxxxoo