Commit fb8fe97a authored by Hixie's avatar Hixie

Enable Positioned to be animated.

Add a AnimatedRelativeRectValue class for animating RelativeRects.

Add a PositionedTransition class for animating Positioned using
AnimatedRelativeRectValues.

Add a test for PositionedTransition.

Fix a math bug a RelativeRect found by the test.

Fix a logic bug in the two ParentDataWidget classes found by the test.
Specifically, they were marking the child dirty, rather than the parent.
The parentData is for the parent's layout, not the child's, so they have
to mark the parent dirty. (I didn't hoist this up to the superclass
because ParentData could be used for painting, hit testing,
accessibility, or any number of other things, and I didn't want to bake
in the assumption that it needed markNeedsLayout.)
parent 7c0c1c96
......@@ -42,8 +42,8 @@ class RelativeRect {
return new RelativeRect.fromLTRB(
rect.left - container.left,
rect.top - container.top,
container.right - rect.left + rect.width,
container.bottom - rect.top + rect.height
container.right - rect.right,
container.bottom - rect.bottom
);
}
......
......@@ -692,8 +692,11 @@ class Positioned extends ParentDataWidget {
needsLayout = true;
}
if (needsLayout)
renderObject.markNeedsLayout();
if (needsLayout) {
AbstractNode targetParent = renderObject.parent;
if (targetParent is RenderObject)
targetParent.markNeedsLayout();
}
}
void debugFillDescription(List<String> description) {
......@@ -788,7 +791,9 @@ class Flexible extends ParentDataWidget {
final FlexParentData parentData = renderObject.parentData;
if (parentData.flex != flex) {
parentData.flex = flex;
renderObject.markNeedsLayout();
AbstractNode targetParent = renderObject.parent;
if (targetParent is RenderObject)
targetParent.markNeedsLayout();
}
}
......
......@@ -4,11 +4,13 @@
import 'package:flutter/animation.dart';
import 'package:vector_math/vector_math_64.dart' show Matrix4;
import 'package:flutter/rendering.dart';
import 'basic.dart';
import 'framework.dart';
export 'package:flutter/animation.dart' show AnimationDirection;
export 'package:flutter/rendering.dart' show RelativeRect;
abstract class TransitionComponent extends StatefulComponent {
TransitionComponent({
......@@ -150,6 +152,47 @@ class SquashTransition extends TransitionWithChild {
}
}
/// An animated variable containing a RelativeRectangle
///
/// This class specializes the interpolation of AnimatedValue<RelativeRect> to
/// be appropriate for rectangles that are described in terms of offsets from
/// other rectangles.
class AnimatedRelativeRectValue extends AnimatedValue<RelativeRect> {
AnimatedRelativeRectValue(RelativeRect begin, { RelativeRect end, Curve curve, Curve reverseCurve })
: super(begin, end: end, curve: curve, reverseCurve: reverseCurve);
RelativeRect lerp(double t) => RelativeRect.lerp(begin, end, t);
}
/// Animated version of [Positioned].
/// Only works if it's the child of a [Stack].
class PositionedTransition extends TransitionWithChild {
PositionedTransition({
Key key,
this.rect,
PerformanceView performance,
Widget child
}) : super(key: key,
performance: performance,
child: child) {
assert(rect != null);
}
final AnimatedRelativeRectValue rect;
Widget buildWithChild(BuildContext context, Widget child) {
performance.updateVariable(rect);
return new Positioned(
top: rect.value.top,
right: rect.value.right,
bottom: rect.value.bottom,
left: rect.value.left,
child: child
);
}
}
typedef Widget BuilderFunction(BuildContext context);
class BuilderTransition extends TransitionComponent {
......
import 'package:flutter/animation.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
import 'package:test/test.dart';
import 'widget_tester.dart';
void main() {
test('Can animate position data', () {
testWidgets((WidgetTester tester) {
final AnimatedRelativeRectValue rect = new AnimatedRelativeRectValue(
new RelativeRect.fromRect(
new Rect.fromLTRB(10.0, 20.0, 20.0, 30.0),
new Rect.fromLTRB(0.0, 10.0, 100.0, 110.0)
),
end: new RelativeRect.fromRect(
new Rect.fromLTRB(80.0, 90.0, 90.0, 100.0),
new Rect.fromLTRB(0.0, 10.0, 100.0, 110.0)
),
curve: linear
);
final Performance performance = new Performance(
duration: const Duration(seconds: 10)
);
final List<Size> sizes = <Size>[];
final List<Point> positions = <Point>[];
final GlobalKey key = new GlobalKey();
void recordMetrics() {
RenderBox box = key.currentContext.findRenderObject();
BoxParentData boxParentData = box.parentData;
sizes.add(box.size);
positions.add(boxParentData.position);
}
tester.pumpWidget(
new Center(
child: new Container(
height: 100.0,
width: 100.0,
child: new Stack(<Widget>[
new PositionedTransition(
rect: rect,
performance: performance,
child: new Container(
key: key
)
)
])
)
)
); // t=0
recordMetrics();
performance.play();
tester.pump(); // t=0 again
recordMetrics();
tester.pump(const Duration(seconds: 1)); // t=1
recordMetrics();
tester.pump(const Duration(seconds: 1)); // t=2
recordMetrics();
tester.pump(const Duration(seconds: 3)); // t=5
recordMetrics();
tester.pump(const Duration(seconds: 5)); // t=10
recordMetrics();
expect(sizes, equals([const Size(10.0, 10.0), const Size(10.0, 10.0), const Size(10.0, 10.0), const Size(10.0, 10.0), const Size(10.0, 10.0), const Size(10.0, 10.0)]));
expect(positions, equals([const Point(10.0, 10.0), const Point(10.0, 10.0), const Point(17.0, 17.0), const Point(24.0, 24.0), const Point(45.0, 45.0), const Point(80.0, 80.0)]));
});
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment