mirror of
https://github.com/flutter/flutter.git
synced 2025-06-03 00:51:18 +00:00
Add sample code to PositionedTransition (#59156)
This commit is contained in:
parent
8cf15ee2aa
commit
e13b44d978
@ -724,6 +724,60 @@ class RelativeRectTween extends Tween<RelativeRect> {
|
||||
/// animated by a [CurvedAnimation] set to [Curves.elasticInOut]:
|
||||
/// {@animation 300 378 https://flutter.github.io/assets-for-api-docs/assets/widgets/positioned_transition.mp4}
|
||||
///
|
||||
/// {@tool dartpad --template=stateful_widget_material_ticker}
|
||||
///
|
||||
/// The following code implements the [PositionedTransition] as seen in the video
|
||||
/// above:
|
||||
///
|
||||
/// ```dart
|
||||
/// AnimationController _controller;
|
||||
///
|
||||
/// @override
|
||||
/// void initState() {
|
||||
/// super.initState();
|
||||
/// _controller = AnimationController(
|
||||
/// duration: const Duration(seconds: 2),
|
||||
/// vsync: this,
|
||||
/// )..repeat(reverse: true);
|
||||
/// }
|
||||
///
|
||||
/// @override
|
||||
/// void dispose() {
|
||||
/// _controller.dispose();
|
||||
/// super.dispose();
|
||||
/// }
|
||||
///
|
||||
/// @override
|
||||
/// Widget build(BuildContext context) {
|
||||
/// final double smallLogo = 100;
|
||||
/// final double bigLogo = 200;
|
||||
///
|
||||
/// return LayoutBuilder(
|
||||
/// builder: (context, constraints) {
|
||||
/// final Size biggest = constraints.biggest;
|
||||
/// return Stack(
|
||||
/// children: [
|
||||
/// PositionedTransition(
|
||||
/// rect: RelativeRectTween(
|
||||
/// begin: RelativeRect.fromSize(Rect.fromLTWH(0, 0, smallLogo, smallLogo), biggest),
|
||||
/// end: RelativeRect.fromSize(Rect.fromLTWH(biggest.width - bigLogo, biggest.height - bigLogo, bigLogo, bigLogo), biggest),
|
||||
/// ).animate(CurvedAnimation(
|
||||
/// parent: _controller,
|
||||
/// curve: Curves.elasticInOut,
|
||||
/// )),
|
||||
/// child: Padding(
|
||||
/// padding: const EdgeInsets.all(8),
|
||||
/// child: FlutterLogo()
|
||||
/// ),
|
||||
/// ),
|
||||
/// ],
|
||||
/// );
|
||||
/// },
|
||||
/// );
|
||||
/// }
|
||||
/// ```
|
||||
/// {@end-tool}
|
||||
///
|
||||
/// See also:
|
||||
///
|
||||
/// * [AnimatedPositioned], which transitions a child's position without
|
||||
|
Loading…
Reference in New Issue
Block a user