ui-app让每个页面都显示底部导航栏
时间: 2024-01-16 13:04:18 浏览: 181
要在每个页面都显示底部导航栏,您可以在您的UI-App中使用底部导航栏组件,并在每个页面上使用该组件。
以下是一个简单的示例代码:
```dart
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'My App',
home: Scaffold(
appBar: AppBar(
title: Text('My App'),
),
body: Center(
child: Text('Hello, World!'),
),
bottomNavigationBar: BottomNavigationBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Home',
),
BottomNavigationBarItem(
icon: Icon(Icons.search),
label: 'Search',
),
BottomNavigationBarItem(
icon: Icon(Icons.person),
label: 'Profile',
),
],
currentIndex: 0,
selectedItemColor: Colors.amber[800],
onTap: (index) {},
),
),
);
}
}
```
在这个示例中,`Scaffold`的`bottomNavigationBar`属性设置为`BottomNavigationBar`组件,该组件显示了三个底部导航栏项目:Home、Search和Profile。
您可以在每个页面中使用类似的代码来显示底部导航栏。
阅读全文