在app注冊(cè)或者登錄時(shí)，一般需要驗(yàn)證手機(jī)號(hào)碼，常用的方式就是向手機(jī)發(fā)送驗(yàn)證碼。下面介紹在Axure中，通過(guò)動(dòng)態(tài)面板切換、文本框文字改變兩種方法實(shí)現(xiàn)這種效果。文章部分來(lái)源于其它網(wǎng)友，感謝分享。

一、效果圖

首先我們看一下效果圖，如下：

二、具體實(shí)現(xiàn)：

第一種方法：全局變量+矩形按鈕+動(dòng)態(tài)面板兩種狀態(tài)的切換

1、創(chuàng)建一個(gè)矩形（命名為button）、一個(gè)動(dòng)態(tài)面板（命名為：option）、一個(gè)全局變量（命名為：timer），動(dòng)態(tài)面板創(chuàng)建兩個(gè)state。如下圖：

2、為按鈕創(chuàng)建“鼠標(biāo)單擊時(shí)”事件，為動(dòng)態(tài)面板創(chuàng)建“狀態(tài)改變時(shí)”事件

3、運(yùn)行即可查看相關(guān)效果（底部查看效果）

第二種方法：動(dòng)態(tài)面板+文本改變

1、創(chuàng)建一個(gè)動(dòng)態(tài)面板（命名為：option），添加三個(gè)狀態(tài)，分別為獲取、數(shù)字、再次獲取。三種狀態(tài)下分別制作對(duì)應(yīng)的原件顯示，如下圖：

2、為三個(gè)狀態(tài)內(nèi)原件，分別創(chuàng)建事件：

a、獲取狀態(tài)：“鼠標(biāo)單擊時(shí)”事件；數(shù)字狀態(tài)：“文本改變時(shí)”事件；再次獲取狀態(tài)：“鼠標(biāo)單擊時(shí)”事件。如下：

3、運(yùn)行效果如下：

以上就是實(shí)現(xiàn)簡(jiǎn)單驗(yàn)證碼倒計(jì)時(shí)效果。

本文由 @走錯(cuò)路了 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。