1// Copyright 2014 The Flutter Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5import 'package:flutter/material.dart';
6import 'package:flutter/scheduler.dart';
7
8/// Flutter code sample for [Hero].
9
10void main() {
11 // Slow down time to see Hero flight animation.
12 timeDilation = 15.0;
13 runApp(const HeroApp());
14}
15
16class HeroApp extends StatelessWidget {
17 const HeroApp({super.key});
18
19 @override
20 Widget build(BuildContext context) {
21 return const MaterialApp(home: HeroExample());
22 }
23}
24
25class HeroExample extends StatelessWidget {
26 const HeroExample({super.key});
27
28 @override
29 Widget build(BuildContext context) {
30 return Scaffold(
31 appBar: AppBar(title: const Text('Hero Sample')),
32 body: Column(
33 children: <Widget>[
34 ListTile(
35 leading: Hero(
36 tag: 'hero-default-tween',
37 child: BoxWidget(
38 size: const Size(50.0, 50.0),
39 color: Colors.red[700]!.withOpacity(0.5),
40 ),
41 ),
42 title: const Text(
43 'This red icon will use a default rect tween during the hero flight.',
44 ),
45 ),
46 const SizedBox(height: 10.0),
47 ListTile(
48 leading: Hero(
49 tag: 'hero-custom-tween',
50 createRectTween: (Rect? begin, Rect? end) {
51 return MaterialRectCenterArcTween(begin: begin, end: end);
52 },
53 child: BoxWidget(
54 size: const Size(50.0, 50.0),
55 color: Colors.blue[700]!.withOpacity(0.5),
56 ),
57 ),
58 title: const Text(
59 'This blue icon will use a custom rect tween during the hero flight.',
60 ),
61 ),
62 const SizedBox(height: 10),
63 ElevatedButton(
64 onPressed: () => _gotoDetailsPage(context),
65 child: const Text('Tap to trigger hero flight'),
66 ),
67 ],
68 ),
69 );
70 }
71
72 void _gotoDetailsPage(BuildContext context) {
73 Navigator.of(context).push(
74 MaterialPageRoute<void>(
75 builder:
76 (BuildContext context) => Scaffold(
77 appBar: AppBar(title: const Text('Second Page')),
78 body: Align(
79 alignment: Alignment.bottomRight,
80 child: Stack(
81 children: <Widget>[
82 Hero(
83 tag: 'hero-custom-tween',
84 createRectTween: (Rect? begin, Rect? end) {
85 return MaterialRectCenterArcTween(begin: begin, end: end);
86 },
87 child: BoxWidget(
88 size: const Size(400.0, 400.0),
89 color: Colors.blue[700]!.withOpacity(0.5),
90 ),
91 ),
92 Hero(
93 tag: 'hero-default-tween',
94 child: BoxWidget(
95 size: const Size(400.0, 400.0),
96 color: Colors.red[700]!.withOpacity(0.5),
97 ),
98 ),
99 ],
100 ),
101 ),
102 ),
103 ),
104 );
105 }
106}
107
108class BoxWidget extends StatelessWidget {
109 const BoxWidget({super.key, required this.size, required this.color});
110
111 final Size size;
112 final Color color;
113
114 @override
115 Widget build(BuildContext context) {
116 return Container(width: size.width, height: size.height, color: color);
117 }
118}
119

Provided by KDAB

Privacy Policy
Learn more about Flutter for embedded and desktop on industrialflutter.com