flutter传递值到任意widget(当需要widget嵌套使用需要传递值的时候)
程序员文章站
2022-07-06 14:49:08
如果我们有这样一个应用场景:
widgeta执行点击之后将数据通过widgetb传递到其下的widgetc。
通常可以通过设置构造函数,传递对应参数到制定的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嵌套使用需要传递值的时候),希望对大家有所帮助
上一篇: VUE写一个简单的表格实例