flutter传递值到任意widget(当需要widget嵌套使用需要传递值的时候)
如果我们有这样一个应用场景:
WidgetA执行点击之后将数据通过widgetB传递到其下的widgetC。
通常可以通过设置构造函数,传递对应参数到制定的widget树中,如下面代码所描述:
表示需要将widgetA中的点击改变内容传递到widgetB中的widgetC中展示;
需要通过设置widgetB的构造函数,接收对应参数,再传递给widgetC展示;
class Inheritedwidget extends StatefulWidget { @override _InheritedWidgetState createState() => _InheritedWidgetState(); } class _InheritedWidgetState extends State<Inheritedwidget> { int count=0; @override void initState() { // TODO: implement initState super.initState(); } @override Widget build(BuildContext context) { print(count); return Scaffold( appBar: AppBar(title: Text("inherited widget"),),body: Container( child: Center( child: Column( children: <Widget>[ Text("class0"), class1(count), ], ), ), ), floatingActionButton: FloatingActionButton(onPressed: (){ return addCount(); },child: Text("add"),), ); } void addCount() { setState(() { count=1+count; }); } }
WidgetB:
class class1 extends StatelessWidget { int count; class1(this.count); @override Widget build(BuildContext context) { return Container( child: Column( children: <Widget>[ Text("class1"), class2(count), ], ), ); } }
widgetC:
class class2 extends StatelessWidget { int count; class2(this.count); @override Widget build(BuildContext context) { return Container( child: Center( child: Text("$count"), ), ); } }
以上方法当然可以实现需要的效果,但是当有多层的widget嵌套关系的时候代码阅读性降低,可以通过以下方法传递值到指定的widget中;
通过类似于Android中的contentProvider提供一个中间类,将需要传递的数据通过中间类传递到制定的widget中。
中间类:
//countProvider类 提供count属性和child属性 用于与原widget相关联, class CountProvider extends InheritedWidget{ final int count; final Widget child; //构造方法 CountProvider({this.count, this.child}):super(child:child); //提供方法获取到countprovider类对象 static CountProvider of(BuildContext context){ return context.inheritFromWidgetOfExactType(CountProvider); } @override bool updateShouldNotify(InheritedWidget oldWidget) { // TODO: implement updateShouldNotify return false; } }
通过counterprovider包裹需要展示的widget并传入需要改变的值;
class Inheritedwidget extends StatefulWidget { @override _InheritedWidgetState createState() => _InheritedWidgetState(); } class _InheritedWidgetState extends State<Inheritedwidget> { int count=0; @override Widget build(BuildContext context) { print(count); return CountProvider( count:count, child: Scaffold( backgroundColor: Colors.blue, appBar: AppBar(title: Text("inherited widget"),),body: Container( child: Center( child: Column( children: <Widget>[ Text("class0"), class1(), ], ), ), ), floatingActionButton: FloatingActionButton(onPressed: (){ return addCount(); },child: Text("add"),), ), ); } void addCount() { setState(() { count=1+count; }); } }
使用中间类提供的数据执行更新对应widget。
class class2 extends StatelessWidget { @override Widget build(BuildContext context) { int count = CountProvider.of(context).count; return Container( child: Center( child: Text("$count"), ), ); } }
通过以上方法即可在不同widget中传递需要改变的值。
总结
以上所述是小编给大家介绍的flutter传递值到任意widget(当需要widget嵌套使用需要传递值的时候),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
赞 (0)