flutter 验证码倒计时

有一个地方需要注意,button的禁用状态,没有对应的属性,只能是在onPress的时候返回null,但是如果多个button这么办呢?谷歌能想出这么奇葩的东西应该也是不容易

import 'dart:async';

import 'package:beautyapp/util/app_color.dart';
import 'package:flutter/material.dart';

class CounterButton extends StatefulWidget {
  int totalCount;
  VoidCallback getCodePress;
  CounterButton({Key key, this.totalCount = 60, @required this.getCodePress})
      : super(key: key);

  @override
  CounterButtonState createState() => CounterButtonState();
}

class CounterButtonState extends State<CounterButton> {
  Timer _timer;
  var _buttonTitle = '获取验证码';
  var _buttonDisable = false;
  int _count;
  startTimer() {
    _timer = Timer.periodic(Duration(milliseconds: 1000), (timer) {
      _count--;
      _buttonTitle = '${_count}秒';
      _buttonDisable = true;
      if (_count <= 0) {
        _buttonDisable = false;
        _buttonTitle = "再次获取";
        _count = widget.totalCount;
        timer.cancel();
      }
      setState(() {});
    });
  }

  cancelTimer() {
    _buttonDisable = false;
    if (_timer != null) {
      _timer.cancel();
    }
  }

  tapSmsCode() {
  	//回调这里可以不要,直接在这里开始网络请求
    widget.getCodePress();
  }

  @override
  void dispose() {
    super.dispose();
    if (_timer != null) {
      _timer.cancel();
    }
  }

  @override
  void initState() {
    super.initState();
    _count = widget.totalCount;
  }

  @override
  Widget build(BuildContext context) {
    print("_buttonTitle:${_buttonTitle}");
    return Container(
      child: FlatButton(
        onPressed: _buttonDisable == true ? null : tapSmsCode,
        child: Text(_buttonTitle),
        textColor: AppCustomColor.themeGreenColor,
        disabledTextColor: AppCustomColor.themeGreenColor,
      ),
    );
  }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值