Commit d25951c5 authored by Adam Barth's avatar Adam Barth

AnimatedBuilder should have a child

Providing a pre-built child is more efficient because we don't need to rebuild
the child every tick of the animation.
parent 715af6eb
...@@ -15,7 +15,7 @@ class PageSelectorDemo extends StatelessComponent { ...@@ -15,7 +15,7 @@ class PageSelectorDemo extends StatelessComponent {
CurvedAnimation animation = new CurvedAnimation(parent: selection.animation, curve: Curves.ease); CurvedAnimation animation = new CurvedAnimation(parent: selection.animation, curve: Curves.ease);
return new AnimatedBuilder( return new AnimatedBuilder(
animation: animation, animation: animation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
Color background = selection.value == iconName ? _selectedColor.end : _selectedColor.begin; Color background = selection.value == iconName ? _selectedColor.end : _selectedColor.begin;
if (selection.valueIsChanging) { if (selection.valueIsChanging) {
// Then the selection's performance is animating from previousValue to value. // Then the selection's performance is animating from previousValue to value.
......
...@@ -47,7 +47,7 @@ class _ProgressIndicatorDemoState extends State<ProgressIndicatorDemo> { ...@@ -47,7 +47,7 @@ class _ProgressIndicatorDemoState extends State<ProgressIndicatorDemo> {
controller.play(direction); controller.play(direction);
} }
Widget buildIndicators(BuildContext context) { Widget buildIndicators(BuildContext context, Widget child) {
List<Widget> indicators = <Widget>[ List<Widget> indicators = <Widget>[
new SizedBox( new SizedBox(
width: 200.0, width: 200.0,
......
...@@ -41,7 +41,7 @@ class CardTransition extends StatelessComponent { ...@@ -41,7 +41,7 @@ class CardTransition extends StatelessComponent {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new AnimatedBuilder( return new AnimatedBuilder(
animation: animation, animation: animation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
double currentScale = scale.evaluate(animation); double currentScale = scale.evaluate(animation);
Matrix4 transform = new Matrix4.identity() Matrix4 transform = new Matrix4.identity()
..translate(x.evaluate(animation)) ..translate(x.evaluate(animation))
...@@ -53,7 +53,8 @@ class CardTransition extends StatelessComponent { ...@@ -53,7 +53,8 @@ class CardTransition extends StatelessComponent {
child: child child: child
) )
); );
} },
child: child
); );
} }
} }
......
...@@ -134,7 +134,7 @@ class _ModalBottomSheetState extends State<_ModalBottomSheet> { ...@@ -134,7 +134,7 @@ class _ModalBottomSheetState extends State<_ModalBottomSheet> {
onTap: () => Navigator.pop(context), onTap: () => Navigator.pop(context),
child: new AnimatedBuilder( child: new AnimatedBuilder(
animation: config.route.animation, animation: config.route.animation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return new ClipRect( return new ClipRect(
child: new CustomOneChildLayout( child: new CustomOneChildLayout(
delegate: new _ModalBottomSheetLayout(config.route.animation.value), delegate: new _ModalBottomSheetLayout(config.route.animation.value),
......
...@@ -131,7 +131,7 @@ class _DropDownMenu<T> extends StatusTransitionComponent { ...@@ -131,7 +131,7 @@ class _DropDownMenu<T> extends StatusTransitionComponent {
opacity: opacity, opacity: opacity,
child: new AnimatedBuilder( child: new AnimatedBuilder(
animation: resize, animation: resize,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return new CustomPaint( return new CustomPaint(
painter: new _DropDownMenuPainter( painter: new _DropDownMenuPainter(
color: Theme.of(context).canvasColor, color: Theme.of(context).canvasColor,
...@@ -142,7 +142,8 @@ class _DropDownMenu<T> extends StatusTransitionComponent { ...@@ -142,7 +142,8 @@ class _DropDownMenu<T> extends StatusTransitionComponent {
), ),
child: child child: child
); );
} },
child: child
) )
); );
} }
......
...@@ -96,7 +96,7 @@ class _PopupMenu<T> extends StatelessComponent { ...@@ -96,7 +96,7 @@ class _PopupMenu<T> extends StatelessComponent {
return new AnimatedBuilder( return new AnimatedBuilder(
animation: route.animation, animation: route.animation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return new Opacity( return new Opacity(
opacity: opacity.evaluate(route.animation), opacity: opacity.evaluate(route.animation),
child: new Material( child: new Material(
...@@ -110,7 +110,8 @@ class _PopupMenu<T> extends StatelessComponent { ...@@ -110,7 +110,8 @@ class _PopupMenu<T> extends StatelessComponent {
) )
) )
); );
} },
child: child
); );
} }
} }
......
...@@ -63,7 +63,7 @@ class _ProgressIndicatorState extends State<ProgressIndicator> { ...@@ -63,7 +63,7 @@ class _ProgressIndicatorState extends State<ProgressIndicator> {
return new AnimatedBuilder( return new AnimatedBuilder(
animation: _animation, animation: _animation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return config._buildIndicator(context, _animation.value); return config._buildIndicator(context, _animation.value);
} }
); );
......
...@@ -473,20 +473,20 @@ class _PersistentBottomSheetState extends State<_PersistentBottomSheet> { ...@@ -473,20 +473,20 @@ class _PersistentBottomSheetState extends State<_PersistentBottomSheet> {
} }
Widget build(BuildContext context) { Widget build(BuildContext context) {
Widget child = new BottomSheet(
animationController: config.animationController,
onClosing: config.onClosing,
builder: config.builder
);
return new AnimatedBuilder( return new AnimatedBuilder(
animation: config.animationController, animation: config.animationController,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return new Align( return new Align(
alignment: const FractionalOffset(0.0, 0.0), alignment: const FractionalOffset(0.0, 0.0),
heightFactor: config.animationController.value, heightFactor: config.animationController.value,
child: child child: child
); );
} },
child: new BottomSheet(
animationController: config.animationController,
onClosing: config.onClosing,
builder: config.builder
)
); );
} }
......
...@@ -85,38 +85,38 @@ class SnackBar extends StatelessComponent { ...@@ -85,38 +85,38 @@ class SnackBar extends StatelessComponent {
CurvedAnimation heightAnimation = new CurvedAnimation(parent: animation, curve: _snackBarHeightCurve); CurvedAnimation heightAnimation = new CurvedAnimation(parent: animation, curve: _snackBarHeightCurve);
CurvedAnimation fadeAnimation = new CurvedAnimation(parent: animation, curve: _snackBarFadeCurve); CurvedAnimation fadeAnimation = new CurvedAnimation(parent: animation, curve: _snackBarFadeCurve);
ThemeData theme = Theme.of(context); ThemeData theme = Theme.of(context);
Widget child = new Material(
elevation: 6,
color: _kSnackBackground,
child: new Container(
margin: const EdgeDims.symmetric(horizontal: _kSideMargins),
child: new Theme(
data: new ThemeData(
brightness: ThemeBrightness.dark,
accentColor: theme.accentColor,
accentColorBrightness: theme.accentColorBrightness,
text: Typography.white
),
child: new FadeTransition(
opacity: fadeAnimation,
child: new Row(
children: children,
alignItems: FlexAlignItems.center
)
)
)
)
);
return new ClipRect( return new ClipRect(
child: new AnimatedBuilder( child: new AnimatedBuilder(
animation: heightAnimation, animation: heightAnimation,
builder: (BuildContext context) { builder: (BuildContext context, Widget child) {
return new Align( return new Align(
alignment: const FractionalOffset(0.0, 0.0), alignment: const FractionalOffset(0.0, 0.0),
heightFactor: heightAnimation.value, heightFactor: heightAnimation.value,
child: child child: child
); );
} },
child: new Material(
elevation: 6,
color: _kSnackBackground,
child: new Container(
margin: const EdgeDims.symmetric(horizontal: _kSideMargins),
child: new Theme(
data: new ThemeData(
brightness: ThemeBrightness.dark,
accentColor: theme.accentColor,
accentColorBrightness: theme.accentColorBrightness,
text: Typography.white
),
child: new FadeTransition(
opacity: fadeAnimation,
child: new Row(
children: children,
alignItems: FlexAlignItems.center
)
)
)
)
)
) )
); );
} }
......
...@@ -360,16 +360,20 @@ class BuilderTransition extends TransitionComponent { ...@@ -360,16 +360,20 @@ class BuilderTransition extends TransitionComponent {
} }
} }
typedef Widget TransitionBuilder(BuildContext context, Widget child);
class AnimatedBuilder extends AnimatedComponent { class AnimatedBuilder extends AnimatedComponent {
AnimatedBuilder({ AnimatedBuilder({
Key key, Key key,
Animated<Object> animation, Animated<Object> animation,
this.builder this.builder,
this.child
}) : super(key: key, animation: animation); }) : super(key: key, animation: animation);
final WidgetBuilder builder; final TransitionBuilder builder;
final Widget child;
Widget build(BuildContext context) { Widget build(BuildContext context) {
return builder(context); return builder(context, child);
} }
} }
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