InheritedWidget是Flutter中非常重要的一个功能型组件,它提供了一种数据在widget树中从上到下传递、共享的方式。
首先,我们通过继承InheritedWidget,将当前计数器点击次数保存在ShareDataWidget的data属性中:
class ShareDataWidget extends InheritedWidget{
ShareDataWidget({
required this.data,
required Widget child
}):super(child: child);
final int data;
//定义方法,用于子树中的widget获取共享数据
static ShareDataWidget? of(BuildContext context) {
return context.getElementForInheritedWidgetOfExactType<ShareDataWidget>()!.widget as ShareDataWidget;
}
@override
bool updateShouldNotify(ShareDataWidget oldWidget) {
return oldWidget.data != data;
}
}
然后我们实现一个子组件TestWidget,在其build方法中引用ShareDataWidget中的数据。
class TestWidget extends StatefulWidget{
@override
State<StatefulWidget> createState() {
return TestWidgetState();
}
}
class TestWidgetState extends State<TestWidget>{
@override
Widget build(BuildContext context) {
return Text(ShareDataWidget.of(context)!.data.toString());
}
}
最后,我们创建一个按钮,每点击一次,就将ShareDataWidget的值自增:
class InheritedWidgetRoute extends StatefulWidget{
@override
State<StatefulWidget> createState() {
return InheritedWidgetRouteState();
}
}
class InheritedWidgetRouteState extends State<InheritedWidgetRoute>{
int count = 0;
@override
Widget build(BuildContext context) {
return Center(
child: ShareDataWidget(
data: count,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.fromLTRB(10, 10, 10, 10),
child: TestWidget(),
),
RaisedButton(
onPressed: (){
setState(() {
count++;
});
},
child: Text("点击+1"),
),
],
),
),
);
}
}
添加到容器中
class StudyInheritedWidget extends StatelessWidget{
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("共享数据"),
),
body: Container(
child: InheritedWidgetRoute(),
),
);
}
}
运行