发送验证码倒计时重新发送的案例教程

　　发送验证码，倒计时重新发送，这个功能在产品中非常常见，本篇文章笔者将会以两种方法来展示如何实现这个功能，enjoy
　　一、案例目标
　　今天这个教程中，我会用2种方法实现这个功能原型，主要涉及到全局变量的使用，先看一下原型样式：
　　您也可以在线预览交互效果：点击预览
　　二、案例教程
　　第一种实现方法
　　使用动态面板的切换，来达到倒计时的效果；
　　所需元件：
　　2个输入框、1个发送验证码的按钮、1个登录按钮、1个动态面板（命名为循环面板）
　　制作步骤：
　　1。先拖一个文本框，调整好宽、高、圆角，边框颜色；
　　2。点击交互新建交互在交互样式中选获取焦点时，设置文本框获取焦点时的样式；同理设置提示文字
　　3。选中文本框，右击可以设置输入类型、编辑输入最大长度；
　　4。以此设置好元件的静态样式。
　　进入交互设置：
　　1。由于时间是一个变量，并且需要做实时改变，所以先设置一个全局变量X，并设置初始值为30；
　　2。发送验证码按钮的交互事件设置
　　只有按钮发送验证码文字为发送验证码的时候，才可以点击，所以我们在给按钮设置单击时交互事件的时候，需要先添加一个条件；
　　设置面板状态为往后循环；
　　为了能够每次点击时，X的值都为30，所以设置变量值为30；
　　3。循环面板的交互设置
　　首先，当面板开始改变的时候，去设置发送验证码按钮的文本为剩余〔〔X〕〕秒；
　　为了使时间每次都减去1，所以还要设置变量值X为〔〔X1〕〕；
　　为了使倒计时为0的时候，出现发送验证码，所以设置两个条件，值Xamp；gt；0，值x0时，就设置文本为发送验证码；
　　实现逻辑：
　　1。单击发送验证码：
　　设置循环面板每秒钟切换一次状态；
　　2。循环面板状态改变时：
　　设置发送验证码文本变为剩余X秒；当剩余0秒时，可以重新发送
　　第二种实现方法
　　使用等待事件，来达到倒计时的效果；
　　所需元件：
　　2个输入框、1个发送验证码的按钮、1个登录按钮；
　　制作步骤：
　　静态元件同方法一；
　　直接进入交互设置
　　首先，设置一个全局变量X；初始值为30；
　　设置单击事件，先判断条件Xamp；gt；0时，去设置发送验证码按钮的文本为剩余〔〔X〕〕秒；
　　为了使时间每次都减去1，所以在等待1秒后，将变量值X设为〔〔X1〕〕；
　　触发单击事件，让设置文本为剩余〔〔X〕〕秒，然后等待1秒钟，循环多次；
　　其次，当条件X0时，就需要设置文本为发送验证码，终止单击事件循环。
　　实现逻辑：
　　单击发送验证码：
　　设置发送验证码文本变为剩余X秒；
　　等待1秒，然后再设置X为〔〔X1〕〕，然后再触发单击事件
　　相当于重复循环改变X值，直到0；
　　当剩余0秒时，可以重新发送