Commit e185390e authored by xuehao's avatar xuehao

bottomNavigationBar、底部导航栏切换,权重比布局

parent abcce1b5
......@@ -14,4 +14,12 @@ class AppColors{
static const dividerColor = 0xffeeeeee;
/// 控件禁用时的颜色
static const disabledColor = 0xffdddddd;
static const blue_bg_color = 0xFF2893FF;
static const blue_bg_color2 = 0xFFEEF9FF;
static const text_default_color = 0xff666666;
static const white_transparent_50 = 0x8CFFFFFF;
}
\ No newline at end of file
......@@ -21,4 +21,11 @@ class Images{
static const ic_login_button = "${imagesPath}login_button.png";
static const ic_doctor_avatar = "${imagesPath}ic_doctor_avatar.png";
static const lake = "${imagesPath}lake.png";
static const ic_bottom_01 = "${imagesPath}nav_01.png";
static const ic_bottom_02 = "${imagesPath}nav_02.png";
static const ic_bottom_03 = "${imagesPath}nav_03.png";
static const ic_bottom_03_true = "${imagesPath}nav_03_true.png";
static const ic_friend = "${imagesPath}ic_friend.png";
static const ic_prescription_home = "${imagesPath}ic_prescription_home.png";
}
\ No newline at end of file
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:netrain_flutter_app/xuehao/BottomNavpage.dart';
import 'package:netrain_flutter_app/xuehao/car_details.dart';
import 'package:netrain_flutter_app/common/AppColors.dart';
import 'package:netrain_flutter_app/xuehao/grid_page.dart';
......@@ -63,7 +64,8 @@ class MyApp extends StatelessWidget {
"car_details":(context) =>CarDetailsPage(),
"student":(context) => jssPageDemo(),
"car_details":(context) =>CarDetailsPage(),
"grid_page":(context) =>GridPage()
"grid_page":(context) =>GridPage(),
"bottom_page":(context) =>BottomNavPage(),
},
),
onWillPop: () async {
......@@ -119,7 +121,8 @@ class _RouterNavigatorState extends State<RouterNavigator> {
_item("listview页面",List_Page(),'listPage'),
_item("jssDemo", jssPageDemo(), 'firstVC'),
_item("jssDemo", jssPageDemo(), 'student'),
_item("gridView",GridPage(),'grid_page')
_item("gridView",GridPage(),'grid_page'),
_item("BottomNav",BottomNavPage(),'bottom_page'),
],
),
);
......
import 'package:flutter/material.dart';
import 'package:netrain_flutter_app/common/AppColors.dart';
import 'package:netrain_flutter_app/common/Images.dart';
/**
* @author xuehao
* on 2021/7/14
*/
class BottomNavPage extends StatefulWidget {
BottomNavPage({Key key}) : super(key: key);
@override
_BottomNavPageState createState() => _BottomNavPageState();
}
class _BottomNavPageState extends State<BottomNavPage> {
int _index = 0;
@override
Widget build(BuildContext context) {
List<BottomNavigationBarItem> _bottomNavigationbar = [
BottomNavigationBarItem(
title: Text("工作站"),
icon: Image.asset(Images.ic_bottom_01),
),
BottomNavigationBarItem(
title: Text("消息"),
icon: Image.asset(Images.ic_bottom_02),
),
BottomNavigationBarItem(
//显示的字样
title: Text("我的"),
//未选中时的图片
icon: Image.asset(Images.ic_bottom_03),
//选中后的图片
activeIcon: Image.asset(Images.ic_bottom_03_true),
),
];
List<Widget> _widgetItems = [
HomePage(),
MsgPage(),
UserCenter(),
];
return new MaterialApp(
title: "bottom_page",
home: Scaffold(
bottomNavigationBar: BottomNavigationBar(
items: _bottomNavigationbar,
type: BottomNavigationBarType.fixed,
currentIndex: _index,
onTap: (index) {
_changePage(index);
},
),
body: _widgetItems[_index]),
);
}
_changePage(int index) {
setState(() {
_index = index;
});
}
}
class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);
@override
_HomePageState createState() {
return _HomePageState();
}
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
elevation: 0,
backgroundColor: Color(AppColors.blue_bg_color),
title: Text(
"基本信息",
style: TextStyle(
fontSize: 16,
),
),
centerTitle: true,
leading: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(Icons.arrow_back_ios),
),
actions: [
Container(
margin: EdgeInsets.fromLTRB(0, 0, 10, 0),
alignment: Alignment.centerRight,
child: Text(
"稍后提交",
textAlign: TextAlign.center,
),
)
],
),
body: new Column(children: [
Container(
height: 80,
color: Color(AppColors.blue_bg_color),
child: Column(
children: [
Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(width: 54),
Container(
alignment: Alignment.center,
height: 22,
width: 22,
child: Text(
"1",
style: TextStyle(color: Color(AppColors.blue_bg_color)),
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(11.0),
color: Colors.white,
),
),
Spacer(),
Container(
alignment: Alignment.center,
height: 22,
width: 22,
child: Text(
"2",
style: TextStyle(color: Color(AppColors.blue_bg_color)),
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(11.0),
color: Color(AppColors.white_transparent_50),
),
),
Spacer(),
Container(
alignment: Alignment.center,
height: 22,
width: 22,
child: Text(
"3",
style: TextStyle(color: Color(AppColors.blue_bg_color)),
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(11.0),
color: Color(AppColors.white_transparent_50),
),
),
SizedBox(width: 54),
],
),
SizedBox(height: 8),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(width: 41),
Text(
"基本信息",
style: TextStyle(color: Colors.white, fontSize: 12),
),
Spacer(),
Text(
"提交证件",
style: TextStyle(
color: Color(AppColors.white_transparent_50),
fontSize: 12),
),
Spacer(),
Text(
"审核完毕",
style: TextStyle(
color: Color(AppColors.white_transparent_50),
fontSize: 12),
),
SizedBox(width: 41),
],
),
Spacer(),
],
),
),
Container(
margin: EdgeInsets.all(16),
padding: EdgeInsets.fromLTRB(0, 0, 0, 16),
decoration: BoxDecoration(
color: Color(AppColors.blue_bg_color2),
borderRadius: BorderRadius.circular(4.0),
),
child: Column(
children: [
Container(
child: Text(
"您完成所有认证资料,并完成互联网医院认证备案后,杏联医生工作室将为您提供以下功能:",
style: TextStyle(
fontSize: 12, color: Color(AppColors.text_default_color)),
),
margin: EdgeInsets.all(10),
),
Row(
children: <Widget>[
Expanded(
child: Container(
padding: EdgeInsets.fromLTRB(20, 0, 20, 0),
child: Row(
children: [
Column(
children: [
Text(
"邀请患者",
style: TextStyle(
fontSize: 16,
color: Color(AppColors.EditTextColor),
fontWeight: FontWeight.bold),
),
Text(
"专属二维码",
style: TextStyle(
color: Color(AppColors.text_default_color),
fontSize: 12
),
)
],
),
SizedBox(width: 16),
Image.asset(Images.ic_friend)
],
),
),
flex: 1,
),
Expanded(
child: Container(
child: Row(
children: [
Column(
children: [
Text(
"电子处方权",
style: TextStyle(
fontSize: 16,
color: Color(AppColors.EditTextColor),
fontWeight: FontWeight.bold),
),
Text(
"建立自己的诊室",
style: TextStyle(
color: Color(AppColors.text_default_color),
fontSize: 12
),
)
],
),
SizedBox(width: 16),
Image.asset(Images.ic_prescription_home)
],
),
),
flex: 1,
),
],
),
],
),
)
]),
);
}
}
class MsgPage extends StatefulWidget {
MsgPage({Key key}) : super(key: key);
@override
_MsgPageState createState() {
return _MsgPageState();
}
}
class _MsgPageState extends State<MsgPage> {
@override
Widget build(BuildContext context) {
return Center(
child: Text("消息"),
);
}
}
class UserCenter extends StatefulWidget {
UserCenter({Key key}) : super(key: key);
@override
_UserCenterState createState() {
return _UserCenterState();
}
}
class _UserCenterState extends State<UserCenter> {
@override
Widget build(BuildContext context) {
return Center(
child: Text("个人中心"),
);
}
}
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class CirclePainter extends CustomPainter {
@override
void paint(Canvas canvas, Size size) {
var paint = new Paint();
paint.isAntiAlias = true;
paint.strokeWidth = 0.0;
paint.color = Colors.white;
paint.invertColors = false;
canvas.drawCircle(
Offset(size.width / 2, size.height / 2), size.height / 2, paint);
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return true;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment