Axure頁面怎么制作下拉刷新效果? Axure下拉刷新實現(xiàn)方法

作為一名產(chǎn)品經(jīng)理,在我們設(shè)計包含大量數(shù)據(jù)或者數(shù)據(jù)實時更新的頁面時,往往要在Axure原型上做出下拉刷新的效果,今天我們就來看看使用Axure實現(xiàn)下拉刷新效果的過程,圖文詳細,稍微有點長,請耐心觀看哦。
1、在元件庫中拖一個動態(tài)面板至頁面并將大小調(diào)整至于手機外殼大小合適,如下圖;
2、雙擊動態(tài)面板區(qū)域后對面板進行命名“數(shù)據(jù)面板”如下圖,本步驟不可省略,因為后面會再次用到幾個動態(tài)面板,為了容易進行區(qū)分,所以此步驟不要省略;
3、雙擊數(shù)據(jù)面板的“State1”如下圖1,然后進入數(shù)據(jù)面板內(nèi)部,如圖2;
4、在“數(shù)據(jù)面板”這個動態(tài)面板內(nèi)部再依次拖入兩個動態(tài)面板(將這兩個面板做成大小統(tǒng)一的面板),并分別進行命名:
(1)原始面板,在最底層,此面板為頁面上未刷新時的展示,位置(0,0);
(2)刷新面板,在最頂層,此面板為頁面上下拉刷新時的展示,位置(0,-55);
原始面板與刷新面板之所以在Y軸有一個差距,是因為刷新面板要靠上一些,這樣下拉才會出效果。
5、在原始面板版和刷新面板里填充相同內(nèi)容,如下圖1,此步驟是為了可以在發(fā)布后可以看出頁面效果;
6、將刷新面板設(shè)置為隱藏,方法為:單機選中刷新面板,右擊后選擇“設(shè)為隱藏”,如下圖,此步驟是因為我們在頁面展示時只可展示一個動態(tài)面板的內(nèi)容;
7、雙擊刷新面板,通過點擊“加號”創(chuàng)建三個狀態(tài),名稱分別為:下拉刷新、釋放、刷新中,如下圖
8、選中“數(shù)據(jù)面板”,對它做“拖動時”效果設(shè)置,如下圖:
9、對數(shù)據(jù)面板中的原始面板進行“移動設(shè)置”如下圖,這里的設(shè)置是為了下拉時頁面最多可以下拉到什么位置;
相關(guān)文章
Axure怎么設(shè)置變量值? Axure動作變量值的設(shè)置教程
Axure怎么設(shè)置變量值?Axure添加動作的時候,需要設(shè)置變量值,該怎么設(shè)置呢?這是基礎(chǔ)教程,下面我們就來看看Axure動作變量值的設(shè)置教程,需要的朋友可以參考下2020-12-01Axure RP怎么重置視圖? Axure恢復(fù)默認視圖的技巧
Axure RP怎么重置視圖?Axure RP視圖根據(jù)自己的使用習(xí)慣更改了一下,但是發(fā)現(xiàn)很亂,想要恢復(fù)默認設(shè)置,該怎么操作呢?下面我們就來看看Axure恢復(fù)默認視圖的技巧,需要的朋2020-11-13Axure怎么制作拖動滑塊效果? Axure滑塊動畫的制作方法
Axure怎么制作拖動滑塊效果?手機上有很多可以拖動滑塊的效果,如不音量上下滑動,亮度是左右滑動,該怎么制作這個效果呢?下面我們就來看看Axure滑塊動畫的制作方法,需要2020-11-06Axure外部組件庫怎么導(dǎo)入? Axure添加外部組件庫的技巧
Axure外部組件庫怎么導(dǎo)入?Axure中想要添加外部組件庫,該怎么添加呢?下面我們就來看看Axure添加外部組件庫的技巧,需要的朋友可以參考下2020-11-06Axure怎么設(shè)置重復(fù)的背景圖片? Axure背景設(shè)置為重復(fù)圖片的技巧
Axure怎么設(shè)置重復(fù)的背景圖片?Axure中背景填充為圖片的時候,默認是不重復(fù)的,想要設(shè)置為重復(fù)背景圖,該怎么設(shè)置呢?下面我們就來看看Axure背景設(shè)置為重復(fù)圖片的技巧,需2020-09-30Axure RP便簽控件怎么用? Axure添加便簽控件的技巧
Axure RP便簽控件怎么用?Axure RP在制作網(wǎng)頁原型的時候,想要給頁面添加便簽控件,該怎么添加呢?下面我們就來看看Axure添加便簽控件的技巧,需要的朋友可以參考下2020-09-22- Axure怎么創(chuàng)建頁面常見的Tab頁效果?Axure中經(jīng)常制作頁面,想要制作Tab頁效果,該怎么制作呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2020-04-06
- axure怎么制作餅圖效果?axure中想要制作一個餅形圖,該怎么制作餅形圖呢?下面我們就來看看axure餅圖制作方法,需要的朋友可以參考下2020-02-07
- Axure怎么制作帶有提示文字的文本框?Axure制作頁面的時候,想要實現(xiàn)輸入文本框內(nèi)的提示文字,該怎么操作呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2020-02-04
- axure怎么插入視頻?axure在制作網(wǎng)頁原型的時候,想要給頁面添加視頻,該怎么插入視頻呢?下面我們就來看看axure頁面添加視頻的教程,需要的朋友可以參考下2020-02-03