Flutter 遇到一个问题 tabbar写三个正常显示切换,三个以上就只显示一个了
Flutter 遇到一个问题 tabbar写三个正常显示切换,三个以上就只显示一个了
import 'package:flutter/material.dart';
import 'page/home.dart';
import 'page/mine.dart';
import 'page/health.dart';
import 'page/yutang.dart';
import 'page/message.dart';
void main() {
runApp(MyApp());
}
// 根文件
class MyApp extends StatelessWidget {
const MyApp({super.key});
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(debugShowCheckedModeBanner: false, home: MainPage());
}
}
class MainPage extends StatefulWidget {
const MainPage({super.key});
[@override](/user/override)
State<MainPage> createState() => _MainPageState();
}
class _MainPageState extends State<MainPage> {
// 记录下标
int _currentIndex = 0;
// 创建页面
final List<Widget> _tabPages = const [
HomePage(),
YutangPage(),
MessagePage(),
MinePage(),
HealthPage(),
];
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
body: _tabPages[_currentIndex],
// tabbar部分
bottomNavigationBar: BottomNavigationBar(
currentIndex: _currentIndex, //
fixedColor: Colors.orange, // 设置tab选中的颜色
items: [
BottomNavigationBarItem(icon: Icon(Icons.home_filled), label: '咸鱼'),
BottomNavigationBarItem(icon: Icon(Icons.message), label: '鱼塘'),
BottomNavigationBarItem(icon: Icon(Icons.add_box), label: '发布'),
BottomNavigationBarItem(
icon: Icon(Icons.message_rounded),
label: '消息',
),
BottomNavigationBarItem(icon: Icon(Icons.person), label: '我的'),
],
onTap: (index) {
setState(() {
_currentIndex = index;
});
},
),
);
}
}
更多关于 Flutter 遇到一个问题 tabbar写三个正常显示切换,三个以上就只显示一个了的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复


