Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(42)

Side by Side Diff: sky/sdk/lib/widgets/drawer.dart

Issue 1233703003: add initState, rename animated_container (Closed) Base URL: git@github.com:domokit/mojo.git@master
Patch Set: remove print statement Created 5 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 // Copyright 2015 The Chromium Authors. All rights reserved. 1 // Copyright 2015 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 import 'dart:sky' as sky; 5 import 'dart:sky' as sky;
6 6
7 import '../animation/animation_performance.dart'; 7 import '../animation/animation_performance.dart';
8 import '../animation/curves.dart'; 8 import '../animation/curves.dart';
9 import '../theme/shadows.dart'; 9 import '../theme/shadows.dart';
10 import 'animated_component.dart'; 10 import 'animated_component.dart';
11 import 'animated_container.dart'; 11 import 'animation_builder.dart';
12 import 'basic.dart'; 12 import 'basic.dart';
13 import 'theme.dart'; 13 import 'theme.dart';
14 14
15 // TODO(eseidel): Draw width should vary based on device size: 15 // TODO(eseidel): Draw width should vary based on device size:
16 // http://www.google.com/design/spec/layout/structure.html#structure-side-nav 16 // http://www.google.com/design/spec/layout/structure.html#structure-side-nav
17 17
18 // Mobile: 18 // Mobile:
19 // Width = Screen width − 56 dp 19 // Width = Screen width − 56 dp
20 // Maximum width: 320dp 20 // Maximum width: 320dp
21 // Maximum width applies only when using a left nav. When using a right nav, 21 // Maximum width applies only when using a left nav. When using a right nav,
22 // the panel can cover the full width of the screen. 22 // the panel can cover the full width of the screen.
23 23
24 // Desktop/Tablet: 24 // Desktop/Tablet:
25 // Maximum width for a left nav is 400dp. 25 // Maximum width for a left nav is 400dp.
26 // The right nav can vary depending on content. 26 // The right nav can vary depending on content.
27 27
28 const double _kWidth = 304.0; 28 const double _kWidth = 304.0;
29 const double _kMinFlingVelocity = 0.4; 29 const double _kMinFlingVelocity = 0.4;
30 const Duration _kBaseSettleDuration = const Duration(milliseconds: 246); 30 const Duration _kBaseSettleDuration = const Duration(milliseconds: 246);
31 // TODO(mpcomplete): The curve must be linear if we want the drawer to track 31 // TODO(mpcomplete): The curve must be linear if we want the drawer to track
32 // the user's finger. Odeon remedies this by attaching spring forces to the 32 // the user's finger. Odeon remedies this by attaching spring forces to the
33 // initial timeline when animating (so it doesn't look linear). 33 // initial timeline when animating (so it doesn't look linear).
34 const Curve _kAnimationCurve = linear; 34 const Curve _kAnimationCurve = linear;
35 35
36 typedef void DrawerStatusChangeHandler (bool showing); 36 typedef void DrawerStatusChangeHandler (bool showing);
37 37
38 class DrawerController { 38 class DrawerController {
39 DrawerController(this.onStatusChange) { 39 DrawerController(this.onStatusChange) {
40 container = new AnimatedContainer() 40 builder = new AnimationBuilder()
41 ..position = new AnimatedType<Point>( 41 ..position = new AnimatedType<Point>(
42 new Point(-_kWidth, 0.0), end: Point.origin, curve: _kAnimationCurve); 42 new Point(-_kWidth, 0.0), end: Point.origin, curve: _kAnimationCurve);
43 performance = container.createPerformance([container.position], 43 performance = builder.createPerformance([builder.position],
44 duration: _kBaseSettleDuration) 44 duration: _kBaseSettleDuration)
45 ..addListener(_checkValue); 45 ..addListener(_checkValue);
46 } 46 }
47 final DrawerStatusChangeHandler onStatusChange; 47 final DrawerStatusChangeHandler onStatusChange;
48 48
49 AnimationPerformance performance; 49 AnimationPerformance performance;
50 AnimatedContainer container; 50 AnimationBuilder builder;
51 51
52 double get xPosition => container.position.value.x; 52 double get xPosition => builder.position.value.x;
53 53
54 bool _oldClosedState = true; 54 bool _oldClosedState = true;
55 void _checkValue() { 55 void _checkValue() {
56 var newClosedState = isClosed; 56 var newClosedState = isClosed;
57 if (onStatusChange != null && _oldClosedState != newClosedState) { 57 if (onStatusChange != null && _oldClosedState != newClosedState) {
58 onStatusChange(!newClosedState); 58 onStatusChange(!newClosedState);
59 _oldClosedState = newClosedState; 59 _oldClosedState = newClosedState;
60 } 60 }
61 } 61 }
62 62
(...skipping 62 matching lines...) Expand 10 before | Expand all | Expand 10 after
125 Widget build() { 125 Widget build() {
126 // TODO(mpcomplete): animate as a fade-in. 126 // TODO(mpcomplete): animate as a fade-in.
127 double scaler = controller.performance.progress; 127 double scaler = controller.performance.progress;
128 Color maskColor = new Color.fromARGB((0x7F * scaler).floor(), 0, 0, 0); 128 Color maskColor = new Color.fromARGB((0x7F * scaler).floor(), 0, 0, 0);
129 129
130 var mask = new Listener( 130 var mask = new Listener(
131 child: new Container(decoration: new BoxDecoration(backgroundColor: maskCo lor)), 131 child: new Container(decoration: new BoxDecoration(backgroundColor: maskCo lor)),
132 onGestureTap: controller.handleMaskTap 132 onGestureTap: controller.handleMaskTap
133 ); 133 );
134 134
135 Widget content = controller.container.build( 135 Widget content = controller.builder.build(
136 new Container( 136 new Container(
137 decoration: new BoxDecoration( 137 decoration: new BoxDecoration(
138 backgroundColor: Theme.of(this).canvasColor, 138 backgroundColor: Theme.of(this).canvasColor,
139 boxShadow: shadows[level]), 139 boxShadow: shadows[level]),
140 width: _kWidth, 140 width: _kWidth,
141 child: new Block(children) 141 child: new Block(children)
142 )); 142 ));
143 143
144 return new Listener( 144 return new Listener(
145 child: new Stack([ mask, content ]), 145 child: new Stack([ mask, content ]),
146 onPointerDown: controller.handlePointerDown, 146 onPointerDown: controller.handlePointerDown,
147 onPointerMove: controller.handlePointerMove, 147 onPointerMove: controller.handlePointerMove,
148 onPointerUp: controller.handlePointerUp, 148 onPointerUp: controller.handlePointerUp,
149 onPointerCancel: controller.handlePointerCancel, 149 onPointerCancel: controller.handlePointerCancel,
150 onGestureFlingStart: controller.handleFlingStart 150 onGestureFlingStart: controller.handleFlingStart
151 ); 151 );
152 } 152 }
153 153
154 } 154 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698