Axure怎制作表格升序或降序效果?
我要評論Axure想要制作一個表格內(nèi)容修改排序效果，上下行的交換，該怎么這個交互效果呢？下面我們就來看看詳細的教程。
新建一個“中繼器”，如下圖所示：
“中繼器”設置2列：ID、content；可按所需設置行內(nèi)容； （ID是用來排序的，建議按數(shù)字順序設置），可參考下圖設置：
雙擊進入“中繼器”內(nèi)部，先清除原來內(nèi)容；新建2個“文本標簽”、1個“矩形”、1個“向上箭頭”的圖標、1個“向下箭頭”的圖標；如下圖所示：
設置一個“文本標簽”為Num；
設置一個“文本標簽”為content；
設置"矩形"尺寸：280*60；填充色：#CCCCCC
布局如下圖所示：
到這里，基礎的布局設置結束，以下是交互設置~
首先是“中繼器”的“每項加載時”的交互：
動作：
設置“文本標簽：Num”的值：[[Item.index]]
設置“文本標簽：content”的值：[[Item.content]]
如下圖所示：
”圖標：向上箭頭“的”鼠標單擊時“的交互：
條件：當”值：[[Item.ID]]“大于1時，如下圖所示：
動作1：更新行：設置上一行的ID為本行ID）
更新條件：[[TargetItem.ID==Item.ID-1]]
更新”ID“列內(nèi)容：[[Item.ID]]
如下圖所示：
動作２：更新行：設置本行的ID，數(shù)值減１
更新條件：this（即本身）
更新”ID“列內(nèi)容：[[Item.ID-1]]
如下圖所示：
動作3：排序
針對”屬性：ID“排序；排序類型：Number；順序：升序；如下圖所示：
幾乎相同方式，設置”圖標：向下箭頭“的”鼠標單擊時“的交互：
條件：當”值：[[Item.ID]]“小于”[[Item.Repeater.itemCount]]“時，如下圖所示：
動作1：更新行：設置下一行的ID為本行ID）
更新條件：[[TargetItem.ID==Item.ID+1]]
更新”ID“列內(nèi)容：[[Item.ID]]
如下圖所示：
動作２：更新行：設置本行的ID，數(shù)值加１，
更新條件：this（即本身）
更新”ID“列內(nèi)容：[[Item.ID+1]]
如下圖所示：
動作3：排序
針對”屬性：ID“排序；排序類型：Number；順序：升序；如下圖所示：
設置內(nèi)容還是比較少的，有些撓腦筋，需要仔細些即可，設置完畢后，就可以驗證效果如何~
以上就是axure制作表格內(nèi)容升降序列的教程，希望大家喜歡，請繼續(xù)關注腳本之家。
相關推薦：
相關文章
axure怎么設計一個倒計時效果的模型？axure中設計網(wǎng)頁圓形很簡單，今天我們就來看看使用axure設置一個倒計時效果的教程，需要的朋友可以參考下2017-09-28
axure網(wǎng)頁原型怎么預覽和生成原型文件？axure中設計好的文件原型想要預覽并生成，該怎么預覽呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-09-25
axure原型無法簽出怎么辦? axure不能簽出的解決辦法
axure原型無法簽出怎么辦、？axure中設計網(wǎng)頁原型很方便，設計完成以后發(fā)現(xiàn)無法簽出，該怎么辦呢？下面我們就來看看axure不能簽出的解決辦法，需要的朋友可以參考下2017-09-24
Axure怎么新建元件庫？想要把常用的組件制作一個元件，放到自己的元件庫中，該怎么操作呢？下面我們就來看看Axure元件庫的使用方法，需要的朋友可以參考下2017-09-13
axure中的單元格怎么合并？axure制作的網(wǎng)頁原型中插入了表格，想要將表格中的單元格合并呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-09-08
axure8怎么給網(wǎng)頁制作Tabpage頁效果?
axure8怎么給網(wǎng)頁制作Tabpage頁效果？axure8中想要給網(wǎng)頁設計一個tab標簽效果，該怎么設計呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-08-29
Axure RP8怎么設計倒計時獲取短信驗證碼效果？經(jīng)常能見到帶有短信驗證的網(wǎng)頁，該怎么設計出這個交互效果呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-08-25
Axure RP怎么給網(wǎng)頁添加滾動字幕？看到很多網(wǎng)頁有滾動字幕，想要在Axure RP中制作滾動字幕效果，該怎么制作呢？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-08-15
Axure RP怎么設計一款導航菜單？Axure RP中設計網(wǎng)頁的時候需要設計一款導航菜單，該怎么設計恩？下面我們就來看看詳細的教程，需要的朋友可以參考下2017-08-11
axure怎么給下拉框/列表框和元件文本添加內(nèi)容?
axure怎么給下拉框/列表框和元件文本添加內(nèi)容？axure中有很多元件，今天我們就來看看給下拉框/列表框和元件文本添加內(nèi)容的方法，需要的朋友可以參考下2017-07-25
