Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add
AnimatedIcons
previews and examples (#113700)
- Loading branch information
1 parent
9bdd50a
commit 8815f60
Showing
7 changed files
with
283 additions
and
11 deletions.
There are no files selected for viewing
71 changes: 71 additions & 0 deletions
71
examples/api/lib/material/animated_icon/animated_icon.0.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
// 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 [AnimatedIcon]. | ||
import 'package:flutter/material.dart'; | ||
|
||
void main() { | ||
runApp(const AnimatedIconApp()); | ||
} | ||
|
||
class AnimatedIconApp extends StatelessWidget { | ||
const AnimatedIconApp({super.key}); | ||
|
||
@override | ||
Widget build(BuildContext context) { | ||
return MaterialApp( | ||
theme: ThemeData( | ||
colorSchemeSeed: const Color(0xff6750a4), | ||
useMaterial3: true, | ||
), | ||
home: const Scaffold( | ||
body: AnimatedIconExample(), | ||
), | ||
); | ||
} | ||
} | ||
|
||
class AnimatedIconExample extends StatefulWidget { | ||
const AnimatedIconExample({super.key}); | ||
|
||
@override | ||
State<AnimatedIconExample> createState() => _AnimatedIconExampleState(); | ||
} | ||
|
||
class _AnimatedIconExampleState extends State<AnimatedIconExample> with SingleTickerProviderStateMixin { | ||
late AnimationController controller; | ||
late Animation<double> animation; | ||
|
||
@override | ||
void initState() { | ||
super.initState(); | ||
controller = AnimationController( | ||
vsync: this, | ||
duration: const Duration(seconds: 2), | ||
)..forward() | ||
..repeat(reverse: true); | ||
animation = Tween<double>(begin: 0.0, end: 1.0).animate(controller); | ||
} | ||
|
||
@override | ||
void dispose() { | ||
controller.dispose(); | ||
super.dispose(); | ||
} | ||
|
||
@override | ||
Widget build(BuildContext context) { | ||
return Scaffold( | ||
body: Center( | ||
child: AnimatedIcon( | ||
icon: AnimatedIcons.menu_arrow, | ||
progress: animation, | ||
size: 72.0, | ||
semanticLabel: 'Show menu', | ||
), | ||
), | ||
); | ||
} | ||
} |
104 changes: 104 additions & 0 deletions
104
examples/api/lib/material/animated_icon/animated_icon.1.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,104 @@ | ||
// 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 [AnimatedIcon]. | ||
import 'package:flutter/material.dart'; | ||
|
||
final Map<String, AnimatedIconData> iconsList = <String, AnimatedIconData>{ | ||
'add_event': AnimatedIcons.add_event, | ||
'arrow_menu': AnimatedIcons.arrow_menu, | ||
'close_menu': AnimatedIcons.close_menu, | ||
'ellipsis_search': AnimatedIcons.ellipsis_search, | ||
'event_add': AnimatedIcons.event_add, | ||
'home_menu': AnimatedIcons.home_menu, | ||
'list_view': AnimatedIcons.list_view, | ||
'menu_arrow': AnimatedIcons.menu_arrow, | ||
'menu_close': AnimatedIcons.menu_close, | ||
'menu_home': AnimatedIcons.menu_home, | ||
'pause_play': AnimatedIcons.pause_play, | ||
'play_pause': AnimatedIcons.play_pause, | ||
'search_ellipsis': AnimatedIcons.search_ellipsis, | ||
'view_list': AnimatedIcons.view_list, | ||
}; | ||
|
||
void main() { | ||
runApp(const AnimatedIconApp()); | ||
} | ||
|
||
class AnimatedIconApp extends StatelessWidget { | ||
const AnimatedIconApp({super.key}); | ||
|
||
@override | ||
Widget build(BuildContext context) { | ||
return MaterialApp( | ||
theme: ThemeData( | ||
colorSchemeSeed: const Color(0xff6750a4), | ||
useMaterial3: true, | ||
), | ||
home: const Scaffold( | ||
body: AnimatedIconExample(), | ||
), | ||
); | ||
} | ||
} | ||
|
||
class AnimatedIconExample extends StatefulWidget { | ||
const AnimatedIconExample({super.key}); | ||
|
||
@override | ||
State<AnimatedIconExample> createState() => _AnimatedIconExampleState(); | ||
} | ||
|
||
class _AnimatedIconExampleState extends State<AnimatedIconExample> with SingleTickerProviderStateMixin { | ||
late AnimationController controller; | ||
late Animation<double> animation; | ||
|
||
@override | ||
void initState() { | ||
super.initState(); | ||
controller = AnimationController( | ||
vsync: this, | ||
duration: const Duration(seconds: 2), | ||
)..forward() | ||
..repeat(reverse: true); | ||
animation = Tween<double>(begin: 0.0, end: 1.0).animate(controller); | ||
} | ||
|
||
@override | ||
void dispose() { | ||
controller.dispose(); | ||
super.dispose(); | ||
} | ||
|
||
@override | ||
Widget build(BuildContext context) { | ||
return Scaffold( | ||
body: GridView( | ||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( | ||
crossAxisCount: 4, | ||
), | ||
children: iconsList.entries.map((MapEntry<String, AnimatedIconData> entry) { | ||
return Card( | ||
child: Center( | ||
child: Column( | ||
mainAxisAlignment: MainAxisAlignment.center, | ||
children: <Widget>[ | ||
AnimatedIcon( | ||
icon: entry.value, | ||
progress: animation, | ||
size: 72.0, | ||
semanticLabel: entry.key, | ||
), | ||
const SizedBox(height: 8.0), | ||
Text(entry.key), | ||
], | ||
), | ||
), | ||
); | ||
}).toList(), | ||
), | ||
); | ||
} | ||
} |
31 changes: 31 additions & 0 deletions
31
examples/api/test/material/animated_icon/animated_icon.0_test.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
// 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. | ||
|
||
import 'package:flutter/material.dart'; | ||
import 'package:flutter_api_samples/material/animated_icon/animated_icon.0.dart' | ||
as example; | ||
import 'package:flutter_test/flutter_test.dart'; | ||
|
||
void main() { | ||
testWidgets('AnimatedIcon animates', (WidgetTester tester) async { | ||
await tester.pumpWidget( | ||
const example.AnimatedIconApp(), | ||
); | ||
|
||
// Test the AnimatedIcon size. | ||
final Size iconSize = tester.getSize(find.byType(AnimatedIcon)); | ||
expect(iconSize.width, 72.0); | ||
expect(iconSize.height, 72.0); | ||
|
||
// Check if AnimatedIcon is animating. | ||
await tester.pump(const Duration(milliseconds: 500)); | ||
AnimatedIcon animatedIcon = tester.widget(find.byType(AnimatedIcon)); | ||
expect(animatedIcon.progress.value, 0.25); | ||
|
||
// Check if animation is completed. | ||
await tester.pump(const Duration(milliseconds: 1500)); | ||
animatedIcon = tester.widget(find.byType(AnimatedIcon)); | ||
expect(animatedIcon.progress.value, 1.0); | ||
}); | ||
} |
34 changes: 34 additions & 0 deletions
34
examples/api/test/material/animated_icon/animated_icon.1_test.dart
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
// 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. | ||
|
||
import 'package:flutter/material.dart'; | ||
import 'package:flutter_api_samples/material/animated_icon/animated_icon.1.dart' | ||
as example; | ||
import 'package:flutter_test/flutter_test.dart'; | ||
|
||
void main() { | ||
testWidgets('Show all the animated icons', (WidgetTester tester) async { | ||
await tester.pumpWidget( | ||
const example.AnimatedIconApp(), | ||
); | ||
|
||
// Check if the total number of AnimatedIcons matches the icons list. | ||
expect(find.byType(AnimatedIcon, skipOffstage: false), findsNWidgets(example.iconsList.length)); | ||
|
||
// Test the AnimatedIcon size. | ||
final Size iconSize = tester.getSize(find.byType(AnimatedIcon).first); | ||
expect(iconSize.width, 72.0); | ||
expect(iconSize.height, 72.0); | ||
|
||
// Check if AnimatedIcon is animating. | ||
await tester.pump(const Duration(milliseconds: 500)); | ||
AnimatedIcon animatedIcon = tester.widget(find.byType(AnimatedIcon).first); | ||
expect(animatedIcon.progress.value, 0.25); | ||
|
||
// Check if animation is completed. | ||
await tester.pump(const Duration(milliseconds: 1500)); | ||
animatedIcon = tester.widget(find.byType(AnimatedIcon).first); | ||
expect(animatedIcon.progress.value, 1.0); | ||
}); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters