flutter系列之:flutter中可以建索引的栈布局IndexedStack( 二 )


class MyHomePage extends StatefulWidget {const MyHomePage({Key? key, required this.title}) : super(key: key);final String title;@overrideState<MyHomePage> createState() => _MyHomePageState();}class _MyHomePageState extends State<MyHomePage> {int _counter = 0;void _changeIndex() {setState(() {_counter = (_counter+1) % 4;print(_counter);});}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text(widget.title),),body: Center(child: IndexedStack(index: _counter,children: [widgetOne(),widgetTwo(),widgetThree(),widgetFour(),],),),floatingActionButton: FloatingActionButton(onPressed: _changeIndex,tooltip: 'change index',child: const Icon(Icons.arrow_back),),);}程序运行之后的效果如下:

flutter系列之:flutter中可以建索引的栈布局IndexedStack

文章插图
通过点击右下方的按钮,我们得到了不同的widget 。
总结IndexWidget和tab有点类似,大家可以在需要的时候使用 。
本文的例子:https://github.com/ddean2009/learn-flutter.git
更多内容请参考 www.flydean.com
最通俗的解读,最深刻的干货,最简洁的教程,众多你不知道的小技巧等你来发现!
欢迎关注我的公众号:「程序那些事」,懂技术,更懂你!

经验总结扩展阅读