用 Axure 設(shè)計(jì)60S倒計(jì)時(shí)
很多互聯(lián)網(wǎng)平臺(tái),采用手機(jī)號(hào)注冊(cè)時(shí),都要獲取驗(yàn)證碼,如何在原型中做到點(diǎn)擊獲取驗(yàn)證碼按鈕,上面會(huì)和真實(shí)注冊(cè)一樣,出現(xiàn)倒計(jì)時(shí)?倒計(jì)時(shí)60S結(jié)束后,文案又恢復(fù)為獲取驗(yàn)證碼?
如下圖,圖一為點(diǎn)擊后,圖二未點(diǎn)擊時(shí)文案:
第一步:
設(shè)置全局變量,隨便用字母命名一個(gè),我用的是S。當(dāng)頁(yè)面載入時(shí),設(shè)置全局變量的值為60。
第二步:
設(shè)置點(diǎn)擊交互事件,首先添加一個(gè)動(dòng)態(tài)面板,大小不限制,命名為時(shí)間計(jì)算(隨意)。
其次復(fù)制一個(gè)面板,使之包含兩層面板。
然后命名獲取驗(yàn)證碼按鈕名稱為“驗(yàn)證碼”,點(diǎn)擊驗(yàn)證碼,設(shè)置“時(shí)間計(jì)算”面板循環(huán)向后切換,時(shí)間間隔為1000毫秒。
最后當(dāng)“時(shí)間面板”循環(huán)時(shí),選擇時(shí)間面板元件,狀態(tài)改變時(shí),設(shè)置全局變量值為S=[S-1],設(shè)置文本于按鈕文字 還剩[s]秒重新發(fā)送,當(dāng)S=0時(shí),“時(shí)間面板停止循環(huán)”再次賦值S=60,按鈕文字為獲取驗(yàn)證碼。
如下圖:
完美,收工。
本文由 @胖子 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載
題圖來(lái)自Unsplash,基于CC0協(xié)議
這里面有個(gè)問(wèn)題,就是編輯條件的時(shí)候,應(yīng)該是(If “[[s]]” > “0”),而不是(If “s” > “0”)。
我自己做的時(shí)候,實(shí)現(xiàn)本來(lái)30秒,倒計(jì)時(shí)到29秒就停了,為什么?求大神指教?。?!
OK,好了
確認(rèn)無(wú)誤,為什么我做完后點(diǎn)擊不行啊 ??
嗯,可以就行;