Flutter如何使用路由以及导航
·

import 'package:flutter/material.dart';
import 'package:flutterapp/KlineChartActivity.dart';
import 'package:flutterapp/stateful_learn.dart';
import 'package:flutterapp/stateless_learn.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter主页',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Scaffold(
appBar: AppBar(
title: Text("如何创建flutter路由以及导航"),
),
body: RouterNavigator(),
),
//页面配置信息
routes: {
"stateLess": (BuildContext context) => StateLessLearn(),
"stateFul": (BuildContext context) => StatefulLearn(),
"kline": (BuildContext context) => Klinechart(),
},
);
}
}
class RouterNavigator extends StatefulWidget {
@override
_RouterNavigatorState createState() => _RouterNavigatorState();
}
bool byName = false;
class _RouterNavigatorState extends State<RouterNavigator> {
@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: <Widget>[
//点击选择切换
SwitchListTile(
value: byName, onChanged: (value) { //监听变化
setState(() {//发生变化后赋值给byName
byName=value;
});
},
title: Text("${byName?'':'不'}通过路由进行跳转"),
),
_item("跳转到stateLess页面", StateLessLearn(), "stateLess"),
_item("跳转到stateFul页面", StatefulLearn(), "stateFul"),
_item("跳转到kline页面", Klinechart(), "kline"),
],
),
);
}
_item(String titleText,Widget route, String routerName) {
return Container(
child: RaisedButton(
onPressed: () {//点击事件
if(byName){
Navigator.pushNamed(context, routerName);
}else{
Navigator.push(context, MaterialPageRoute(builder: (context)=>route));
}
},
child: Text(titleText),
),
);
}
}
更多推荐


所有评论(0)