1: MaterialApp 内节点增加routes:{
key:(BuildContext context)=>StateFulWidget(),
key:(BuildContext context)=>StateFulWidget(),
}
ps:这里不能用StateLessWidget,不然点击返回 ,存在一个黑屏页面,本身StateFulWidget 已经是一层了.
2: 事件,例如 onTap 函数内启动路由跳转
路由名跳转:
Navigator.pushNamed(context, routeName)
路由跳转:
Navigator.push(
context, MaterialPageRoute(builder: (context) => page))
完整代码如下:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'Gesture.dart';
import 'StateFul.dart';
import 'flutter_layout.dart';
main() => runApp(Record());
class Record extends StatelessWidget {
const Record({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "回顾总结",
home: RecordPage(),
routes: {
"gesture": (BuildContext con) => GestruePage(),
"ful2": (BuildContext con) => FulPage2(),
"ful": (BuildContext con) => FulPage(),
},
);
}
}
class RecordPage extends StatefulWidget {
const RecordPage({Key key}) : super(key: key);
@override
_RecordPageState createState() => _RecordPageState();
}
class _RecordPageState extends State<RecordPage> {
bool isRouterNameStart = true;
double m_X = 0;
double m_y = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("路由首页"),
centerTitle: true,
leading: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Image(
image: AssetImage("images/me_record.jpeg"),
),
),
),
body: Column(
children: [
SwitchListTile(
value: isRouterNameStart,
onChanged: (s) {
setState(() {
isRouterNameStart = s;
});
}),
item(context, "手势", GestruePage(), "gesture"),
item(context, "StateFulWidget学习", FulPage2(), "ful2"),
item(context, "Ful学习", FulPage(), "ful"),
Expanded(
child: FractionallySizedBox(
widthFactor: 1,
child: Stack(
children: [
GestureDetector(
onPanUpdate: (e) {
setState(() {
m_X += e.delta.dx;
m_y += e.delta.dy;
});
},
child: Container(
width: 1000,
color: Colors.yellow,
height: 1000,
child: Center(
child: Text("描点"),
),
),
),
Positioned(
left: m_X,
top: m_y,
child: Container(
width: 40,
height: 40,
child: PhysicalModel(
color: Colors.red,
borderRadius: BorderRadius.circular(20),
child: Center(
child: Text(
"移动",
style: TextStyle(color: Colors.white),
),
),
),
))
],
),
))
],
),
);
}
Widget item(BuildContext context, String s, page, routeName) =>
GestureDetector(
child: RaisedButton(
child: Text(s),
),
onTap: () {
isRouterNameStart
? Navigator.pushNamed(context, routeName)
: Navigator.push(
context, MaterialPageRoute(builder: (context) => page));
},
);
}
import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
main() => runApp(Gestrue());
class Gestrue extends StatelessWidget {
const Gestrue({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "手势学习",
home: GestruePage(),
theme: ThemeData(backgroundColor: Colors.blueAccent),
);
}
}
class GestruePage extends StatefulWidget {
const GestruePage({Key key}) : super(key: key);
@override
_GestruePageState createState() => _GestruePageState();
}
class _GestruePageState extends State<GestruePage> {
String msg = "man";
double moveX = 0;
double moveY = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("手势"),
leading: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(Icons.arrow_back),
),
),
body: GestureDetector(
onTap: () {
setState(() {
msg = "点击事件";
print('$msg');
});
},
onLongPress: () {
setState(() {
msg = "长按事件";
print('$msg');
});
},
onDoubleTap: () {
setState(() {
msg = "双按事件";
print('$msg');
});
},
onTapDown: (e) {
setState(() {
msg = "按下事件";
print('$msg');
});
},
onTapUp: (e) {
setState(() {
msg = "松开事件";
print('$msg');
});
},
onTapCancel: () {
setState(() {
msg = "取消事件";
print('$msg');
});
},
child: Stack(
children: [
FractionallySizedBox(
widthFactor: 1,
heightFactor: 1,
child: Container(
padding: EdgeInsets.all(100),
color: Colors.red,
child: GestureDetector(
onPanUpdate: (e) {
//手势拖动
setState(() {
moveX += e.delta.dx;
moveY += e.delta.dy;
});
},
child: Text(msg),
),
),
),
Positioned(
child: Container(
width: 40,
height: 40,
child: PhysicalModel(
borderRadius: BorderRadius.circular(20),
color: Colors.green,
child: Center(
child: Text(
"data",
style: TextStyle(color: Colors.white),
),
),
),
),
left: moveX,
top: moveY,
),
],
)),
);
}
}
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
main() => runApp(new FUlAPP());
class FUlAPP extends StatelessWidget {
const FUlAPP({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'ful study',
home: FulPage2(),
);
}
}
class FulPage2 extends StatefulWidget {
const FulPage2({Key key}) : super(key: key);
@override
_FUlAPPState createState() => _FUlAPPState();
}
class _FUlAPPState extends State<FulPage2> {
int currentIndex = 0;
String msg = "ful 学习 hi~";
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: Text('FUl'),
),
body: currentIndex == 0
? RefreshIndicator(
child: ListView(
children: [
Container(
child: Column(
children: <Widget>[
Text("张三"),
Text("李四"),
Text("王五"),
Text("赵六"),
Image.network(
"https://img4.sycdn.imooc.com/60a1d2510001869810801440-140-140.jpg",
width: 200,
height: 200,
),
TextField(
decoration: InputDecoration(
hintText: "请输入描述~",
hintStyle:
TextStyle(color: Colors.grey, fontSize: 16),
contentPadding: EdgeInsets.fromLTRB(10, 0, 10, 0),
),
style: TextStyle(color: Colors.blue ),
)
],
),
)
],
),
onRefresh: handlerRefresh)
: Text(msg),
bottomNavigationBar: BottomNavigationBar(
currentIndex: currentIndex,
onTap: (position) {
setState(() {
currentIndex = position;
msg =
currentIndex == 0 ? " ful 学习 hi~ " : " welcome to list page";
});
},
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home, color: Colors.grey),
title: Text("首页"),
activeIcon: Icon(Icons.home_outlined, color: Colors.blue)),
BottomNavigationBarItem(
icon: Icon(Icons.contact_mail, color: Colors.grey),
title: Text("我的"),
activeIcon: Icon(Icons.contact_mail, color: Colors.blue))
],
),
floatingActionButton: FloatingActionButton(
child: Text("你好"),
onPressed: () {
setState(() {
msg = currentIndex == 0
? " 首页 ful 学习 hi~ "
: "hi~ welcome to list page";
});
},
),
);
}
Future<Null> handlerRefresh() async {
await Future.delayed(Duration(milliseconds: 200));
return null;
}
}
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
main() => runApp(new FUl_APP());
class FUl_APP extends StatelessWidget {
const FUl_APP({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'ful layout',
home: FulPage(),
);
}
}
class FulPage extends StatefulWidget {
const FulPage({Key key}) : super(key: key);
@override
_FUlAPPState createState() => _FUlAPPState();
}
class _FUlAPPState extends State<FulPage> {
int currentIndex = 0;
String msg = "ful 学习 hi~";
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
leading: GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(Icons.arrow_back),
),
centerTitle: true,
title: Text('FUl'),
),
body: currentIndex == 0
? RefreshIndicator(
child: ListView(
children: [
Container(
child: Column(
children: <Widget>[
Row(
children: [
ClipOval(
child: SizedBox(
child: Image.network(
"https://img4.sycdn.imooc.com/60a1d2510001869810801440-140-140.jpg",
width: 200,
height: 200,
),
),
),
Padding(
padding: EdgeInsets.all(3),
child: ClipRRect(
borderRadius:
BorderRadius.all(Radius.circular(10)),
child: Opacity(
opacity: 0.3,
child: Image.network(
"https://img4.sycdn.imooc.com/60a1d2510001869810801440-140-140.jpg",
width: 100,
height: 100,
),
),
),
)
],
),
Text("张三"),
Text("李四"),
Text("王五"),
Text("赵六"),
Container(
width: 200,
height: 200,
color: Colors.blue,
alignment: Alignment.center,
child: PageView(
children: [
Image.network(
"http://www.devio.org/img/avatar.png",
),
Text(
"PageView 2",
style: TextStyle(),
)
],
),
),
TextField(
decoration: InputDecoration(
hintText: "请输入描述~",
hintStyle:
TextStyle(color: Colors.grey, fontSize: 16),
contentPadding: EdgeInsets.fromLTRB(10, 0, 10, 0),
),
style: TextStyle(color: Colors.blue),
)
],
),
)
],
),
onRefresh: handlerRefresh)
: Text(msg),
bottomNavigationBar: BottomNavigationBar(
currentIndex: currentIndex,
onTap: (position) {
setState(() {
currentIndex = position;
msg =
currentIndex == 0 ? " ful 学习 hi~ " : " welcome to list page";
});
},
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home, color: Colors.grey),
title: Text("首页"),
activeIcon: Icon(Icons.home_outlined, color: Colors.blue)),
BottomNavigationBarItem(
icon: Icon(Icons.contact_mail, color: Colors.grey),
title: Text("我的"),
activeIcon: Icon(Icons.contact_mail, color: Colors.blue))
],
),
floatingActionButton: FloatingActionButton(
child: Text("你好"),
onPressed: () {
setState(() {
msg = currentIndex == 0
? " 首页 ful 学习 hi~ "
: "hi~ welcome to list page";
});
},
),
);
}
Future<Null> handlerRefresh() async {
await Future.delayed(Duration(milliseconds: 200));
return null;
}
}