Axure設計網頁圓形的時候,想要實現控件拖拽的上下排序,我們可以通過中繼器實現,局限性在于僅能往上拖拽排序,往下無法排序,下面我們就來看看詳細的教程。
看似一個復雜的效果,實現起來發現也挺簡單的,經過測試,發現只要設置一個“組件”的交互,其他“組件”的代碼完全相同,哈哈,僅僅只要復制、粘貼即可~
主要的應用方式,就是鼠標拖拽”控件“移動(可參考早期鏈接),并判斷”控件“所在位置~
新建一矩形,置于底層,命名為“ background”,尺寸450*450(大小隨意),隱藏,并鎖定位置(105,20)
另新建一矩形,設置矩形內容為“組件1”,填充色#CCCCCC,尺寸大小為240*75;并轉為”動態面板“;此動態面板,命名為”Module1“,設置尺寸為240*80;
此動態面板,命名為”Module1“,設置尺寸為240*80;
可以另復制3份”動態面:Module1“,分別命名為”Module2“、”Module3“、”Module4“,并修改其內容為“組件2”、“組件3”、“組件4”及填充色;“Module1“、”Module2“、”Module3“、”Module4“,垂直排列,組件上下之間無間隙~(間隙預留在了動態面板state1中),參考如下:
也可以在設置好”動態面:Module1“的交互動作后,再復制,并做想相應的修改;”動態面板:組件“的交互大致相同,所以這里僅作”動態面板:組件1“的交互說明,其他不再贅述~
”動態面板:組件1“的”拖動開始時“的Case1用例:
1.隱藏”動態面板:組件1“;拉動元件:下方;動畫:線性;時間:100毫秒
2.顯示”動態面板:組件1“;置于頂層
(隱藏”動態面板:組件1“時的拉動元件,可以不設置動畫,設置動畫及時間是為了有個“移動”的感覺,副作用就是相應的操作不能過快)
新聞熱點
疑難解答