From 8ead9452d8fc0bcd8795de4c12770cfbcced0d56 Mon Sep 17 00:00:00 2001 From: Matt Perry Date: Thu, 16 Jul 2015 18:01:06 -0700 Subject: [PATCH] Rename AnimatedType to AnimatedValue and put it in its own file. --- sky/sdk/BUILD.gn | 1 + sky/sdk/example/stocks/lib/stock_home.dart | 6 +- sky/sdk/lib/animation/animated_value.dart | 79 +++++++++++++++++++ .../lib/animation/animation_performance.dart | 69 +--------------- sky/sdk/lib/widgets/animated_container.dart | 21 ++--- sky/sdk/lib/widgets/animation_builder.dart | 24 ++---- sky/sdk/lib/widgets/dismissable.dart | 9 ++- sky/sdk/lib/widgets/drawer.dart | 6 +- sky/sdk/lib/widgets/ink_well.dart | 5 +- sky/sdk/lib/widgets/navigator.dart | 9 ++- sky/sdk/lib/widgets/popup_menu.dart | 21 ++--- sky/sdk/lib/widgets/toggleable.dart | 7 +- 12 files changed, 135 insertions(+), 122 deletions(-) create mode 100644 sky/sdk/lib/animation/animated_value.dart diff --git a/sky/sdk/BUILD.gn b/sky/sdk/BUILD.gn index 2577abfcc1bd5..7492021b33963 100644 --- a/sky/sdk/BUILD.gn +++ b/sky/sdk/BUILD.gn @@ -9,6 +9,7 @@ dart_pkg("sky") { "CHANGELOG.md", "bin/init.dart", "lib/animation/animated_simulation.dart", + "lib/animation/animated_value.dart", "lib/animation/animation_performance.dart", "lib/animation/curves.dart", "lib/animation/forces.dart", diff --git a/sky/sdk/example/stocks/lib/stock_home.dart b/sky/sdk/example/stocks/lib/stock_home.dart index b7a314c160ac9..b7a8b89026299 100644 --- a/sky/sdk/example/stocks/lib/stock_home.dart +++ b/sky/sdk/example/stocks/lib/stock_home.dart @@ -3,7 +3,7 @@ // found in the LICENSE file. import 'package:sky/editing/input.dart'; -import 'package:sky/animation/animation_performance.dart'; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/widgets/animated_component.dart'; import 'package:sky/widgets/animation_builder.dart'; import 'package:sky/theme/colors.dart' as colors; @@ -280,10 +280,10 @@ class StockHome extends AnimatedComponent { void _handleStockPurchased() { setState(() { _snackbarTransform = new AnimationBuilder() - ..position = new AnimatedType(const Point(0.0, 45.0), end: Point.origin); + ..position = new AnimatedValue(const Point(0.0, 45.0), end: Point.origin); var performance = _snackbarTransform.createPerformance( [_snackbarTransform.position], duration: _kSnackbarSlideDuration); - watch(performance); + watch(performance); // TODO(mpcomplete): need to unwatch performance.play(); }); } diff --git a/sky/sdk/lib/animation/animated_value.dart b/sky/sdk/lib/animation/animated_value.dart new file mode 100644 index 0000000000000..92510295c3399 --- /dev/null +++ b/sky/sdk/lib/animation/animated_value.dart @@ -0,0 +1,79 @@ +// Copyright 2015 The Chromium 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 "dart:sky"; + +import 'package:sky/animation/curves.dart'; +import 'package:sky/base/lerp.dart'; + +abstract class AnimatedVariable { + void setProgress(double t); + String toString(); +} + +class Interval { + final double start; + final double end; + + double adjustTime(double t) { + return ((t - start) / (end - start)).clamp(0.0, 1.0); + } + + Interval(this.start, this.end) { + assert(start >= 0.0); + assert(start <= 1.0); + assert(end >= 0.0); + assert(end <= 1.0); + } +} + +class AnimatedValue extends AnimatedVariable { + AnimatedValue(this.begin, { this.end, this.interval, this.curve: linear }) { + value = begin; + } + + T value; + T begin; + T end; + Interval interval; + Curve curve; + + void setProgress(double t) { + if (end != null) { + double adjustedTime = interval == null ? t : interval.adjustTime(t); + if (adjustedTime == 1.0) { + value = end; + } else { + // TODO(mpcomplete): Reverse the timeline and curve. + value = begin + (end - begin) * curve.transform(adjustedTime); + } + } + } + + String toString() => 'AnimatedValue(begin=$begin, end=$end, value=$value)'; +} + +class AnimatedList extends AnimatedVariable { + List variables; + Interval interval; + + AnimatedList(this.variables, { this.interval }); + + void setProgress(double t) { + double adjustedTime = interval == null ? t : interval.adjustTime(t); + for (AnimatedVariable variable in variables) + variable.setProgress(adjustedTime); + } + + String toString() => 'AnimatedList([$variables])'; +} + +class AnimatedColor extends AnimatedValue { + AnimatedColor(Color begin, { Color end, Curve curve: linear }) + : super(begin, end: end, curve: curve); + + void setProgress(double t) { + value = lerpColor(begin, end, t); + } +} diff --git a/sky/sdk/lib/animation/animation_performance.dart b/sky/sdk/lib/animation/animation_performance.dart index 5c678c1418d87..716165ae6eca4 100644 --- a/sky/sdk/lib/animation/animation_performance.dart +++ b/sky/sdk/lib/animation/animation_performance.dart @@ -4,71 +4,9 @@ import 'dart:async'; -import 'package:sky/animation/timeline.dart'; -import 'package:sky/animation/curves.dart'; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/forces.dart'; - -abstract class AnimatedVariable { - void setFraction(double t); - String toString(); -} - -class Interval { - final double start; - final double end; - - double adjustTime(double t) { - return ((t - start) / (end - start)).clamp(0.0, 1.0); - } - - Interval(this.start, this.end) { - assert(start >= 0.0); - assert(start <= 1.0); - assert(end >= 0.0); - assert(end <= 1.0); - } -} - -class AnimatedType extends AnimatedVariable { - AnimatedType(this.begin, { this.end, this.interval, this.curve: linear }) { - value = begin; - } - - T value; - T begin; - T end; - Interval interval; - Curve curve; - - void setFraction(double t) { - if (end != null) { - double adjustedTime = interval == null ? t : interval.adjustTime(t); - if (adjustedTime == 1.0) { - value = end; - } else { - // TODO(mpcomplete): Reverse the timeline and curve. - value = begin + (end - begin) * curve.transform(adjustedTime); - } - } - } - - String toString() => 'AnimatedType(begin=$begin, end=$end, value=$value)'; -} - -class AnimatedList extends AnimatedVariable { - List variables; - Interval interval; - - AnimatedList(this.variables, { this.interval }); - - void setFraction(double t) { - double adjustedTime = interval == null ? t : interval.adjustTime(t); - for (AnimatedVariable variable in variables) - variable.setFraction(adjustedTime); - } - - String toString() => 'AnimatedList([$variables])'; -} +import 'package:sky/animation/timeline.dart'; // This class manages a "performance" - a collection of values that change // based on a timeline. For example, a performance may handle an animation @@ -82,7 +20,6 @@ class AnimationPerformance { _timeline = new Timeline(_tick); } - // TODO(mpcomplete): make this a list, or composable somehow. AnimatedVariable variable; // TODO(mpcomplete): duration should be on a director. Duration duration; @@ -142,7 +79,7 @@ class AnimationPerformance { } void _tick(double t) { - variable.setFraction(t); + variable.setProgress(t); _notifyListeners(); } } diff --git a/sky/sdk/lib/widgets/animated_container.dart b/sky/sdk/lib/widgets/animated_container.dart index 1898664e4622f..d493a6857c517 100644 --- a/sky/sdk/lib/widgets/animated_container.dart +++ b/sky/sdk/lib/widgets/animated_container.dart @@ -4,6 +4,7 @@ import 'package:vector_math/vector_math.dart'; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/animation/curves.dart'; import 'package:sky/base/lerp.dart'; @@ -11,21 +12,21 @@ import 'package:sky/painting/box_painter.dart'; import 'package:sky/widgets/basic.dart'; import 'package:sky/widgets/animated_component.dart'; -class AnimatedBoxConstraintsValue extends AnimatedType { +class AnimatedBoxConstraintsValue extends AnimatedValue { AnimatedBoxConstraintsValue(BoxConstraints begin, { BoxConstraints end, Curve curve: linear }) : super(begin, end: end, curve: curve); - void setFraction(double t) { + void setProgress(double t) { // TODO(abarth): We should lerp the BoxConstraints. value = end; } } -class AnimatedBoxDecorationValue extends AnimatedType { +class AnimatedBoxDecorationValue extends AnimatedValue { AnimatedBoxDecorationValue(BoxDecoration begin, { BoxDecoration end, Curve curve: linear }) : super(begin, end: end, curve: curve); - void setFraction(double t) { + void setProgress(double t) { if (t == 1.0) { value = end; return; @@ -34,11 +35,11 @@ class AnimatedBoxDecorationValue extends AnimatedType { } } -class AnimatedEdgeDimsValue extends AnimatedType { +class AnimatedEdgeDimsValue extends AnimatedValue { AnimatedEdgeDimsValue(EdgeDims begin, { EdgeDims end, Curve curve: linear }) : super(begin, end: end, curve: curve); - void setFraction(double t) { + void setProgress(double t) { if (t == 1.0) { value = end; return; @@ -54,7 +55,7 @@ class AnimatedEdgeDimsValue extends AnimatedType { class ImplicitlyAnimatedValue { final AnimationPerformance performance = new AnimationPerformance(); - final AnimatedType _variable; + final AnimatedValue _variable; ImplicitlyAnimatedValue(this._variable, Duration duration) { performance @@ -168,21 +169,21 @@ class AnimatedContainer extends AnimatedComponent { void _updateTransform() { _updateField(transform, _transform, () { - _transform = new ImplicitlyAnimatedValue(new AnimatedType(transform), duration); + _transform = new ImplicitlyAnimatedValue(new AnimatedValue(transform), duration); watch(_transform.performance); }); } void _updateWidth() { _updateField(width, _width, () { - _width = new ImplicitlyAnimatedValue(new AnimatedType(width), duration); + _width = new ImplicitlyAnimatedValue(new AnimatedValue(width), duration); watch(_width.performance); }); } void _updateHeight() { _updateField(height, _height, () { - _height = new ImplicitlyAnimatedValue( new AnimatedType(height), duration); + _height = new ImplicitlyAnimatedValue( new AnimatedValue(height), duration); watch(_height.performance); }); } diff --git a/sky/sdk/lib/widgets/animation_builder.dart b/sky/sdk/lib/widgets/animation_builder.dart index 15cff58ad11b4..a0362f3684d25 100644 --- a/sky/sdk/lib/widgets/animation_builder.dart +++ b/sky/sdk/lib/widgets/animation_builder.dart @@ -4,9 +4,8 @@ import 'package:vector_math/vector_math.dart'; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; -import 'package:sky/animation/curves.dart'; -import 'package:sky/base/lerp.dart'; import 'package:sky/painting/box_painter.dart'; import 'package:sky/theme/shadows.dart'; import 'package:sky/widgets/basic.dart'; @@ -18,9 +17,9 @@ class AnimationBuilder { AnimationBuilder(); - AnimatedType opacity; - AnimatedType position; - AnimatedType shadow; + AnimatedValue opacity; + AnimatedValue position; + AnimatedValue shadow; AnimatedColor backgroundColor; // These don't animate, but are used to build the AnimationBuilder anyway. @@ -30,7 +29,7 @@ class AnimationBuilder { Map _variableToPerformance = new Map(); - AnimationPerformance createPerformance(List variables, + AnimationPerformance createPerformance(List variables, { Duration duration }) { AnimationPerformance performance = new AnimationPerformance() ..duration = duration @@ -67,7 +66,7 @@ class AnimationBuilder { } void updateFields({ - AnimatedType shadow, + AnimatedValue shadow, AnimatedColor backgroundColor, double borderRadius, Shape shape @@ -78,7 +77,7 @@ class AnimationBuilder { this.shape = shape; } - void _updateField(AnimatedType variable, AnimatedType sourceVariable) { + void _updateField(AnimatedValue variable, AnimatedValue sourceVariable) { if (variable == null) return; // TODO(mpcomplete): Should we handle transition from null? @@ -101,15 +100,6 @@ class AnimationBuilder { } } -class AnimatedColor extends AnimatedType { - AnimatedColor(Color begin, { Color end, Curve curve: linear }) - : super(begin, end: end, curve: curve); - - void setFraction(double t) { - value = lerpColor(begin, end, t); - } -} - List _computeShadow(double level) { if (level < 1.0) // shadows[1] is the first shadow return null; diff --git a/sky/sdk/lib/widgets/dismissable.dart b/sky/sdk/lib/widgets/dismissable.dart index a96612e649e77..197f728e9db2e 100644 --- a/sky/sdk/lib/widgets/dismissable.dart +++ b/sky/sdk/lib/widgets/dismissable.dart @@ -4,6 +4,7 @@ import 'dart:sky' as sky; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/widgets/animated_component.dart'; import 'package:sky/widgets/basic.dart'; @@ -30,8 +31,8 @@ class Dismissable extends AnimatedComponent { Widget child; DismissedCallback onDismissed; - AnimatedType _position; - AnimatedType _opacity; + AnimatedValue _position; + AnimatedValue _opacity; AnimationPerformance _performance; double _width; @@ -39,8 +40,8 @@ class Dismissable extends AnimatedComponent { bool _dragUnderway = false; void initState() { - _position = new AnimatedType(Point.origin); - _opacity = new AnimatedType(1.0, end: 0.0); + _position = new AnimatedValue(Point.origin); + _opacity = new AnimatedValue(1.0, end: 0.0); _performance = new AnimationPerformance() ..duration = _kCardDismissFadeout ..variable = new AnimatedList([_position, _opacity]) diff --git a/sky/sdk/lib/widgets/drawer.dart b/sky/sdk/lib/widgets/drawer.dart index 60f3682e8263a..3bca521802f7c 100644 --- a/sky/sdk/lib/widgets/drawer.dart +++ b/sky/sdk/lib/widgets/drawer.dart @@ -4,11 +4,11 @@ import 'dart:sky' as sky; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/theme/shadows.dart'; import 'package:sky/theme/colors.dart' as colors; import 'package:sky/widgets/animated_component.dart'; -import 'package:sky/widgets/animation_builder.dart'; import 'package:sky/widgets/basic.dart'; import 'package:sky/widgets/navigator.dart'; import 'package:sky/widgets/scrollable_viewport.dart'; @@ -60,12 +60,12 @@ class Drawer extends AnimatedComponent { DrawerStatusChangedCallback onStatusChanged; Navigator navigator; - AnimatedType _position; + AnimatedValue _position; AnimatedColor _maskColor; AnimationPerformance _performance; void initState() { - _position = new AnimatedType(_kClosedPosition, end: _kOpenPosition); + _position = new AnimatedValue(_kClosedPosition, end: _kOpenPosition); _maskColor = new AnimatedColor(colors.transparent, end: const Color(0x7F000000)); _performance = new AnimationPerformance() ..duration = _kBaseSettleDuration diff --git a/sky/sdk/lib/widgets/ink_well.dart b/sky/sdk/lib/widgets/ink_well.dart index f711fe18be3f5..158c6e469d225 100644 --- a/sky/sdk/lib/widgets/ink_well.dart +++ b/sky/sdk/lib/widgets/ink_well.dart @@ -5,6 +5,7 @@ import 'dart:math' as math; import 'dart:sky' as sky; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/animation/curves.dart'; import 'package:sky/rendering/box.dart'; @@ -29,7 +30,7 @@ double _getSplashTargetSize(Size bounds, Point position) { class InkSplash { InkSplash(this.pointer, this.position, this.well) { _targetRadius = _getSplashTargetSize(well.size, position); - _radius = new AnimatedType( + _radius = new AnimatedValue( _kSplashInitialSize, end: _targetRadius, curve: easeOut); _performance = new AnimationPerformance() @@ -45,7 +46,7 @@ class InkSplash { double _targetRadius; double _pinnedRadius; - AnimatedType _radius; + AnimatedValue _radius; AnimationPerformance _performance; void _updateVelocity(double velocity) { diff --git a/sky/sdk/lib/widgets/navigator.dart b/sky/sdk/lib/widgets/navigator.dart index 42df2d2d56091..8254bbef58d7d 100644 --- a/sky/sdk/lib/widgets/navigator.dart +++ b/sky/sdk/lib/widgets/navigator.dart @@ -2,6 +2,7 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/animation/curves.dart'; import 'package:sky/widgets/animated_component.dart'; @@ -59,17 +60,17 @@ class Transition extends AnimatedComponent { Function onDismissed; Function onCompleted; - AnimatedType _position; - AnimatedType _opacity; + AnimatedValue _position; + AnimatedValue _opacity; AnimationPerformance _performance; void initState() { - _position = new AnimatedType( + _position = new AnimatedValue( _kTransitionStartPoint, end: Point.origin, curve: easeOut ); - _opacity = new AnimatedType(0.0, end: 1.0) + _opacity = new AnimatedValue(0.0, end: 1.0) ..curve = easeOut; _performance = new AnimationPerformance() ..duration = _kTransitionDuration diff --git a/sky/sdk/lib/widgets/popup_menu.dart b/sky/sdk/lib/widgets/popup_menu.dart index 2d8a0dd50e75c..85e9bd70c64d5 100644 --- a/sky/sdk/lib/widgets/popup_menu.dart +++ b/sky/sdk/lib/widgets/popup_menu.dart @@ -5,6 +5,7 @@ import 'dart:math' as math; import 'dart:sky' as sky; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/painting/box_painter.dart'; import 'package:sky/theme/colors.dart'; @@ -48,10 +49,10 @@ class PopupMenu extends AnimatedComponent { int level; Navigator navigator; - AnimatedType _opacity; - AnimatedType _width; - AnimatedType _height; - List> _itemOpacities; + AnimatedValue _opacity; + AnimatedValue _width; + AnimatedValue _height; + List> _itemOpacities; AnimatedList _animationList; AnimationPerformance _performance; @@ -88,14 +89,14 @@ class PopupMenu extends AnimatedComponent { void _updateAnimationVariables() { double unit = 1.0 / (items.length + 1.5); // 1.0 for the width and 0.5 for the last item's fade. - _opacity = new AnimatedType(0.0, end: 1.0); - _width = new AnimatedType(0.0, end: 1.0, interval: new Interval(0.0, unit)); - _height = new AnimatedType(0.0, end: 1.0, interval: new Interval(0.0, unit * items.length)); - _itemOpacities = new List>(); + _opacity = new AnimatedValue(0.0, end: 1.0); + _width = new AnimatedValue(0.0, end: 1.0, interval: new Interval(0.0, unit)); + _height = new AnimatedValue(0.0, end: 1.0, interval: new Interval(0.0, unit * items.length)); + _itemOpacities = new List>(); for (int i = 0; i < items.length; ++i) { double start = (i + 1) * unit; double end = (start + 1.5 * unit).clamp(0.0, 1.0); - _itemOpacities.add(new AnimatedType( + _itemOpacities.add(new AnimatedValue( 0.0, end: 1.0, interval: new Interval(start, end))); } List variables = new List() @@ -121,7 +122,7 @@ class PopupMenu extends AnimatedComponent { PopupMenuStatus status = _status; if (_lastStatus != null && status != _lastStatus) { if (status == PopupMenuStatus.inactive && - navigator != null && + navigator != null && navigator.currentRoute.key == this) navigator.pop(); if (onStatusChanged != null) diff --git a/sky/sdk/lib/widgets/toggleable.dart b/sky/sdk/lib/widgets/toggleable.dart index 6ef04d0cab6d8..8fd8b1c44feb4 100644 --- a/sky/sdk/lib/widgets/toggleable.dart +++ b/sky/sdk/lib/widgets/toggleable.dart @@ -4,6 +4,7 @@ import 'dart:sky' as sky; +import 'package:sky/animation/animated_value.dart'; import 'package:sky/animation/animation_performance.dart'; import 'package:sky/animation/curves.dart'; import 'package:sky/widgets/animated_component.dart'; @@ -24,14 +25,14 @@ abstract class Toggleable extends AnimatedComponent { bool value; ValueChanged onChanged; - AnimatedType _position; - AnimatedType get position => _position; + AnimatedValue _position; + AnimatedValue get position => _position; AnimationPerformance _performance; AnimationPerformance get performance => _performance; void initState() { - _position = new AnimatedType(0.0, end: 1.0); + _position = new AnimatedValue(0.0, end: 1.0); _performance = new AnimationPerformance() ..variable = position ..duration = _kCheckDuration