适用于多次数据变化
既然有了FutureBuilder 一次性的数据变化更新视图,那就有多次,那就来看看StreamBuilder吧
import 'dart:async';
import 'package:flutter/material.dart';
class StatePage extends StatefulWidget {
@override
StatePageState createState() => new StatePageState();
}
class StatePageState extends State<StatePage> {
StreamController streamController = new StreamController();
int index = 0;
@override
Widget build(BuildContext context) {
print('test StatePageState build');
return Scaffold(
appBar: AppBar(
title: Text('statPage', style: TextStyle(fontSize: 16)),
centerTitle: true,
),
body: Align(
child: Column(
children: <Widget>[
StreamBuilder(
stream: streamController.stream,
initialData: index,
builder: (context, snapshot) {
print('test FutureBuilder builder');
return Text("this number:${snapshot.data}");
},
),
RaisedButton(
child: Text('add $index'),
onPressed: countChange,
),
RaisedButton(
child: Text('add2'),
onPressed: add,
),
],
),
));
}
void countChange() {
streamController.add(++index);
}
void add() {
setState(() {
index += 10;
});
}
@override
void dispose() {
streamController.close();
super.dispose();
}
}
StreamBuilder继承了StreamBuilderBase,StreamBuilderBase又继承了StatefulWidget,所以StreamBuilder中的builder中的视图丢给了一个StatefulWidget,在这个StatefulWidget中接收外面传进来的一个Stream,用于监听数据变化更新,可以看_StreamBuilderBaseState中_subscribe代码
void _subscribe() {
if (widget.stream != null) {
_subscription = widget.stream.listen((T data) {
setState(() {
_summary = widget.afterData(_summary, data);
});
}, onError: (Object error) {
setState(() {
_summary = widget.afterError(_summary, error);
});
}, onDone: () {
setState(() {
_summary = widget.afterDone(_summary);
});
});
_summary = widget.afterConnected(_summary);
}
}
当第一个RaisedButton 点击执行countChange更新stream的值后,_StreamBuilderBaseState中_subscribe方法中widget.stream.listen 会监听到数据变化,执行setState更新当前StatefulWidget,也就是会调用我们定义的StreamBuilder中builder方法
但是当我们自己setState的时候,StreamBuilder中的builder方法同样会被执行,因为这个小部件在我们自己build中,但是这个时候取的snapshot.data并变化,因为snapshot.data取的是stream中的值,这个stream的值并没有发生改变
网友评论