From 77dd41ad69b5fa0e671e25f988e2011b71b50dff Mon Sep 17 00:00:00 2001 From: Hixie Date: Fri, 12 Jun 2015 11:46:08 -0700 Subject: [PATCH] Material and RaisedButton. Make Material actually create material, with opinions about what that means. Make FloatingActionButton use this. Make Scrollable use this. Make BoxDecoration support drawing a circle instead of a rectangle, so that floating action button doesn't need a custom painter. Implement RaisedButton (and remove button.dart, since there's no "button" in Material Design). Make InkWell have a "child" argument instead of "children", and not have it introduce a Flex into the hierarchy. Update container.dart example. Clean up some imports. R=abarth@chromium.org Review URL: https://codereview.chromium.org/1179713004. --- examples/stocks2/lib/stock_app.dart | 5 +- examples/stocks2/lib/stock_row.dart | 6 +- examples/widgets/container.dart | 43 +++--- examples/widgets/spinning_mixed.dart | 10 +- sdk/BUILD.gn | 3 +- sdk/lib/framework/editing2/input.dart | 1 - sdk/lib/framework/painting/box_painter.dart | 37 ++++-- sdk/lib/framework/rendering/box.dart | 123 ++++++++++++++++-- sdk/lib/framework/theme2/colors.dart | 1 + sdk/lib/framework/theme2/edges.dart | 11 ++ sdk/lib/framework/theme2/shadows.dart | 4 +- sdk/lib/framework/widgets/button.dart | 33 ----- sdk/lib/framework/widgets/drawer.dart | 2 +- .../widgets/fixed_height_scrollable.dart | 11 +- .../widgets/floating_action_button.dart | 46 +++---- sdk/lib/framework/widgets/ink_well.dart | 21 +-- sdk/lib/framework/widgets/material.dart | 39 ++++-- sdk/lib/framework/widgets/menu_item.dart | 4 +- sdk/lib/framework/widgets/popup_menu.dart | 3 +- .../framework/widgets/popup_menu_item.dart | 4 +- sdk/lib/framework/widgets/raised_button.dart | 55 ++++++++ sdk/lib/framework/widgets/scrollable.dart | 9 +- sdk/lib/framework/widgets/tool_bar.dart | 2 +- sdk/lib/framework/widgets/ui_node.dart | 3 +- sdk/lib/framework/widgets/wrappers.dart | 11 ++ 25 files changed, 311 insertions(+), 176 deletions(-) create mode 100644 sdk/lib/framework/theme2/edges.dart delete mode 100644 sdk/lib/framework/widgets/button.dart create mode 100644 sdk/lib/framework/widgets/raised_button.dart diff --git a/examples/stocks2/lib/stock_app.dart b/examples/stocks2/lib/stock_app.dart index db559946e6d..1e4fd64a1c4 100644 --- a/examples/stocks2/lib/stock_app.dart +++ b/examples/stocks2/lib/stock_app.dart @@ -2,7 +2,6 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -import 'package:sky/framework/app.dart'; import 'package:sky/framework/editing2/input.dart'; import 'package:sky/framework/rendering/box.dart'; import 'package:sky/framework/theme2/colors.dart' as colors; @@ -203,8 +202,8 @@ class StocksApp extends App { toolbar: _isSearching ? buildSearchBar() : buildToolBar(), body: new Stocklist(stocks: _stocks, query: _searchQuery), floatingActionButton: new FloatingActionButton( - content: new Icon(type: 'content/add_white', size: 24), - level: 3), + child: new Icon(type: 'content/add_white', size: 24) + ), drawer: _drawerShowing ? buildDrawer() : null ), ]; diff --git a/examples/stocks2/lib/stock_row.dart b/examples/stocks2/lib/stock_row.dart index fc0555bce72..1028017247a 100644 --- a/examples/stocks2/lib/stock_row.dart +++ b/examples/stocks2/lib/stock_row.dart @@ -37,8 +37,8 @@ class StockRow extends Component { ]; // TODO(hansmuller): An explicit |height| shouldn't be needed - return new InkWell(children: [ - new Container( + return new InkWell( + child: new Container( padding: const EdgeDims(16.0, 16.0, 20.0, 16.0), height: kHeight, decoration: const BoxDecoration( @@ -46,6 +46,6 @@ class StockRow extends Component { bottom: const BorderSide(color: const sky.Color(0xFFF4F4F4)))), child: new Flex(children) ) - ]); + ); } } diff --git a/examples/widgets/container.dart b/examples/widgets/container.dart index 14b5663d13f..8c842be0b9b 100644 --- a/examples/widgets/container.dart +++ b/examples/widgets/container.dart @@ -2,43 +2,38 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -import 'dart:sky' as sky; - import 'package:sky/framework/rendering/box.dart'; import 'package:sky/framework/rendering/flex.dart'; -import 'package:sky/framework/widgets/ui_node.dart'; +import 'package:sky/framework/widgets/raised_button.dart'; import 'package:sky/framework/widgets/wrappers.dart'; -class Rectangle extends Component { - - Rectangle(this.color, { Object key }) : super(key: key); - - final Color color; - - UINode build() { - return new FlexExpandingChild( - new Container( - decoration: new BoxDecoration(backgroundColor: color) - ) - ); - } - -} - class ContainerApp extends App { UINode build() { return new Flex([ - new Rectangle(const Color(0xFF00FFFF), key: 'a'), new Container( + key: 'a', padding: new EdgeDims.all(10.0), margin: new EdgeDims.all(10.0), decoration: new BoxDecoration(backgroundColor: const Color(0xFFCCCCCC)), - child: new Image(src: "https://www.dartlang.org/logos/dart-logo.png", - size: new Size(300.0, 300.0), - key: 1 + child: new Image( + src: "https://www.dartlang.org/logos/dart-logo.png", + size: new Size(300.0, 300.0) + ) + ), + new Container( + key: 'b', + decoration: new BoxDecoration(backgroundColor: const Color(0xFFFFFF00)), + padding: new EdgeDims.symmetric(horizontal: 50.0, vertical: 75.0), + child: new RaisedButton( + child: new Text('PRESS ME'), + onPressed: () => print("Hello World") + ) + ), + new FlexExpandingChild( + new Container( + decoration: new BoxDecoration(backgroundColor: const Color(0xFF00FFFF)) ) ), - new Rectangle(const Color(0xFFFFFF00), key: 'b'), ], direction: FlexDirection.vertical, justifyContent: FlexJustifyContent.spaceBetween diff --git a/examples/widgets/spinning_mixed.dart b/examples/widgets/spinning_mixed.dart index 407fbde30e9..b42a5bf366b 100644 --- a/examples/widgets/spinning_mixed.dart +++ b/examples/widgets/spinning_mixed.dart @@ -7,6 +7,7 @@ import 'dart:sky' as sky; import 'package:sky/framework/rendering/box.dart'; import 'package:sky/framework/rendering/flex.dart'; import 'package:sky/framework/scheduler.dart'; +import 'package:sky/framework/widgets/raised_button.dart'; import 'package:sky/framework/widgets/ui_node.dart'; import 'package:sky/framework/widgets/wrappers.dart'; import 'package:vector_math/vector_math.dart'; @@ -40,9 +41,12 @@ UINode builder() { padding: new EdgeDims.all(10.0), margin: new EdgeDims.all(10.0), decoration: new BoxDecoration(backgroundColor: const Color(0xFFCCCCCC)), - child: new Image(src: "https://www.dartlang.org/logos/dart-logo.png", - size: new Size(300.0, 300.0), - key: 1 + child: new RaisedButton( + child: new Flex([ + new Image(src: "https://www.dartlang.org/logos/dart-logo.png"), + new Text('PRESS ME'), + ]), + onPressed: () => print("Hello World") ) ), new Rectangle(const Color(0xFFFFFF00), key: 'b'), diff --git a/sdk/BUILD.gn b/sdk/BUILD.gn index e975ac75fb5..62d35410101 100644 --- a/sdk/BUILD.gn +++ b/sdk/BUILD.gn @@ -92,11 +92,11 @@ dart_pkg("sdk") { "lib/framework/theme/typography.dart", "lib/framework/theme/view_configuration.dart", "lib/framework/theme2/colors.dart", + "lib/framework/theme2/edges.dart", "lib/framework/theme2/shadows.dart", "lib/framework/theme2/typography.dart", "lib/framework/theme2/view_configuration.dart", "lib/framework/widgets/animated_component.dart", - "lib/framework/widgets/button.dart", "lib/framework/widgets/button_base.dart", "lib/framework/widgets/checkbox.dart", "lib/framework/widgets/drawer.dart", @@ -113,6 +113,7 @@ dart_pkg("sdk") { "lib/framework/widgets/popup_menu.dart", "lib/framework/widgets/popup_menu_item.dart", "lib/framework/widgets/radio.dart", + "lib/framework/widgets/raised_button.dart", "lib/framework/widgets/scaffold.dart", "lib/framework/widgets/scrollable.dart", "lib/framework/widgets/tool_bar.dart", diff --git a/sdk/lib/framework/editing2/input.dart b/sdk/lib/framework/editing2/input.dart index 65700085f4e..9ed9132a11d 100644 --- a/sdk/lib/framework/editing2/input.dart +++ b/sdk/lib/framework/editing2/input.dart @@ -4,7 +4,6 @@ import 'dart:sky' as sky; -import '../rendering/flex.dart'; import '../widgets/wrappers.dart'; import 'editable_string.dart'; import 'editable_text.dart'; diff --git a/sdk/lib/framework/painting/box_painter.dart b/sdk/lib/framework/painting/box_painter.dart index 83ae1d70ffb..c1f3fba63da 100644 --- a/sdk/lib/framework/painting/box_painter.dart +++ b/sdk/lib/framework/painting/box_painter.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 'dart:math' as math; import 'dart:sky' as sky; import 'dart:sky' show Point, Size, Rect, Color, Paint, Path; import 'shadows.dart'; @@ -119,14 +120,17 @@ class RadialGradient extends Gradient { final sky.TileMode tileMode; } +enum Shape { rectangle, circle } + // This must be immutable, because we won't notice when it changes class BoxDecoration { const BoxDecoration({ - this.backgroundColor, - this.border, - this.borderRadius, - this.boxShadow, - this.gradient + this.backgroundColor, // null = don't draw background + this.border, // null = don't draw border + this.borderRadius, // null = use more efficient background drawing; note that this must be null for circles + this.boxShadow, // null = don't draw shadows + this.gradient, // null = don't allocate gradient objects + this.shape: Shape.rectangle }); final Color backgroundColor; @@ -134,6 +138,7 @@ class BoxDecoration { final Border border; final List boxShadow; final Gradient gradient; + final Shape shape; String toString([String prefix = '']) { List result = []; @@ -147,6 +152,8 @@ class BoxDecoration { result.add('${prefix}boxShadow: ${boxShadow.map((shadow) => shadow.toString())}'); if (gradient != null) result.add('${prefix}gradient: $gradient'); + if (shape != Shape.rectangle) + result.add('${prefix}shape: $shape'); if (result.isEmpty) return '${prefix}'; return result.join('\n'); @@ -195,14 +202,26 @@ class BoxPainter { void paint(sky.Canvas canvas, Rect rect) { if (_decoration.backgroundColor != null || _decoration.boxShadow != null || _decoration.gradient != null) { - if (_decoration.borderRadius == null) - canvas.drawRect(rect, _backgroundPaint); - else - canvas.drawRRect(new sky.RRect()..setRectXY(rect, _decoration.borderRadius, _decoration.borderRadius), _backgroundPaint); + switch (_decoration.shape) { + case Shape.circle: + assert(_decoration.borderRadius == null); + Point center = rect.center; + Size size = rect.size; + double radius = math.min(size.width, size.height) / 2.0; + canvas.drawCircle(center.x, center.y, radius, _backgroundPaint); + break; + case Shape.rectangle: + if (_decoration.borderRadius == null) + canvas.drawRect(rect, _backgroundPaint); + else + canvas.drawRRect(new sky.RRect()..setRectXY(rect, _decoration.borderRadius, _decoration.borderRadius), _backgroundPaint); + break; + } } if (_decoration.border != null) { assert(_decoration.borderRadius == null); // TODO(abarth): Implement borders with border radius. + assert(_decoration.shape == Shape.rectangle); // TODO(ianh): Implement borders on circles. assert(_decoration.border.top != null); assert(_decoration.border.right != null); diff --git a/sdk/lib/framework/rendering/box.dart b/sdk/lib/framework/rendering/box.dart index abc6c65e399..3d54eae0e6d 100644 --- a/sdk/lib/framework/rendering/box.dart +++ b/sdk/lib/framework/rendering/box.dart @@ -53,7 +53,8 @@ class BoxConstraints { this.minWidth: 0.0, this.maxWidth: double.INFINITY, this.minHeight: 0.0, - this.maxHeight: double.INFINITY}); + this.maxHeight: double.INFINITY + }); BoxConstraints.tight(Size size) : minWidth = size.width, @@ -79,6 +80,15 @@ class BoxConstraints { ); } + BoxConstraints loosen() { + return new BoxConstraints( + minWidth: 0.0, + maxWidth: maxWidth, + minHeight: 0.0, + maxHeight: maxHeight + ); + } + BoxConstraints apply(BoxConstraints constraints) { return new BoxConstraints( minWidth: math.max(minWidth, constraints.minWidth), @@ -243,6 +253,8 @@ abstract class RenderBox extends RenderObject { class RenderProxyBox extends RenderBox with RenderObjectWithChildMixin { + // ProxyBox assumes the child will be at 0,0 and will have the same size + RenderProxyBox([RenderBox child = null]) { this.child = child; } @@ -503,12 +515,37 @@ class RenderClipOval extends RenderProxyBox { } } -class RenderPadding extends RenderBox with RenderObjectWithChildMixin { +abstract class RenderShiftedBox extends RenderBox with RenderObjectWithChildMixin { - RenderPadding({ EdgeDims padding, RenderBox child }) { + // Abstract class for one-child-layout render boxes + + RenderShiftedBox(RenderBox child) { + this.child = child; + } + + void paint(RenderObjectDisplayList canvas) { + if (child != null) + canvas.paintChild(child, child.parentData.position); + } + + void hitTestChildren(HitTestResult result, { Point position }) { + if (child != null) { + assert(child.parentData is BoxParentData); + Rect childBounds = new Rect.fromPointAndSize(child.parentData.position, child.size); + if (childBounds.contains(position)) { + child.hitTest(result, position: new Point(position.x - child.parentData.position.x, + position.y - child.parentData.position.y)); + } + } + } + +} + +class RenderPadding extends RenderShiftedBox { + + RenderPadding({ EdgeDims padding, RenderBox child }) : super(child) { assert(padding != null); this.padding = padding; - this.child = child; } EdgeDims _padding; @@ -564,23 +601,79 @@ class RenderPadding extends RenderBox with RenderObjectWithChildMixin padding.top + child.size.height + padding.bottom)); } - void paint(RenderObjectDisplayList canvas) { - if (child != null) - canvas.paintChild(child, child.parentData.position); + String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}padding: ${padding}\n'; +} + +class RenderPositionedBox extends RenderShiftedBox { + + RenderPositionedBox({ + RenderBox child, + double horizontal: 0.5, + double vertical: 0.5 + }) : _horizontal = horizontal, + _vertical = vertical, + super(child) { + assert(horizontal != null); + assert(vertical != null); } - void hitTestChildren(HitTestResult result, { Point position }) { + double _horizontal; + double get horizontal => _horizontal; + void set horizontal (double value) { + assert(value != null); + if (_horizontal == value) + return; + _horizontal = value; + markNeedsLayout(); + } + + double _vertical; + double get vertical => _vertical; + void set vertical (double value) { + assert(value != null); + if (_vertical == value) + return; + _vertical = value; + markNeedsLayout(); + } + + double getMinIntrinsicWidth(BoxConstraints constraints) { + if (child != null) + return child.getMinIntrinsicWidth(constraints); + return super.getMinIntrinsicWidth(constraints); + } + + double getMaxIntrinsicWidth(BoxConstraints constraints) { + if (child != null) + return child.getMaxIntrinsicWidth(constraints); + return super.getMaxIntrinsicWidth(constraints); + } + + double getMinIntrinsicHeight(BoxConstraints constraints) { + if (child != null) + return child.getMinIntrinsicHeight(constraints); + return super.getMinIntrinsicHeight(constraints); + } + + double getMaxIntrinsicHeight(BoxConstraints constraints) { + if (child != null) + return child.getMaxIntrinsicHeight(constraints); + return super.getMaxIntrinsicHeight(constraints); + } + + void performLayout() { if (child != null) { + child.layout(constraints.loosen()); + size = constraints.constrain(child.size); assert(child.parentData is BoxParentData); - Rect childBounds = new Rect.fromPointAndSize(child.parentData.position, child.size); - if (childBounds.contains(position)) { - child.hitTest(result, position: new Point(position.x - child.parentData.position.x, - position.y - child.parentData.position.y)); - } + Size delta = size - child.size; + child.parentData.position = new Point(delta.width * horizontal, delta.height * vertical); + } else { + performResize(); } } - String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}padding: ${padding}\n'; + String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}horizontal: ${horizontal}\n${prefix}vertical: ${vertical}\n'; } class RenderImage extends RenderBox { @@ -608,6 +701,8 @@ class RenderImage extends RenderBox { Size _requestedSize; Size get requestedSize => _requestedSize; void set requestedSize (Size value) { + if (value == null) + value = const Size(null, null); if (value == _requestedSize) return; _requestedSize = value; diff --git a/sdk/lib/framework/theme2/colors.dart b/sdk/lib/framework/theme2/colors.dart index 977348c99e3..bebb171e057 100644 --- a/sdk/lib/framework/theme2/colors.dart +++ b/sdk/lib/framework/theme2/colors.dart @@ -230,6 +230,7 @@ const Map Grey = const { 100: const Color(0xFFF5F5F5), 200: const Color(0xFFEEEEEE), 300: const Color(0xFFE0E0E0), + 350: const Color(0xFFD6D6D6), // only for raised button while pressed 400: const Color(0xFFBDBDBD), 500: const Color(0xFF9E9E9E), 600: const Color(0xFF757575), diff --git a/sdk/lib/framework/theme2/edges.dart b/sdk/lib/framework/theme2/edges.dart new file mode 100644 index 00000000000..d60f5e7e11a --- /dev/null +++ b/sdk/lib/framework/theme2/edges.dart @@ -0,0 +1,11 @@ +// 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. + +enum MaterialEdge { canvas, card, circle } + +const Map edges = const { + MaterialEdge.canvas: 0.0, + MaterialEdge.card: 2.0, + MaterialEdge.circle: null, +}; diff --git a/sdk/lib/framework/theme2/shadows.dart b/sdk/lib/framework/theme2/shadows.dart index b5e0d23fe01..8662e51e6a1 100644 --- a/sdk/lib/framework/theme2/shadows.dart +++ b/sdk/lib/framework/theme2/shadows.dart @@ -2,10 +2,10 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -import '../rendering/box.dart'; +import '../painting/box_painter.dart'; import 'dart:sky' show Color, Size; -const Map> Shadow = const { +const Map> shadows = const { 1: const [ const BoxShadow( color: const Color(0x1F000000), diff --git a/sdk/lib/framework/widgets/button.dart b/sdk/lib/framework/widgets/button.dart deleted file mode 100644 index b41eadbd93e..00000000000 --- a/sdk/lib/framework/widgets/button.dart +++ /dev/null @@ -1,33 +0,0 @@ -// 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 'ink_well.dart'; -import 'material.dart'; -import 'wrappers.dart'; - -class Button extends Component { - - Button({ Object key, this.content, this.level }) : super(key: key); - - static final Style _style = new Style(''' - -webkit-user-select: none; - height: 36px; - min-width: 64px; - padding: 0 8px; - margin: 4px; - border-radius: 2px;''' - ); - - final UINode content; - final int level; - - UINode build() { - return new StyleNode( - new Material( - content: new InkWell(children: [content]), - level: level), - _style); - } - -} diff --git a/sdk/lib/framework/widgets/drawer.dart b/sdk/lib/framework/widgets/drawer.dart index 71596f9aeba..9a16a450a54 100644 --- a/sdk/lib/framework/widgets/drawer.dart +++ b/sdk/lib/framework/widgets/drawer.dart @@ -148,7 +148,7 @@ class Drawer extends AnimatedComponent { Container content = new Container( decoration: new BoxDecoration( backgroundColor: Grey[50], - boxShadow: Shadow[level]), + boxShadow: shadows[level]), width: _kWidth, transform: transform, child: new Block(children) diff --git a/sdk/lib/framework/widgets/fixed_height_scrollable.dart b/sdk/lib/framework/widgets/fixed_height_scrollable.dart index 70df8523d8d..a12b2c96ec5 100644 --- a/sdk/lib/framework/widgets/fixed_height_scrollable.dart +++ b/sdk/lib/framework/widgets/fixed_height_scrollable.dart @@ -70,14 +70,9 @@ abstract class FixedHeightScrollable extends Scrollable { return new SizeObserver( callback: _handleSizeChanged, child: new ClipRect( - child: new DecoratedBox( - decoration: const BoxDecoration( - backgroundColor: const Color(0xFFFFFFFF) - ), - child: new Transform( - transform: transform, - child: new Block(buildItems(itemShowIndex, itemShowCount)) - ) + child: new Transform( + transform: transform, + child: new Block(buildItems(itemShowIndex, itemShowCount)) ) ) ); diff --git a/sdk/lib/framework/widgets/floating_action_button.dart b/sdk/lib/framework/widgets/floating_action_button.dart index 3aa91246656..dc3da829dbe 100644 --- a/sdk/lib/framework/widgets/floating_action_button.dart +++ b/sdk/lib/framework/widgets/floating_action_button.dart @@ -2,10 +2,9 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -import 'dart:sky' as sky; - -import '../painting/shadows.dart'; import '../theme2/colors.dart'; +import '../theme2/edges.dart'; +import 'button_base.dart'; import 'ink_well.dart'; import 'material.dart'; import 'wrappers.dart'; @@ -14,41 +13,26 @@ import 'wrappers.dart'; // http://www.google.com/design/spec/layout/metrics-keylines.html#metrics-keylines-keylines-spacing const double _kSize = 56.0; -class FloatingActionButton extends Component { +class FloatingActionButton extends ButtonBase { - FloatingActionButton({ Object key, this.content, this.level: 0 }) + FloatingActionButton({ Object key, this.child }) : super(key: key); - final UINode content; - final int level; - - UINode build() { - List children = []; - - if (content != null) - children.add(content); + final UINode child; + UINode buildContent() { return new Material( - content: new CustomPaint( - callback: (sky.Canvas canvas, Size size) { - const double radius = _kSize / 2.0; - sky.Paint paint = new sky.Paint()..color = Red[500]; - var builder = new ShadowDrawLooperBuilder() - ..addShadow(const sky.Size(0.0, 5.0), - const sky.Color(0x77000000), - 5.0); - paint.setDrawLooper(builder.build()); - canvas.drawCircle(radius, radius, radius, paint); - }, - child: new ClipOval( - child: new Container( - width: _kSize, - height: _kSize, - child: new InkWell(children: children) - ) + child: new ClipOval( + child: new Container( + width: _kSize, + height: _kSize, + child: new InkWell(child: new Center(child: child)) ) ), - level: level); + color: Red[500], + edge: MaterialEdge.circle, + level: highlight ? 3 : 2 + ); } } diff --git a/sdk/lib/framework/widgets/ink_well.dart b/sdk/lib/framework/widgets/ink_well.dart index 48188f52a93..5b28a7ff77e 100644 --- a/sdk/lib/framework/widgets/ink_well.dart +++ b/sdk/lib/framework/widgets/ink_well.dart @@ -8,7 +8,6 @@ import 'dart:sky' as sky; import '../animation/animated_value.dart'; import '../animation/curves.dart'; import '../rendering/box.dart'; -import '../rendering/flex.dart'; import '../rendering/object.dart'; import 'ui_node.dart'; import 'wrappers.dart'; @@ -100,27 +99,11 @@ class RenderInkWell extends RenderProxyBox { } } -class InkWellWrapper extends OneChildRenderObjectWrapper { - InkWellWrapper({ UINode child, Object key }) +class InkWell extends OneChildRenderObjectWrapper { + InkWell({ UINode child, Object key }) : super(child: child, key: key); RenderInkWell get root { RenderInkWell result = super.root; return result; } RenderInkWell createNode() => new RenderInkWell(); } - -class InkWell extends Component { - InkWell({ Object key, this.children }) : super(key: key); - - final List children; - - UINode build() { - return new InkWellWrapper( - child: new Flex( - children, - direction: FlexDirection.horizontal, - justifyContent: FlexJustifyContent.center - ) - ); - } -} diff --git a/sdk/lib/framework/widgets/material.dart b/sdk/lib/framework/widgets/material.dart index 89f3a56a198..3f53c1b452a 100644 --- a/sdk/lib/framework/widgets/material.dart +++ b/sdk/lib/framework/widgets/material.dart @@ -2,28 +2,39 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. +import '../painting/box_painter.dart'; +import '../theme2/colors.dart'; +import '../theme2/edges.dart'; +import '../theme2/shadows.dart'; import 'wrappers.dart'; class Material extends Component { - Material({ Object key, this.content, this.level: 0 }) : super(key: key); + Material({ + Object key, + this.child, + this.edge: MaterialEdge.card, + this.level: 0, + this.color + }) : super(key: key); - // static final List