flutter传递值到任意widget(当需要widget嵌套使用需要传递值的时候)

 更新时间:2019年07月24日 10:13:10   作者:zhakesipailuo  
这篇文章主要介绍了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嵌套使用需要传递值的时候),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

相关文章

  • Android跳转到通讯录获取用户名称和手机号码的实现思路

    Android跳转到通讯录获取用户名称和手机号码的实现思路

    这篇文章主要介绍了Android跳转到通讯录获取用户名称和手机号码的实现思路,当用户点击跳转到通讯录界面 并取通讯录姓名和手机号码 ,实现代码简单易懂,非常不错感兴趣的朋友一起看看吧
    2016-10-10
  • Android Studio实现帧动画

    Android Studio实现帧动画

    这篇文章主要为大家详细介绍了Android Studio实现帧动画,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • 详谈OnTouchListener与OnGestureListener的区别

    详谈OnTouchListener与OnGestureListener的区别

    下面小编就为大家带来一篇详谈OnTouchListener与OnGestureListener的区别。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-04-04
  • Android滑动冲突的完美解决方案

    Android滑动冲突的完美解决方案

    在Android开发中滑动冲突可以说是比较常见的一类问题,也是比较让人头疼的一类问题,两个原本完美的控件,组合在一起之后,忽然发现整个世界都不好了。滑动冲突主要分为同方向滑动冲突和不同方向滑动冲突,下面本文将详细说明两种滑动冲突如何解决。
    2016-08-08
  • Android中使用PagerSlidingTabStrip实现导航标题的示例

    Android中使用PagerSlidingTabStrip实现导航标题的示例

    本篇文章主要介绍了Android中使用PagerSlidingTabStrip实现导航标题的示例,具有一定的参考价值,有兴趣的可以了解一下。
    2017-01-01
  • Android简单实现自定义流式布局的方法

    Android简单实现自定义流式布局的方法

    这篇文章主要介绍了Android简单实现自定义流式布局的方法,结合实例形式分析了Android流式布局的原理与实现技巧,需要的朋友可以参考下
    2016-07-07
  • android开发基础教程—文件存储功能实现

    android开发基础教程—文件存储功能实现

    文件存储功能在实现数据读写时会频繁使用到,接下来介绍文件存储功能的实现,感兴趣的朋友可以了解下
    2013-01-01
  • 说说在Android如何使用服务(Service)的方法

    说说在Android如何使用服务(Service)的方法

    这篇文章主要介绍了说说在Android如何使用服务(Service)的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • Android Coil对比Glide深入分析探究

    Android Coil对比Glide深入分析探究

    这篇文章主要介绍了Android Coil对比Glide,Coil是Android上的一个全新的图片加载框架,它的全名叫做coroutine image loader,即协程图片加载库
    2023-02-02
  • Android View的事件分发详解

    Android View的事件分发详解

    我们在学习View的时候,不可避免会遇到事件的分发,而往往遇到的很多滑动冲突的问题都是由于处理事件分发时不恰当所造成的。因此,深入了解View事件分发机制的原理,对于我们来说是很有必要的。
    2017-12-12

最新评论