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.
This commit is contained in:
Hixie 2015-06-12 11:46:08 -07:00
parent 6374d647c1
commit ef1b69d757
4 changed files with 31 additions and 33 deletions

View File

@ -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
),
];

View File

@ -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)
)
]);
);
}
}

View File

@ -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

View File

@ -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'),