Skip to content

F
Front-End
Unverified Commit cd6b2a35 authored by Taha Tesser's avatar Taha Tesser Committed by GitHub
Browse files
Options

Improve `Hero` examples (#103095)

parent 13d76b29
Hide whitespace changes
Inline Side-by-side
Showing with 100 additions and 85 deletions
examples/api/lib/widgets/heroes/hero.0.dart
View file @ cd6b2a35
......@@ -13,13 +13,8 @@ class HeroApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('Hero Sample')),
body: const Center(
child: HeroExample(),
),
),
return const MaterialApp(
home: HeroExample(),
);
}
}
......@@ -29,31 +24,24 @@ class HeroExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
const SizedBox(
height: 20.0,
),
ListTile(
leading: Hero(
tag: 'hero-rectangle',
child: _box(const Size(50, 50)),
),
onTap: () => _gotoDetailsPage(context),
title: const Text(
'Tap on the icon to view hero animation transition.',
return Scaffold(
appBar: AppBar(title: const Text('Hero Sample')),
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
const SizedBox(height: 20.0),
ListTile(
leading: const Hero(
tag: 'hero-rectangle',
child: BoxWidget(size: Size(50.0, 50.0)),
),
onTap: () => _gotoDetailsPage(context),
title: const Text(
'Tap on the icon to view hero animation transition.',
),
),
),
],
);
}
Widget _box(Size size) {
return Container(
width: size.width,
height: size.height,
color: Colors.blue,
],
),
);
}
......@@ -63,18 +51,28 @@ class HeroExample extends StatelessWidget {
appBar: AppBar(
title: const Text('Second Page'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Hero(
tag: 'hero-rectangle',
child: _box(const Size(200, 200)),
),
],
body: const Center(
child: Hero(
tag: 'hero-rectangle',
child: BoxWidget(size: Size(200.0, 200.0)),
),
),
),
));
}
}
class BoxWidget extends StatelessWidget {
const BoxWidget({Key? key, required this.size}) : super(key: key);
final Size size;
@override
Widget build(BuildContext context) {
return Container(
width: size.width,
height: size.height,
color: Colors.blue,
);
}
}
examples/api/lib/widgets/heroes/hero.1.dart
View file @ cd6b2a35
......@@ -18,13 +18,8 @@ class HeroApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('Hero Sample')),
body: const Center(
child: HeroExample(),
),
),
return const MaterialApp(
home: HeroExample(),
);
}
}
......@@ -34,43 +29,45 @@ class HeroExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
children: <Widget>[
ListTile(
leading: Hero(
tag: 'hero-default-tween',
child: _box(size: 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.',
return Scaffold(
appBar: AppBar(title: const Text('Hero Sample')),
body: Column(
children: <Widget>[
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: _box(size: 50.0, color: Colors.blue[700]!.withOpacity(0.5)),
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.',
),
),
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'),
),
),
const SizedBox(height: 10),
ElevatedButton(
onPressed: () => _gotoDetailsPage(context),
child: const Text('Tap to trigger hero flight'),
),
],
);
}
Widget _box({double? size, Color? color}) {
return Container(
color: color,
child: FlutterLogo(size: size),
],
),
);
}
......@@ -89,15 +86,15 @@ class HeroExample extends StatelessWidget {
createRectTween: (Rect? begin, Rect? end) {
return MaterialRectCenterArcTween(begin: begin, end: end);
},
child: _box(
size: 400.0,
child: BoxWidget(
size: const Size(400.0, 400.0),
color: Colors.blue[700]!.withOpacity(0.5),
),
),
Hero(
tag: 'hero-default-tween',
child: _box(
size: 400.0,
child: BoxWidget(
size: const Size(400.0, 400.0),
color: Colors.red[700]!.withOpacity(0.5),
),
),
......@@ -108,3 +105,23 @@ class HeroExample extends StatelessWidget {
));
}
}
class BoxWidget extends StatelessWidget {
const BoxWidget({
Key? key,
required this.size,
required this.color,
}) : super(key: key);
final Size size;
final Color color;
@override
Widget build(BuildContext context) {
return Container(
width: size.width,
height: size.height,
color: color,
);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

HIAST - GitLab