From 81e693a7fe3b808cc9ae2bb3a2cbe404e67ec773 Mon Sep 17 00:00:00 2001 From: Michael Goderbauer Date: Tue, 24 Sep 2019 12:38:45 -0700 Subject: [PATCH] Add Sample code to SlideTransition (#41009) --- dev/snippets/config/templates/README.md | 5 +++ ...widget_scaffold_center_freeform_state.tmpl | 38 ++++++++++++++++ .../flutter/lib/src/widgets/transitions.dart | 45 +++++++++++++++++++ 3 files changed, 88 insertions(+) create mode 100644 dev/snippets/config/templates/stateful_widget_scaffold_center_freeform_state.tmpl diff --git a/dev/snippets/config/templates/README.md b/dev/snippets/config/templates/README.md index 1c1664cdae..3aad9ebceb 100644 --- a/dev/snippets/config/templates/README.md +++ b/dev/snippets/config/templates/README.md @@ -101,6 +101,11 @@ follows: `stateful_widget_scaffold`, except that it wraps the stateful widget with a `Scaffold` _and_ a `Center`. +- [`stateful_widget_scaffold_center_freeform_state`](stateful_widget_scaffold_center_freeform_state.tmpl) : + Similar to `stateful_widget_scaffold_center` except that the code block has + to contain the entire state class defined as: + `class _MyStatefulWidgetState extends State` + - [`stateless_widget_scaffold`](stateless_widget_scaffold.tmpl) : Similar to `stateless_widget_material`, except that it wraps the stateless widget with a `Scaffold`. diff --git a/dev/snippets/config/templates/stateful_widget_scaffold_center_freeform_state.tmpl b/dev/snippets/config/templates/stateful_widget_scaffold_center_freeform_state.tmpl new file mode 100644 index 0000000000..783630ac19 --- /dev/null +++ b/dev/snippets/config/templates/stateful_widget_scaffold_center_freeform_state.tmpl @@ -0,0 +1,38 @@ +// Flutter code sample for {{id}} + +{{description}} + +import 'package:flutter/material.dart'; + +{{code-imports}} + +void main() => runApp(new MyApp()); + +/// This Widget is the main application widget. +class MyApp extends StatelessWidget { + static const String _title = 'Flutter Code Sample'; + + @override + Widget build(BuildContext context) { + return MaterialApp( + title: _title, + home: Scaffold( + appBar: AppBar(title: const Text(_title)), + body: Center( + child: MyStatefulWidget(), + ), + ), + ); + } +} + +{{code-preamble}} + +class MyStatefulWidget extends StatefulWidget { + MyStatefulWidget({Key key}) : super(key: key); + + @override + _MyStatefulWidgetState createState() => _MyStatefulWidgetState(); +} + +{{code}} diff --git a/packages/flutter/lib/src/widgets/transitions.dart b/packages/flutter/lib/src/widgets/transitions.dart index 3c6dff21b2..41ed4b716f 100644 --- a/packages/flutter/lib/src/widgets/transitions.dart +++ b/packages/flutter/lib/src/widgets/transitions.dart @@ -194,6 +194,51 @@ class _AnimatedState extends State { /// animated by a [CurvedAnimation] set to [Curves.elasticIn]: /// {@animation 300 378 https://flutter.github.io/assets-for-api-docs/assets/widgets/slide_transition.mp4} /// +/// {@tool snippet --template=stateful_widget_scaffold_center_freeform_state} +/// The following code implements the [SlideTransition] as seen in the video +/// above: +/// +/// ```dart +/// class _MyStatefulWidgetState extends State with SingleTickerProviderStateMixin { +/// AnimationController _controller; +/// Animation _offsetAnimation; +/// +/// @override +/// void initState() { +/// super.initState(); +/// _controller = AnimationController( +/// duration: const Duration(seconds: 2), +/// vsync: this, +/// )..repeat(reverse: true); +/// _offsetAnimation = Tween( +/// begin: Offset.zero, +/// end: const Offset(1.5, 0.0), +/// ).animate(CurvedAnimation( +/// parent: _controller, +/// curve: Curves.elasticIn, +/// )); +/// } +/// +/// @override +/// void dispose() { +/// super.dispose(); +/// _controller.dispose(); +/// } +/// +/// @override +/// Widget build(BuildContext context) { +/// return SlideTransition( +/// position: _offsetAnimation, +/// child: const Padding( +/// padding: EdgeInsets.all(8.0), +/// child: FlutterLogo(size: 150.0), +/// ), +/// ); +/// } +/// } +/// ``` +/// {@end-tool} +/// /// See also: /// /// * [AlignTransition], an animated version of an [Align] that animates its