在学习Flutter遇到的问题
- 在使用Bloc遇到的问题
- BlocProvider.of() called with a context that does not contain a Bloc of type .
是因为BlocProvider.of(context) 中context的对象不对, 因为我是在State里面写的一个方法,所以context是State的context, 而不是 BlocBuilder中builder(context ,state)的这个context对象;
所以需要将抽出来的方法传入这个BlocBuilder中的context, 然后调用BlocProvider.of(context) 就没有问题了
文章图片
- 按钮倒计时
- 使用StreamController与StreamBuilder来进行创建
这是CountdownButtonBloc
/// 倒计时工具类
class CountdownButtonBloc {
StreamController _controller = new StreamController();
StreamSink get _streamSink => _controller.sink;
Stream get stream => _controller.stream;
/// 判断当前事件是否结束,默认true是结束的。
bool _isFinish = true;
Timer _timer;
void dispose() {
_stopTimer();
_controller.close();
}/// 开始计时
/// [totalTime] 倒计时的时间
/// [initText] 初始显示的text
void startCountdown(int totalTime, String initText) {
if (!_isFinish) {
return;
}
_streamSink.add("$totalTime s Resend");
// 倒计时开始
_timer = Timer.periodic(Duration(seconds: 1), (timer) {
if (_controller.isClosed) {
_stopTimer();
}final event = totalTime - timer.tick;
print("event----> $event");
if (event <= 0) {
_streamSink.add(initText);
_stopTimer();
} else {
_streamSink.add("$event s Resend");
_isFinish = false;
}
});
}// 停止计时
_stopTimer() {
if (_timer != null) {
_timer.cancel();
_timer = null;
}
_isFinish = true;
}// 计时是否结束
bool isFinish() {
return _isFinish;
}
}
【工作中Flutter遇到的问题】使用的时候,就可以直接创建并使用;
CountdownButtonBloc _countdownButtonBloc = CountdownButtonBloc();
Center(
child: StreamBuilder(
stream: _countdownButtonBloc.stream,
builder: (context, snapShot) {
return RaisedButton(
onPressed: _countdownButtonBloc.isFinish()
? () {
_countdownButtonBloc.startCountdown(13, "send code");
}
: () {},
textColor: Colors.red,
disabledTextColor: Colors.red,
child: Text(snapShot.data ?? "send code"),
);
},
),
)、、、最后记得添加这行代码就行,
@override
void dispose() {
_countdownButtonBloc.dispose();
super.dispose();
}
推荐阅读
- 回顾 Flutter 2021 重要时刻,奉上虎年红包封面喜迎新年!
- Flutter实现左侧边栏导航
- 如何在 Flutter 创建一个后台任务
- Flutter Convex Bottom 底部导航
- Flutter动态化框架Thresh
- 基于 Riverpod 的 Flutter 状态管理
- Flutter 2022 产品路线图发布
- Flutter 插件库
- Windows Running “flutter pub get“ in XXX卡死
- Flutter之下拉刷新,上拉加载更多