Scaffold
Scaffold
appBar导航栏
body主体内容
bottomNavigationBar底部导航栏
floatingActionButton悬浮按钮
import 'package:flutter/material.dart';
import 'package:flutter_ahello_world/MyIcon.dart';
import 'pages/BusPage.dart';
import 'pages/MyPage.dart';
import 'pages/PlanePage.dart';
void main()=>runApp(MyApp());
class MyApp extends StatelessWidget{
@override
Widget build(BuildContext context) {
//TODO: implement build
return MaterialApp(
title: "flutter",
home: MyStateWidget(),
);
}
}
class MyStateWidget extends StatefulWidget{
@override
State createState() {
//TODO: implement createState
return _MyStateWidget();
}
}
class _MyStateWidget extends State{
int _currentIndex=0;
List pageList=[
BusPage(),
PlanePage(),
MyPage()
];
@override
Widget build(BuildContext context) {
//TODO: implement build
return Scaffold(
appBar: AppBar(
title:Text("第一个标题"),
actions: [
IconButton(icon: Icon(MyIcon.xiaomi), onPressed: ()=>{
print("11111")
})
],
),
body: this.pageList[this._currentIndex],
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(icon: Icon(Icons.airport_shuttle),title: Text("汽车")),
BottomNavigationBarItem(icon: Icon(Icons.airplanemode_active),title: Text("飞机")),
BottomNavigationBarItem(icon: Icon(Icons.assignment_ind),title: Text("我的")),
],
currentIndex:this._currentIndex ,
onTap: (index){
print(index);
setState(() {
this._currentIndex=index;
});
},
),
//悬浮按钮
floatingActionButton: FloatingActionButton(
child:Icon(Icons.add),
onPressed: (){
print("2222222");
},
),
);
}
}
选项卡效果
class _BusPageState extends State with SingleTickerProviderStateMixin {
List _tabs = [
"金杯",
"奔弛",
"丰田",
];
TabController _controller;
@override
void initState() {
//TODO: implement initState
super.initState();
//vsync不报错需要 with SingleTickerProviderStateMixin
this._controller = TabController(length: _tabs.length, vsync: this);
}
@override
Widget build(BuildContext context) {
return Column(
children: [
//选项卡区域
Container(
child: TabBar(
// controller控制切换 TabBar和TabBarView共用同一个controller
controller: _controller,
// tabs对应一个数组
tabs: _tabs.map((e) => Tab(text: e)).toList(),
),
color: Colors.pink,
),
//内容区
Container(
height: 400,
child: TabBarView(
// controller控制切换
controller: _controller,
children: _tabs
.map((e) => Container(
child: Text(e),
))
.toList(),
),
)
],
);
}
}
抽屉
1、在appBar里面写leading
// leading代表最左边的按钮
//通过key属性 _globalKey.currentState.openDrawer()打开抽屉
leading: IconButton(icon: Icon(Icons.dashboard), onPressed: (){
_globalKey.currentState.openDrawer();
}),
2、key属性声明
GlobalKey _globalKey=new GlobalKey();
3、声明drawer
左侧抽屉
drawer: Container(
width: 300,
color: Colors.yellow,
child: Column(
children: [
Text("1"),
Text("2"),
Text("3"),
],
),
),
指针
//从子到父冒泡 flutter不能阻止冒泡
onPointerDown: (e){
print("down");
},
onPointerUp: (e){
print("up");
},
onPointerMove: (e){
print("move");
},
onPointerCancel: (e){
print("cancel");
},
