import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; class Create extends StatefulWidget {
@override
_CreateState createState() => _CreateState();
} class _CreateState extends State<Create> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('手機帳號註冊'),
),
body: Center(
child: MyBody(),
),
);
}
} class MyBody extends StatefulWidget {
@override
_MyBodyState createState() => _MyBodyState();
} class _MyBodyState extends State<MyBody> {
bool isButtonEnable=true; //按钮状态 是否可点击
String buttonText='发送验证码'; //初始文本
int count=60; //初始倒计时时间
Timer timer; //倒计时的计时器
TextEditingController mController=TextEditingController();
TextEditingController phoneController=TextEditingController(); void _buttonClickListen(){
setState(() {
if(isButtonEnable){ //当按钮可点击时
isButtonEnable=false; //按钮状态标记
_initTimer();
return null; //返回null按钮禁止点击
}else{ //当按钮不可点击时
// debugPrint('false');
return null; //返回null按钮禁止点击
}
});
} void _initTimer(){
timer = new Timer.periodic(Duration(seconds: 1), (Timer timer) {
count--;
setState(() {
if(count==0){
timer.cancel(); //倒计时结束取消定时器
isButtonEnable=true; //按钮可点击
count=60; //重置时间
buttonText='发送验证码'; //重置按钮文本
}else{
buttonText='重新发送($count)'; //更新文本内容
}
});
});
} @override
void dispose() {
timer?.cancel(); //销毁计时器
timer=null;
super.dispose();
} @override
Widget build(BuildContext context) {
return Container(
child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
color: Colors.white,
padding: EdgeInsets.only(left: 10,right: 10),
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
// crossAxisAlignment: CrossAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.ideographic,
children: <Widget>[
Text('手機號',style: TextStyle(fontSize: 13,color: Color(0xff333333)),),
Expanded(
child: Padding(padding: EdgeInsets.only(left: 15,right: 15,top: 15),
child: TextFormField(
maxLines: 1,
onSaved: (value) { },
controller: phoneController,
textAlign: TextAlign.left,
inputFormatters: [WhitelistingTextInputFormatter.digitsOnly,LengthLimitingTextInputFormatter(6)],
decoration: InputDecoration(
hintText: ('填寫手機號'),
contentPadding: EdgeInsets.only(top: -5,bottom: 0),
hintStyle: TextStyle(
color: Color(0xff999999),
fontSize: 13,
),
alignLabelWithHint: true,
border: OutlineInputBorder(borderSide: BorderSide.none),
),
),),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
// crossAxisAlignment: CrossAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.ideographic,
children: <Widget>[
Text('驗證碼',style: TextStyle(fontSize: 13,color: Color(0xff333333)),),
Expanded(
child: Padding(padding: EdgeInsets.only(left: 15,right: 15,top: 15),
child: TextFormField(
maxLines: 1,
onSaved: (value) { },
controller: mController,
textAlign: TextAlign.left,
inputFormatters: [WhitelistingTextInputFormatter.digitsOnly,LengthLimitingTextInputFormatter(6)],
decoration: InputDecoration(
hintText: ('填寫驗證碼'),
contentPadding: EdgeInsets.only(top: -5,bottom: 0),
hintStyle: TextStyle(
color: Color(0xff999999),
fontSize: 13,
),
alignLabelWithHint: true,
border: OutlineInputBorder(borderSide: BorderSide.none),
),
),),
),
Container(
width: 120,
child: FlatButton(
disabledColor: Colors.grey.withOpacity(0.1), //按钮禁用时的颜色
disabledTextColor: Colors.white, //按钮禁用时的文本颜色
textColor:isButtonEnable?Colors.white:Colors.black.withOpacity(0.2), //文本颜色
color: isButtonEnable?Color(0xff44c5fe):Colors.grey.withOpacity(0.1), //按钮的颜色
splashColor: isButtonEnable?Colors.white.withOpacity(0.1):Colors.transparent,
shape: StadiumBorder(side: BorderSide.none),
onPressed: (){ setState(() {
_buttonClickListen();
});},
// child: Text('重新发送 (${secondSy})'),
child: Text('$buttonText',style: TextStyle(fontSize: 13,),),
),
),
],
),
],
),
),
Container(
width: double.infinity,
height: 45,
margin: EdgeInsets.only(top: 50,left: 10,right: 10),
child: RaisedButton(
onPressed: () {
debugPrint('手機號:${phoneController.text},驗證碼:${mController.text}');
},
shape: StadiumBorder(side: BorderSide.none),
color: Color(0xff44c5fe),
child: Text(
'註冊',
style: TextStyle(color: Colors.white,fontSize: 15),
),
),
),
],
),
);
}
}

Flutter-發送短信驗證碼的更多相关文章

  1. 用戶登陸。防SQL注入,驗證碼不區分大小寫

    if (string.Compare(TBCheckCode.Text, Session["CheckCodeI"].ToString(), true) == 0)        ...

  2. 用戶登陸。防SQL注入,驗證碼不區分大小寫。。

    if (string.Compare(TBCheckCode.Text, Session["CheckCodeI"].ToString(), true) == 0)        ...

  3. Android--发送短信,并且通知发送方

    1.发送短信涉及到权限,我们需要把权限加上 2.当我们发送短信时,不管发送是否成功,接收方是否接收到,系统都会发送广播 3.这时我们注册广播去接收一下就可以了 4.布局文件很简单,里面就两个EditT ...

  4. sim808模块收发送短信

    一,简介 SIM 808发送短信分text模式和PDU模式.text模式已ascii码发送短信,这种模式比较简单,发送命令AT+CMGF=1就可以发送短信,而PDU模式比较复杂,首先发送命令AT+CM ...

  5. android-发送短信

  6. iOS-发送短信验证码倒计时

    /** 发送手机验证码 */ -(void)startSenderYzmMessage{ __block ; //倒计时时间 dispatch_queue_t queue = dispatch_get ...

  7. .Net core----使用容联云短信推送

    一直在忙于写接口,也没有时间去好好的整理的一片文档,写一篇经常的用到的短信推送案例 还是比较喜欢干货  作为有个程序员 有时候复制粘贴习惯了   实在的还是比较实在 比如能用复制解决的为什么不用复制 ...

  8. [麦先生]Laravel框架实现发送短信验证

    今天在做到用户注册和个人中心的安全管理时,我借助实现第三方短信平台在Laravel框架中进行手机验证的设置;  由于我们做的是一个为客户提供医疗咨询和保健品网站,所以对客户个人隐私的保护显得尤为重要, ...

  9. IOS程序开发中-跳转到 发送短信界面 实现发短信

    前言:我发现我标题取的不好,谁帮我取个承接上下文的标题?评论一下,我改 项目需求:在程序开发中,我们需要在某个程序里面发送一些短信验证(不是接收短信验证,关于短信验证,传送门:http://www.c ...

随机推荐

  1. tensorflow源码分析——CTC

    CTC是2006年的论文Connectionist Temporal Classification: Labelling Unsegmented Sequence Data with Recurren ...

  2. leetcode-mid-sorting and searching - 56 Merge Intervals

    mycode 出现的问题:比如最后一个元素是[1,10],1小于前面所有元素的最小值,10大于前面所有元素的最大值,而我最开始的思路只考虑了相邻 参考: 思路:如果我只考虑相邻,必须先将list排序, ...

  3. 测试-修补程序-Hotfix:百科

    ylbtech-测试-修补程序-Hotfix:百科 1.返回顶部 1. Hotfix是微软公司研发的一个程序,针对某一个具体的系统漏洞或安全问题而发布的专门解决该漏洞或安全问题,通常称为修补程序.   ...

  4. tensorflow 分布式搭建

    https://blog.csdn.net/qq_40652148/article/details/80467131 https://yq.aliyun.com/articles/602111 git ...

  5. 送书福利| Python 完全自学手册

    前言 这里不讨论「能不能学,要不要学,应不应该学 Python」的问题,这里只会告诉你怎么学. 首先需要强调的是,如果 Python 都学不会,那么我建议你考虑别的行业,因为 Python 之简单,令 ...

  6. mysql 批量删表

    Select CONCAT( 'drop table ', table_name, ';' ) FROM information_schema.tables Where table_name LIKE ...

  7. 【笔记】云主机当跳板,ssh tunnel远程登录树莓派

    问题 想要在外网登录家中局域网的树莓派,家里的网络外网ip的会变,而且不适合对公网暴露端口.调研了一番,发现可以使用云主机当跳板,结合ssh隧道实现远程登录到局域网中的树莓派 关于ssh隧道的原理可以 ...

  8. HTML——<body> 计算机代码 【头部在“网站开发”中】

    HTML属性 完整的属性列表 在引用属性值的时候,如果某些属性本身就有双引号——name= 'John "ShotGun" Nelson' 

  9. 【SQL系列】从SQL语言的分类谈COMMIT和ROLLBACK的用法

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[SQL系列]从SQL语言的分类谈COMMIT和 ...

  10. 根据select的option文本选中对应的选项

    function selectByOptionTxt(obj,txt){ var optionArr = $(obj).find("option"); for(var i=0;i& ...