如何让页面停止加载_Axure 案例:数值加载效果
今天要說到的數值加載效果,我們在使用App和網站的時候是經常見到的,尤其是金融類的產品、借貸類的產品等。
在我們打開某個頁面,比如我的財富時,賬戶當中的金額會進行不斷往上疊加,直到疊加到賬戶中的金額數值,就會停止。
具體效果,大家可以從這里看:https://hv8kwg.axshare.com
好,接下看看這個案例時怎么做的
用中繼器和動態面板制作即可。
我們規定金額和累加次數,分別是中繼器數據集中的兩列數據。
動態面板加載時開啟循環,通過結合判斷來確定每次動態面板切換狀態時是否進行累加或者停止累加。累加每次增加的數字為總額/累加次數,這樣就比較均勻的累加。
上面是它的基本實現原理。根據這個原理我們一起來做一下。
一、創建中繼器中元素
中繼器中的元素是矩形-用以顯示數值;動態面板-兩個狀態,用來切換面板狀態。
二、創建中繼器中數據
前面說了,只需兩列。金額和疊加次數。但這里注意,把中繼器的每項加載時的交互刪除,在這里時沒有用的。
三、設置動態面板進行自動循環切換狀態
這里循環間隔的時間設置得稍微快些。這個時間時每兩次數值疊加的時間差,如果需要慢些,把這個時間設置得大些即可,按需設置。
四、設置動態面板的切換面板狀態時事件。這是重頭戲。
先進行判斷,一是金額進行疊加,這個條件是,當顯示金額的矩形中的文本小于數據集中我們設定的金額時,會進行疊加。金額就是疊加結束后的金額加上每一次疊加的數值即可。
因為我的案例里邊金額保留了兩位數,所以為了保持兩位數,這里使用了一個tofixed函數限制了小數點后的位數。同樣這也是按需設置,如果你是整數的話,直接取整即可。
接下來的一種情況是,金額停止疊加。當展示的數值與總數值的差值小于單次疊加的數值時,說明已經不足以再進行疊加了,所以金額就不再往上疊加。
這里的條件大家還可以想一下,有沒有其他的條件設置方法,留著給大家思考哈哈哈哈。動作就很簡單了,讓金額等于數據集中數據就行了。
最后,別忘記了,將動態面板的自動循環停止了。
大家設置好之后看看效果如何。動態面板的狀態切換在數值切換的時候可以應用,比如電商網站常見的活動倒計時等,有興趣的話大家可以嘗試一下。
總結
以上是生活随笔為你收集整理的如何让页面停止加载_Axure 案例:数值加载效果的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: mysql练习_MySQL练习——4
- 下一篇: 树莓派sd卡格式化_树莓派的sd卡存储空