如何使用底部导航按钮功能

标签：body List 介绍 索引 底部 按钮 导航 BottomNavigationBar 页面

文章目录

• 1 概念介绍
• 2 使用方法
• 3 示例代码
• 4 经验总结

我们在上一章回中介绍了BottomNavigationBar Widget,本章回中将介绍如何使用BottomNavigationBar切换页面。闲话休提，让我们一起Talk Flutter吧。

1 概念介绍

我们在上一章回中介绍了BottomNavigationBar相关的内容，本章回中将在此基础上介绍如何使用BottomNavigationBar页面，这个是我们经常在App中使用的功
能，比如每天使用的微信就可以通过底部导航切换到不同的页面中，接下来我们将介绍详细的使用方法。

2 使用方法

在BottomNavigationBar中切换页面的思路是点击不同的标签时获取到标签的索引值，然后依据该索引值修改body中对应的内容。注意这个body是Scaffold中的属
性。这个过程可以这样理解：在Scallfol的bottomNavigationBar属性对应的BottomNavigationBar中获取索引值，然后依据该索引值修改body属性的值。

1. 定义一个List对象用来存放不同的页面；
2. 通过onTap属性获取被选择标签的索引值；
3. 把标签的索引值当作List的索引值，进而获取到不同的页面，并且把页面赋值给body属性；

3 示例代码

// 定义一个List对象用来存放不同的页面,这里存放的是其它Widged的示例
List<Widget> bodyWidgetList = const [
  ExStack(),
  ExButton

标签：body,List,介绍,索引,底部,按钮,导航,BottomNavigationBar,页面
From： https://blog.csdn.net/talk_8/article/details/144726143