Flutter写一个android底部导航栏框架

废话不多说，上代码：

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return MaterialApp(title: 'Bottom Navigation Bar',theme: ThemeData(primaryColor: Colors.blue,),home: MyHomePage(),);}
}class MyHomePage extends StatefulWidget {@override_MyHomePageState createState() => _MyHomePageState();
}class _MyHomePageState extends State<MyHomePage> {int _currentIndex = 0;final List<Widget> _pages = [HomePage(),SearchPage(),ProfilePage(),];@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Bottom Navigation Bar'),),body: _pages[_currentIndex],bottomNavigationBar: BottomNavigationBar(currentIndex: _currentIndex,onTap: (index) {setState(() {_currentIndex = index;});},items: [BottomNavigationBarItem(icon: Icon(Icons.home),label: 'Home',),BottomNavigationBarItem(icon: Icon(Icons.search),label: 'Search',),BottomNavigationBarItem(icon: Icon(Icons.person),label: 'Profile',),],),);}
}class HomePage extends StatelessWidget {@overrideWidget build(BuildContext context) {return Center(child: Text('Home Page'),);}
}class SearchPage extends StatelessWidget {@overrideWidget build(BuildContext context) {return Center(child: Text('Search Page'),);}
}class ProfilePage extends StatelessWidget {@overrideWidget build(BuildContext context) {return Center(child: Text('Profile Page'),);}
}

在上述示例中，我们创建了一个MyHomePage小部件，它是StatefulWidget。MyHomePage包含底部导航栏和相关页面内容。通过BottomNavigationBar和currentIndex属性，我们可以控制当前选中的导航项并在onTap回调中更新状态。

在items属性中，我们设置了三个BottomNavigationBarItem，每个项都有一个图标和标签。当用户切换导航项时，onTap回调会更新currentIndex的值，然后使用此值来显示相应的页面。

在示例中，我们创建了三个简单的页面（HomePage、SearchPage和ProfilePage），你可以根据自己的需求自定义这些页面的内容。

希望这个示例对你有帮助！