flutter 路由和动画

2022-05-24  本文已影响0人  feitry
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());
}

上一篇 下一篇

猜你喜欢

热点阅读