class App extends StatelessWidget {
@override //重写父类
Widget build(BuildContext context) {
return MaterialApp( //Material风格app
debugShowCheckedModeBanner: false, //关闭状态栏debug
home: Home(),
theme: ThemeData( //主题
primaryColor: color(0x0075b8), //主题颜色
highlightColor: color(0xffffff, a: 0.4), //高亮颜色
splashColor: color(0xffffff, a: 0.6), //水波颜色
),
);
}
}
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return DefaultTabController( //TabBar和TabBarView的控制器,它是关联这两个组件的桥梁
length: 3,
child: Scaffold( //脚手架组件
appBar: AppBar( //显示在界面顶部的一个AppBar
title: Center(
child: Text(
"首页",
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.w900,
color: color(0xffffff),
),
),
),
leading: IconButton( //标题前面显示的一个组件
icon: Icon(Icons.menu),
tooltip: "Navigration",
onPressed: () => debugPrint("Navigration"),
),
actions: <Widget>[ //一个Widget列表一般放按钮
IconButton(
icon: Icon(Icons.search),
tooltip: "search",
onPressed: () => debugPrint("search"),
)
],
elevation: 4, //bar阴影默认4
bottom: TabBar( //ab页的选项组件,默认为水平排列。
unselectedLabelColor: color(0xffffff, a: 0.5),
indicatorColor: color(0xffffff),
indicatorSize: TabBarIndicatorSize.label,
indicatorWeight: 2,
tabs: <Widget>[ //Tab选项列表
Tab(icon: Icon(Icons.local_florist)),
Tab(icon: Icon(Icons.change_history)),
Tab(icon: Icon(Icons.directions_bike)),
],
),
),
body: TabBarView( //ab页的内容容器,Tab页内容一般处理为随选项卡的改变而改变
children: <Widget>[
Icon(Icons.local_florist, size: 100, color: color(0x0075b8)),
Icon(Icons.change_history, size: 100, color: color(0x0075b8)),
Icon(Icons.directions_bike, size: 100, color: color(0x0075b8)),
],
),
bottomNavigationBar: BottomBar()),
),
);
}
}
class _BottomBar extends State<BottomBar> {
int _currentIndex = 0;
void _bottomTap(int index) {
setState(() {
_currentIndex = index;
});
}
@override
Widget build(BuildContext context) {
return BottomNavigationBar(
type: BottomNavigationBarType.fixed,
selectedItemColor: color(0x00000),
unselectedItemColor: color(0x999999),
currentIndex: _currentIndex,
onTap: _bottomTap,
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text("home"),
),
BottomNavigationBarItem(
icon: Icon(Icons.domain),
title: Text("domain"),
),
BottomNavigationBarItem(
icon: Icon(Icons.people_outline),
title: Text("people_outline"),
),
],
);
}
}
Color color(int rgb, {double a = 1}) {
if (a < 0) {
a = 0;
} else if (a > 1) {
a = 1;
}
return Color.fromRGBO(
(rgb & 0xFF0000) >> 16,
(rgb & 0x00FF00) >> 8,
(rgb & 0x0000FF) >> 0,
a,
);
}
版权属于:
cicaba
作品采用:
《
署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)
》许可协议授权
评论 (0)