Axure:實現列表上下拖動的方法

13 評論 10435 瀏覽 29 收藏 3 分鐘

如何用Axure實現列表拖動排序?這篇文章《Axure教程:列表拖動排序的實現方式??》?提出用中繼器可以實現,但是明確指出只能向上拖動。本文有個方法,不僅可以向上拖動,還可以向下拖動。

手動實現效果如下:

步驟如下,大神輕拍。

拖動開始時:

  • 記錄被拖動條目當前的y坐標值;
  • 設置文字便于觀察(下同)。

拖動時:

  • 設置拖動邊界;
  • 將當前拖動的條目置于頂層;
  • 記錄拖動時y坐標值;
  • 計算拖動距離。

拖動結束后:

  • 根據被拖動條目的運動方向以及其他條目與被拖動條目的相對位置進行判斷,確定受影響條目,并計算被影響條目應該移動的距離(相對距離,y軸方向移動距離為一個條目高度)和方向。
  • 修正拖動距離,以條目高度50為例,拖動距離求余,取50余數舍去。計算公式:[[dragy_instance-dragy_instance%50]],dragy_instance為實際拖動距離正負值皆可使用此公式計算。
  • 修正拖動后位置,移動距離[[dragy_instance_modify-dragy_instance]]。

 

本文由 @y13110 原創發布于人人都是產品經理。未經許可,禁止轉載

題圖來自 Unsplash ,基于 CC0 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 動手跟著做!

    來自廣東 回復
  2. 您好,可否麻煩提供一下原型的源文件 謝謝

    回復
  3. 能提供下原型原件命名的東西嗎,有點太抽象了

    來自天津 回復
  4. 你好,可以共享原型出來嗎,只看你這個很難模擬出效果

    來自廣東 回復
    1. 您好,請問您現在會這個效果了嗎,有沒有原型的源文件分享一下呢,謝謝~

      回復
  5. 有點復雜

    來自廣東 回復
    1. 確實,只是想說可以實現,如果有必要的話。

      來自廣東 回復
  6. 我是新手,我想問下你這是編程么。。。。

    回復
    1. 新手加1,這不算編程吧,最復雜的也就是取余了

      來自廣東 回復
    2. 不用編程 比vb都容易理解

      回復
  7. 難得一匹

    回復
    1. 只是為了證明一定程度上能夠實現,就是我用的方法太笨

      來自廣東 回復
    2. 你好,可以共享原型出來嗎,只看你這個很難模擬出效果

      來自廣東 回復