home页面
import 'package:flutter/material.dart';
import 'package:demo/page/friends/friends.dart';
import 'package:demo/page/message/message.dart';
import 'package:demo/page/my/my.dart';
class Home extends StatefulWidget {
@override
State<StatefulWidget> createState() => _Home();
}
class _Home extends State<Home> {
List pageList = [Message(), Friends(), My()];
List pageTitleList = ['消息', '朋友列表', '我的'];
int pageIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(child: pageList[pageIndex]),
bottomNavigationBar: BottomAppBar(
child: Container(
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
InkWell(
child: Text('消息'),
onTap: () {
this.setState(() {
pageIndex = 0;
});
},
),
InkWell(
child: Text('好友'),
onTap: () {
this.setState(() {
pageIndex = 1;
});
},
),
InkWell(
child: Text('我的'),
onTap: () {
this.setState(() {
pageIndex = 2;
});
},
),
],
),
),
),
);
}
}
说明
Message()是消息页面,登陆成功之后就要显示的,所以放在第一个(pageIndex ,索引,默认值为0)
Friends()是好友列表页面
My()是我的页面
总结
也可以使用BottomNavigationBarItem
来实现,但是由于BottomNavigationBarItem
中的icon
是必须要传的参数,并且其定制化不高,所以使用上面的方式更好