欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Axure怎么設(shè)計網(wǎng)頁中拖拽控件上下排序的模塊?

百度經(jīng)驗   發(fā)布時間：2019-01-03 16:14:09   作者：goodbyte01   我要評論
Axure怎么設(shè)計網(wǎng)頁中拖拽控件上下排序的模塊？網(wǎng)頁中我們經(jīng)常能見到通過拖拽控件進行上下排版的效果，該怎么制作呢？下面我們就來看看詳細的教程，需要的朋友可以參考下

Axure設(shè)計網(wǎng)頁圓形的時候，想要實現(xiàn)控件拖拽的上下排序，我們可以通過中繼器實現(xiàn)，局限性在于僅能往上拖拽排序，往下無法排序，下面我們就來看看詳細的教程。

看似一個復(fù)雜的效果，實現(xiàn)起來發(fā)現(xiàn)也挺簡單的，經(jīng)過測試，發(fā)現(xiàn)只要設(shè)置一個“組件”的交互，其他“組件”的代碼完全相同，哈哈，僅僅只要復(fù)制、粘貼即可~

主要的應(yīng)用方式，就是鼠標拖拽”控件“移動（可參考早期鏈接），并判斷”控件“所在位置~

新建一矩形，置于底層，命名為“ background”，尺寸450*450（大小隨意），隱藏，并鎖定位置（105,20）

另新建一矩形，設(shè)置矩形內(nèi)容為“組件1”，填充色#CCCCCC，尺寸大小為240*75；并轉(zhuǎn)為”動態(tài)面板“；此動態(tài)面板，命名為”Module1“，設(shè)置尺寸為240*80；

此動態(tài)面板，命名為”Module1“，設(shè)置尺寸為240*80；

可以另復(fù)制3份”動態(tài)面：Module1“，分別命名為”Module2“、”Module3“、”Module4“，并修改其內(nèi)容為“組件2”、“組件3”、“組件4”及填充色；“Module1“、”Module2“、”Module3“、”Module4“，垂直排列，組件上下之間無間隙~（間隙預(yù)留在了動態(tài)面板state1中），參考如下：

也可以在設(shè)置好”動態(tài)面：Module1“的交互動作后，再復(fù)制，并做想相應(yīng)的修改；”動態(tài)面板：組件“的交互大致相同，所以這里僅作”動態(tài)面板：組件1“的交互說明，其他不再贅述~

”動態(tài)面板：組件1“的”拖動開始時“的Case1用例：

1.隱藏”動態(tài)面板：組件1“；拉動元件：下方；動畫：線性；時間：100毫秒

2.顯示”動態(tài)面板：組件1“；置于頂層

（隱藏”動態(tài)面板：組件1“時的拉動元件，可以不設(shè)置動畫，設(shè)置動畫及時間是為了有個“移動”的感覺，副作用就是相應(yīng)的操作不能過快）

”動態(tài)面板：組件1“的”拖動時“的Case1用例：垂直拖動“動態(tài)面板：組件1“；移動：垂直拖動；設(shè)置界限

設(shè)置“元件：background”為局部變量LVAR1；所以，界限的頂部大于等于[[LVAR1.top]]，底部小于[[LVAR1.bottom]]；

相關(guān)文章

  • Axure怎么查看頁面的代碼? Axure查看頁面源代碼的兩種方法

    Axure怎么查看頁面的代碼？Axure中制作的網(wǎng)頁原型想要看看代碼，該怎么查看代碼呢？下面我們就來看看Axure查看頁面源代碼的兩種方法，需要的朋友可以參考下
    2018-04-11

  • Axure全局輔助線和頁面輔助線有什么區(qū)別?

    Axure全局輔助線和頁面輔助線有什么區(qū)別？Axure中的輔助線有全局輔助線、頁面輔助線、對齊輔助線、顯示自適應(yīng)視圖輔助線，那么全局輔助線和頁面輔助線有什么區(qū)別呢？下面我
    2018-04-09

  • Axure動態(tài)面板兩種創(chuàng)建方法有什么區(qū)別?

    Axure動態(tài)面板兩種創(chuàng)建方法有什么區(qū)別？Axure中經(jīng)常使用東臺面板，動態(tài)面板有兩種創(chuàng)建方法，這兩種創(chuàng)建方法有什么區(qū)別呢？下面我們就來看看詳細的教程
    2018-04-08

  • axure怎么設(shè)計密碼輸入框的原型?

    axure怎么設(shè)計密碼輸入框的原型？axure中想要制作一個可以輸入密碼的輸入框效果，該怎么制作呢？下面我們就來看看詳細的教程，需要的朋友可以參考下
    2018-04-07

  • Axure有怎么使用格式刷? Axure格式刷的使用方法

    Axure有怎么使用格式刷？Axure中使用格式刷可以更快捷的實現(xiàn)一些功能，省去了做重復(fù)工作的機會，今天我們就來看看Axure格式刷的使用方法，需要的朋友可以參考下
    2018-04-03

  • Axure怎么使用熱區(qū)? axure熱區(qū)的使用方法

    Axure怎么使用熱區(qū)？Axure設(shè)計原型的時候，熱區(qū)不是很常用，但是我們也需要了解一下，下面我們就來看看axure熱區(qū)的使用方法，需要的朋友可以參考下
    2018-04-02

  • Axure8.0母版怎么應(yīng)用在頁面上? Axure母版的使用方法

    Axure8.0母版怎么應(yīng)用在頁面上？Axure中設(shè)計頁面的時候，想要直接手要你管母版，該怎么使用呢？下面我們就來看看Axure母版的使用方法，需要的朋友可以參考下
    2018-03-29

  • axure怎么使用Icons圖標組件設(shè)計UI?

    axure怎么使用Icons圖標組件設(shè)計UI？axure中自帶了很多圖標組件，該怎么直接調(diào)用這些組件圖標設(shè)計ui呢？下面我們就來看看詳細的教程，需要的朋友可以參考下
    2018-03-27

  • axure怎么設(shè)計手機屏幕的滾動條原型?

    axure怎么設(shè)計手機屏幕的滾動條原型？手機中經(jīng)常能見到滾動條，該怎么制作滾動條效果呢？下面我們就來看看axure滾動條的制作方法，需要的朋友可以參考下
    2018-03-27

  • axure怎么設(shè)計手機app的側(cè)邊欄原型?

    axure怎么設(shè)計手機app的側(cè)邊欄原型？axure中想要設(shè)計原型很簡單，手機app的側(cè)邊欄我們經(jīng)常見，想要設(shè)計這個原型，該怎么設(shè)計呢？下面我們就來看看詳細的教程，需要的朋友可
    2018-03-27

最新評論