// Copyright 2014 The Flutter Authors. All rights reserved. // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. /// Flutter code sample for [Hero]. import 'package:flutter/material.dart'; import 'package:flutter/scheduler.dart'; void main() { // Slow down time to see Hero flight animation. timeDilation = 15.0; runApp(const HeroApp()); } class HeroApp extends StatelessWidget { const HeroApp({super.key}); @override Widget build(BuildContext context) { return const MaterialApp( home: HeroExample(), ); } } class HeroExample extends StatelessWidget { const HeroExample({super.key}); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: const Text('Hero Sample')), body: Column( children: [ ListTile( leading: Hero( tag: 'hero-default-tween', child: BoxWidget( size: const Size(50.0, 50.0), color:Colors.red[700]!.withOpacity(0.5), ), ), title: const Text( 'This red icon will use a default rect tween during the hero flight.', ), ), const SizedBox(height: 10.0), ListTile( leading: Hero( tag: 'hero-custom-tween', createRectTween: (Rect? begin, Rect? end) { return MaterialRectCenterArcTween(begin: begin, end: end); }, child: BoxWidget( size: const Size(50.0, 50.0), color:Colors.blue[700]!.withOpacity(0.5), ), ), title: const Text( 'This blue icon will use a custom rect tween during the hero flight.', ), ), const SizedBox(height: 10), ElevatedButton( onPressed: () => _gotoDetailsPage(context), child: const Text('Tap to trigger hero flight'), ), ], ), ); } void _gotoDetailsPage(BuildContext context) { Navigator.of(context).push(MaterialPageRoute( builder: (BuildContext context) => Scaffold( appBar: AppBar( title: const Text('Second Page'), ), body: Align( alignment: Alignment.bottomRight, child: Stack( children: [ Hero( tag: 'hero-custom-tween', createRectTween: (Rect? begin, Rect? end) { return MaterialRectCenterArcTween(begin: begin, end: end); }, child: BoxWidget( size: const Size(400.0, 400.0), color: Colors.blue[700]!.withOpacity(0.5), ), ), Hero( tag: 'hero-default-tween', child: BoxWidget( size: const Size(400.0, 400.0), color: Colors.red[700]!.withOpacity(0.5), ), ), ], ), ), ), )); } } class BoxWidget extends StatelessWidget { const BoxWidget({ super.key, required this.size, required this.color, }); final Size size; final Color color; @override Widget build(BuildContext context) { return Container( width: size.width, height: size.height, color: color, ); } }