flutter傳遞值到任意widget(當(dāng)需要widget嵌套使用需要傳遞值的時(shí)候)

更新時(shí)間：2019年07月24日 10:13:10 作者：zhakesipailuo

這篇文章主要介紹了flutter傳遞值到任意widget(當(dāng)需要widget嵌套使用需要傳遞值的時(shí)候),本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下

如果我們有這樣一個(gè)應(yīng)用場(chǎng)景：

WidgetA執(zhí)行點(diǎn)擊之后將數(shù)據(jù)通過(guò)widgetB傳遞到其下的widgetC。

通?？梢酝ㄟ^(guò)設(shè)置構(gòu)造函數(shù)，傳遞對(duì)應(yīng)參數(shù)到制定的widget樹(shù)中，如下面代碼所描述：

表示需要將widgetA中的點(diǎn)擊改變內(nèi)容傳遞到widgetB中的widgetC中展示；

需要通過(guò)設(shè)置widgetB的構(gòu)造函數(shù)，接收對(duì)應(yīng)參數(shù)，再傳遞給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"),
   ),
  );
 }
}

以上方法當(dāng)然可以實(shí)現(xiàn)需要的效果，但是當(dāng)有多層的widget嵌套關(guān)系的時(shí)候代碼閱讀性降低，可以通過(guò)以下方法傳遞值到指定的widget中；

通過(guò)類(lèi)似于A(yíng)ndroid中的contentProvider提供一個(gè)中間類(lèi)，將需要傳遞的數(shù)據(jù)通過(guò)中間類(lèi)傳遞到制定的widget中。

中間類(lèi)：

//countProvider類(lèi) 提供count屬性和child屬性 用于與原widget相關(guān)聯(lián)，
class CountProvider extends InheritedWidget{
 final int count;
 final Widget child;
 //構(gòu)造方法
 CountProvider({this.count, this.child}):super(child:child);
 //提供方法獲取到countprovider類(lèi)對(duì)象
static CountProvider of(BuildContext context){
 return context.inheritFromWidgetOfExactType(CountProvider);
}
 @override
 bool updateShouldNotify(InheritedWidget oldWidget) {
  // TODO: implement updateShouldNotify
  return false;
 }
}

通過(guò)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;
  });
 }
}

使用中間類(lèi)提供的數(shù)據(jù)執(zhí)行更新對(duì)應(yīng)widget。

class class2 extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  int count = CountProvider.of(context).count;
  return Container(
   child: Center(
    child: Text("$count"),
   ),
  );
 }
}

通過(guò)以上方法即可在不同widget中傳遞需要改變的值。

總結(jié)

以上所述是小編給大家介紹的flutter傳遞值到任意widget(當(dāng)需要widget嵌套使用需要傳遞值的時(shí)候),希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
如果你覺(jué)得本文對(duì)你有幫助，歡迎轉(zhuǎn)載，煩請(qǐng)注明出處，謝謝！

您可能感興趣的文章: