我想在点击页面中的墨水池后显示具有相同底部导航的不同页面。底部导航栏,其中包含主页和消息按钮..我想在我的应用程序中显示我的所有页面..我的主页面与我的主页按钮(位于底部导航栏)连接,我的所有墨水池都存在于那个页面..我的代码和截图在下面给出
主飞镖
import 'package:flutter/material.dart';
import 'package:typeolx/MainPage.dart';
import 'colors.dart';
import 'package:typeolx/main_bottom_nav_bar.dart';
import 'package:typeolx/chatlistpage.dart';
void main() => runApp(
new MaterialApp(
theme: buildThemeData(),
home: MainPage(),
));
ThemeData buildThemeData() {
final baseTheme = ThemeData(
fontFamily: "FiraCode",
);
return baseTheme.copyWith(
primaryColor: kPrimaryColor,
primaryColorDark: kPrimaryDark,
primaryColorLight: kPrimaryLight,
accentColor: kSecondaryColor,
bottomAppBarColor: kSecondaryDark,
buttonColor: kSecondaryColor,
sliderTheme: SliderThemeData.fromPrimaryColors(
primaryColor: kPrimaryColor,
primaryColorDark: kPrimaryDark,
primaryColorLight: kPrimaryLight,
valueIndicatorTextStyle: TextStyle(),
),
textTheme: TextTheme().copyWith(
subhead: TextStyle(
fontFamily: "SnackerComic",
)),
);
}
MainPageState mainPageState = new MainPageState();
class MainPage extends StatefulWidget {
static final String routeName = '/MainPage';
@override
MainPageState createState() => mainPageState;
}
class MainPageState extends State<MainPage>
with SingleTickerProviderStateMixin {
void _rebuild() {
setState(() {});
}
@override
Widget build(BuildContext context) {
return new Scaffold(
backgroundColor:
currentIndex == 0 ? Theme.of(context).selectedRowColor : Colors.white,
body: new SafeArea(
child:
currentIndex == 0 ? new MainScreen() : new ChatListPage(),
),
bottomNavigationBar: new MainBottomNavBar(_rebuild),
floatingActionButton:
currentIndex != 0 ? null : buildSellButton(Icons.add_a_photo, 'eytrtv'),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
}
FloatingActionButton buildSellButton(IconData icon, String text) {
return new FloatingActionButton.extended(
onPressed: () {
// TODO:
},
icon: new Icon(icon),
label: new Text(text),
);
}
}
main_buttom_nav_bar
import 'package:flutter/material.dart';
MainBottomNavBarState mainBottomNavBarState = new MainBottomNavBarState();
int unReadMessageCount = 0;
int currentIndex = 0;
class MainBottomNavBar extends StatefulWidget {
MainBottomNavBar(this.rebuild);
final VoidCallback rebuild;
@override
MainBottomNavBarState createState() {
return mainBottomNavBarState;
}
BottomNavigationBarItem buildBottomNavigationBarItem(BuildContext context,
String title, IconData icon, bool shouldShowUnreadCount, int pos) {
return new BottomNavigationBarItem(
icon: !shouldShowUnreadCount
? new Icon(
icon,
size: 30.0,
color: currentIndex == pos
? Theme.of(context).primaryColorDark
: Theme.of(context).accentColor.withOpacity(0.7),
)
: new Stack(
children: <Widget>[
new Icon(
icon,
size: 30.0,
color: currentIndex == pos
? Theme.of(context).primaryColorDark
: Theme.of(context).accentColor.withOpacity(0.7),
),
new Positioned(
right: 0.0,
top: 0.0,
child: unReadMessageCount > 0
? new CircleAvatar(
child: new Text(
'$unReadMessageCount',
style: new TextStyle(
fontSize: 11.0, color: Colors.white),
),
backgroundColor: Colors.red,
radius: 9.0,
)
: new Container(),
),
],
),
title: new Text(title,
style: new TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.w600,
color: currentIndex == pos
? Theme.of(context).primaryColorDark
: Theme.of(context).accentColor.withOpacity(0.7),
)),
);
}
}
class MainBottomNavBarState extends State<MainBottomNavBar> {
onNavItemTapped(int pos) {
currentIndex = pos;
widget.rebuild();
}
@override
Widget build(BuildContext context) {
return new BottomNavigationBar(
currentIndex: currentIndex,
onTap: (selectedPosition) => onNavItemTapped(selectedPosition),
items: <BottomNavigationBarItem>[
widget.buildBottomNavigationBarItem(
context, 'home', Icons.home, false, 0),
widget.buildBottomNavigationBarItem(
context, 'Chats', Icons.chat, true, 1),
],
);
}
}