Convert Dismissable over to using animated subcomponents

sky/sdk/lib/widgets/dismissable.dart

Index: sky/sdk/lib/widgets/dismissable.dart
diff --git a/sky/sdk/lib/widgets/dismissable.dart b/sky/sdk/lib/widgets/dismissable.dart
index d093d964ea571414b82960c758c9aa745e4ea8e5..e4ac4938e87e0a463dff99222003cc64911aa2a2 100644
--- a/sky/sdk/lib/widgets/dismissable.dart
+++ b/sky/sdk/lib/widgets/dismissable.dart
@@ -4,21 +4,19 @@
 
 import 'dart:sky' as sky;
 
-import 'package:vector_math/vector_math.dart';
 import 'package:sky/animation/animation_performance.dart';
-import 'package:sky/widgets/animation_builder.dart';
-import 'package:sky/widgets/animated_component.dart';
+import 'package:sky/widgets/animated.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/widget.dart';
 
-const int _kCardDismissFadeoutMS = 300;
+const Duration _kCardDismissFadeout = const Duration(milliseconds: 300);
 const double _kMinFlingVelocity = 700.0;
 const double _kMinFlingVelocityDelta = 400.0;
 const double _kDismissCardThreshold = 0.6;
 
 typedef void DismissedCallback();
 
-class Dismissable extends AnimatedComponent {
+class Dismissable extends StatefulComponent {
 
   Dismissable({
     String key,
@@ -30,28 +28,26 @@ class Dismissable extends AnimatedComponent {
   Widget child;
   DismissedCallback onDismissed;
 
-  AnimationBuilder _transform;
+  AnimatedType<Point> _position;
+  AnimatedType<double> _opacity;
   AnimationPerformance _performance;
+
   double _width;
   double _dragX = 0.0;
   bool _dragUnderway = false;
 
   void initState() {
-    _transform = new AnimationBuilder()
-      ..position = new AnimatedType<Point>(Point.origin)
-      ..opacity = new AnimatedType<double>(1.0, end: 0.0);
-
-    _performance = _transform.createPerformance(
-        [_transform.position, _transform.opacity],
-        duration: new Duration(milliseconds: _kCardDismissFadeoutMS));
-    _performance.addListener(_handleAnimationProgressChanged);
-    watch(_performance);
+    _position = new AnimatedType<Point>(Point.origin);
+    _opacity = new AnimatedType<double>(1.0, end: 0.0);
+    _performance = new AnimationPerformance()
+      ..duration = _kCardDismissFadeout
+      ..variable = new AnimatedList([_position, _opacity])
+      ..addListener(_handleAnimationProgressChanged);
   }
 
   void syncFields(Dismissable source) {
     child = source.child;
     onDismissed = source.onDismissed;
-    super.syncFields(source);
   }
 
   Point get _activeCardDragEndPoint {
@@ -77,7 +73,7 @@ class Dismissable extends AnimatedComponent {
 
   void _handleSizeChanged(Size newSize) {
     _width = newSize.width;
-    _transform.position.end = _activeCardDragEndPoint;
+    _position.end = _activeCardDragEndPoint;
   }
 
   void _handlePointerDown(sky.PointerEvent event) {
@@ -97,7 +93,7 @@ class Dismissable extends AnimatedComponent {
     setState(() {
       if (!_performance.isAnimating) {
         if (oldDragX.sign != _dragX.sign)
-          _transform.position.end = _activeCardDragEndPoint;
+          _position.end = _activeCardDragEndPoint;
         _performance.progress = _dragX.abs() / (_width * _kDismissCardThreshold);
       }
     });
@@ -130,7 +126,7 @@ class Dismissable extends AnimatedComponent {
       _dragUnderway = false;
       double distance = 1.0 - _performance.progress;
       if (distance > 0.0) {
-        double duration = _kCardDismissFadeoutMS * 1000.0 * distance / event.velocityX.abs();
+        double duration = _kCardDismissFadeout.inSeconds * distance / event.velocityX.abs();
         _dragX = event.velocityX.sign;
         _performance.timeline.animateTo(1.0, duration: duration);
       }
@@ -138,18 +134,6 @@ class Dismissable extends AnimatedComponent {
   }
 
   Widget build() {
-    // TODO(hansmuller) The code below changes the widget tree when
-    // the user starts dragging. Currently this causes Sky to drop the
-    // rest of the pointer gesture, see https://github.com/domokit/mojo/issues/312.
-    // As a workaround, always create the Transform and Opacity nodes.
-    Widget transformedChild = child;
-    if (_isActive) {
-      transformedChild = _transform.build(transformedChild);
-    } else {
-      transformedChild = new Transform(child: transformedChild, transform: new Matrix4.identity());
-      transformedChild = new Opacity(child: transformedChild, opacity: 1.0);
-    }
-
     return new Listener(
       onPointerDown: _handlePointerDown,
       onPointerMove: _handlePointerMove,
@@ -157,8 +141,15 @@ class Dismissable extends AnimatedComponent {
       onPointerCancel: _handlePointerUpOrCancel,
       onGestureFlingStart: _handleFlingStart,
       child: new SizeObserver(
-        child: transformedChild,
-        callback: _handleSizeChanged
+        callback: _handleSizeChanged,
+        child: new PositionAnimation(
+          position: _position,
+          performance: _performance,
+          child: new OpacityAnimation(
+            opacity: _opacity,
+            child: child

[hansmuller, 2015/07/15 00:38:04]

The OpacityAnimation needs a performance too (as you already know :-).

+          )
+        )
       )
     );
   }