美文网首页
flutter_bloc_倒计时

flutter_bloc_倒计时

作者: songzhaojie | 来源:发表于2019-06-06 16:51 被阅读0次

    昨天有一个需求,要写一个验证码倒计时,其实这个比较好写滴,但是如果直接在当前页面直接开干的话,会增加界面臃肿,增加阅读时间,不好管理,本文就倒计时与flutter_bloc 结合讲解一下,个人感觉还是可以滴,😂😂😂走起

    需求: 点击按钮 倒计时60开始,中间不能点击按钮,直到结束为止,

    1,创建bloc.dart, 使用bloc(不会滴可以去百度或者看前面几篇文章)ok

    2,创建事件event  

    3,创建继承bloc 类,

    4,根据需求知道我们需要一个数据,跟一个bool值,这时state 可以是一个字典啦

    5, 创建一个定时器去发送事件,跟算法

    下面是完整封装方法

    abstract class Event {

    }

    class CountEventextends Event{

    @override

      StringtoString() {

    // TODO: implement toString

        return 'CountEvent';

      }

    }

    class CoundBlocextends Bloc<Event,Map>{

    Timer_countdownTimer;

      int_count;

      @override

      // TODO: implement initialState

      Mapget initialState {

    Map schoolsMap =new Map();

        schoolsMap['count'] ='重新获取';

        schoolsMap['click'] ='true';

        return schoolsMap;

      }

    void startOpen(){

    _count=60;

          _countdownTimer=null;

          _countdownTimer =

    new Timer.periodic(new Duration(seconds:1), (timer) {

    if(_count==0){

    _countdownTimer.cancel();

            }else

            {

    _count--;

              dispatch(CountEvent());

            }

    });

      }

    @override

      void dispose() {

    // TODO: implement dispose

        _countdownTimer?.cancel();

        _countdownTimer=null;

        super.dispose();

      }

    @override

      StreammapEventToState(Event event)async* {

    // TODO: implement mapEventToState

        if(eventis Event){

    Map schoolsMap =new Map();

          schoolsMap['count'] ='${_count==0?'重新获取':'重新获取(${_count})'}';

          if(_count==0){

    schoolsMap['click'] ='true';

          }else {

    schoolsMap['click'] ='flase';

          }

    yield schoolsMap;

          return ;

        }

    }

    }

    相关文章

      网友评论

          本文标题:flutter_bloc_倒计时

          本文链接:https://www.haomeiwen.com/subject/xxeuxctx.html