import 'package:flutter/material.dart';
class HomePage extends StatefulWidget {
final String title;
const HomePage({super.key, required this.title});
@override
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
children: [
Text(widget.title),
TextButton(
onPressed: () {
Navigator.of(context).pushNamed('/buttonpage');
},
child: const Text('go ')),
TextButton(
onPressed: () {
Navigator.push(context, MaterialPageRoute(builder: (context) {
return const HomePage(title: 'data-go');
}));
},
child: const Text('data-go')),
TextButton(
onPressed: () {
Navigator.push(
context,
PageRouteBuilder(
opaque: false,
pageBuilder: (context, animation, secondaryAnimation) {
return const HomePage(
title: 'more deatil - Navigator');
},
transitionsBuilder:
(context, animation, secondaryAnimation, child) {
return FadeTransition(
opacity: animation,
child: RotationTransition(
turns: Tween<double>(begin: 0.5, end: 1.0)
.animate(animation),
child: child,
),
);
},
));
},
child: const Text('more detail - Navigator')),
// FlatButton(child:const Text('data')),
],
),
),
);
}
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'web',
theme: ThemeData(primarySwatch: Colors.teal),
home: const HomePage(title: 'title'),
routes: <String, WidgetBuilder>{
'/buttonpage': (context) {
return const HomePage(title: '-button');
},
'/routepage': (context) {
return const HomePage(title: 'samples');
}
},
);
}
}
void main(List<String> args) {
runApp(const MyApp());
}
flutter 路由和动画
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 页面跳转动画是在开发中经常需要使用到的,根据经验撸了一个动画路由类: AnimationPageRoute. BU...
- 老孟导读:此篇文章是 Flutter 动画系列文章第四篇,本文介绍动画序列、共享动画、路由动画。 动画序列 Flu...
- fluro的页面切换函数 Router.navigateTo 支持11种不同效果的切换动画,支持延时设置和自定义切...