Blame view

lib/login/loginpage/time_widget.dart 2.56 KB
17a80689   liangchengyou   feat:倒计时功能开发
1
  import 'package:flutter/cupertino.dart';
41b60caf   liangchengyou   feat:倒计时组件功能完善
2
  import 'package:flutter/material.dart';
17a80689   liangchengyou   feat:倒计时功能开发
3
4
5
6
7
  import 'package:flutter_bloc/flutter_bloc.dart';
  import 'package:wow_english/common/blocs/timerbloc/timer_bloc.dart';
  import 'package:wow_english/common/extension/string_extension.dart';
  import 'package:wow_english/common/widgets/timer_ticker.dart';
  
e1f36554   liangchengyou   feat:调整状态监听逻辑
8
  class TimerWidget extends StatelessWidget {
17a80689   liangchengyou   feat:倒计时功能开发
9
10
11
12
13
    const TimerWidget({super.key, required this.canSendSms});
  
    final bool canSendSms;
  
    @override
e1f36554   liangchengyou   feat:调整状态监听逻辑
14
15
16
17
18
    Widget build(BuildContext context) {
      return BlocProvider(
        create: (_) => TimerBloc(ticker: const TimerTicker()),
        child: TimerWidgetView(canSendSms: canSendSms,),
      );
17a80689   liangchengyou   feat:倒计时功能开发
19
20
21
    }
  }
  
e1f36554   liangchengyou   feat:调整状态监听逻辑
22
  class TimerWidgetView extends StatelessWidget {
e1f36554   liangchengyou   feat:调整状态监听逻辑
23
24
25
    final bool canSendSms;
  
    const TimerWidgetView({super.key, required this.canSendSms});
17a80689   liangchengyou   feat:倒计时功能开发
26
  
17a80689   liangchengyou   feat:倒计时功能开发
27
28
    @override
    Widget build(BuildContext context) {
e1f36554   liangchengyou   feat:调整状态监听逻辑
29
30
      return BlocListener<TimerBloc,TimerState>(
        listener: (context, s) {
41b60caf   liangchengyou   feat:倒计时组件功能完善
31
32
          if (s is FinishedState) {
            ///重置计时器
e1f36554   liangchengyou   feat:调整状态监听逻辑
33
            context.read<TimerBloc>().add(ResetEvent());
e1f36554   liangchengyou   feat:调整状态监听逻辑
34
35
          }
        },
41b60caf   liangchengyou   feat:倒计时组件功能完善
36
        child: _buildCountdownWidget(),
17a80689   liangchengyou   feat:倒计时功能开发
37
38
39
      );
    }
  
41b60caf   liangchengyou   feat:倒计时组件功能完善
40
    Widget _buildCountdownWidget() => BlocBuilder<TimerBloc,TimerState>(
17a80689   liangchengyou   feat:倒计时功能开发
41
42
43
      buildWhen: (prev, state) => prev.runtimeType != state.runtimeType,
      builder: (context,state) {
        final bloc = BlocProvider.of<TimerBloc>(context);
17a80689   liangchengyou   feat:倒计时功能开发
44
45
        return GestureDetector(
          onTap: () {
41b60caf   liangchengyou   feat:倒计时组件功能完善
46
47
48
49
            print(bloc.isCountTimer);
            if (canSendSms && !bloc.isCountTimer ) {
              print(state.duration);
              bloc.add(StartEvent(duration: state.duration));
17a80689   liangchengyou   feat:倒计时功能开发
50
51
52
53
54
55
            }
          },
          child: Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                  image: AssetImage(
41b60caf   liangchengyou   feat:倒计时组件功能完善
56
                      canSendSms && !bloc.isCountTimer ? 'securitycode'.assetPng:'securitycode_dis'.assetPng
17a80689   liangchengyou   feat:倒计时功能开发
57
58
59
60
61
                  ),
                  fit: BoxFit.fill
              ),
            ),
            padding: const EdgeInsets.symmetric(horizontal:12.0,vertical: 15.0),
41b60caf   liangchengyou   feat:倒计时组件功能完善
62
            child: Row(
17a80689   liangchengyou   feat:倒计时功能开发
63
              children: [
17a80689   liangchengyou   feat:倒计时功能开发
64
                if (state is RunningState)...[
41b60caf   liangchengyou   feat:倒计时组件功能完善
65
66
                  const TimerText()
                ] else ...[
17a80689   liangchengyou   feat:倒计时功能开发
67
68
69
70
71
72
73
74
                  const Text('获取验证码')
                ]
              ],
            ),
          ),
        );
      },
    );
41b60caf   liangchengyou   feat:倒计时组件功能完善
75
76
77
78
79
80
81
82
83
84
85
86
87
88
  }
  
  class TimerText extends StatelessWidget {
    const TimerText({super.key});
  
    @override
    Widget build(BuildContext context) {
      final duration = context.select((TimerBloc bloc) => bloc.state.duration);
      final secondsStr = duration.toString().padLeft(2, '0');
      return Text(
        '${secondsStr}s后再次获取',
      );
    }
  }