Commit 27b5fc14 authored by Adam Barth's avatar Adam Barth

Scaffold should wrap its body in a Material

Fixes #1669
parent 88bcfa2d
...@@ -60,22 +60,20 @@ class AddressBookHome extends StatelessComponent { ...@@ -60,22 +60,20 @@ class AddressBookHome extends StatelessComponent {
static final GlobalKey noteKey = new GlobalKey(label: 'note field'); static final GlobalKey noteKey = new GlobalKey(label: 'note field');
Widget buildBody(BuildContext context) { Widget buildBody(BuildContext context) {
return new Material( return new Block([
child: new Block([ new AspectRatio(
new AspectRatio( aspectRatio: 16.0 / 9.0,
aspectRatio: 16.0 / 9.0, child: new Container(
child: new Container( decoration: new BoxDecoration(backgroundColor: Colors.purple[300])
decoration: new BoxDecoration(backgroundColor: Colors.purple[300]) )
) ),
), new Field(inputKey: nameKey, icon: "social/person", placeholder: "Name"),
new Field(inputKey: nameKey, icon: "social/person", placeholder: "Name"), new Field(inputKey: phoneKey, icon: "communication/phone", placeholder: "Phone"),
new Field(inputKey: phoneKey, icon: "communication/phone", placeholder: "Phone"), new Field(inputKey: emailKey, icon: "communication/email", placeholder: "Email"),
new Field(inputKey: emailKey, icon: "communication/email", placeholder: "Email"), new Field(inputKey: addressKey, icon: "maps/place", placeholder: "Address"),
new Field(inputKey: addressKey, icon: "maps/place", placeholder: "Address"), new Field(inputKey: ringtoneKey, icon: "av/volume_up", placeholder: "Ringtone"),
new Field(inputKey: ringtoneKey, icon: "av/volume_up", placeholder: "Ringtone"), new Field(inputKey: noteKey, icon: "content/add", placeholder: "Add note"),
new Field(inputKey: noteKey, icon: "content/add", placeholder: "Add note"), ]);
])
);
} }
Widget build(BuildContext context) { Widget build(BuildContext context) {
......
...@@ -14,13 +14,11 @@ class FitnessItemList extends StatelessComponent { ...@@ -14,13 +14,11 @@ class FitnessItemList extends StatelessComponent {
final FitnessItemHandler onDismissed; final FitnessItemHandler onDismissed;
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new Material( return new ScrollableList<FitnessItem>(
child: new ScrollableList<FitnessItem>( padding: const EdgeDims.all(4.0),
padding: const EdgeDims.all(4.0), items: items,
items: items, itemExtent: kFitnessItemHeight,
itemExtent: kFitnessItemHeight, itemBuilder: (_, item) => item.toRow(onDismissed: onDismissed)
itemBuilder: (_, item) => item.toRow(onDismissed: onDismissed)
)
); );
} }
} }
...@@ -171,14 +169,13 @@ class FeedFragmentState extends State<FeedFragment> { ...@@ -171,14 +169,13 @@ class FeedFragmentState extends State<FeedFragment> {
Widget buildBody() { Widget buildBody() {
TextStyle style = Theme.of(context).text.title; TextStyle style = Theme.of(context).text.title;
if (config.userData == null) if (config.userData == null)
return new Material(); return new Container();
if (config.userData.items.length == 0) if (config.userData.items.length == 0) {
return new Material( return new Row(
child: new Row( [new Text("No data yet.\nAdd some!", style: style)],
[new Text("No data yet.\nAdd some!", style: style)], justifyContent: FlexJustifyContent.center
justifyContent: FlexJustifyContent.center
)
); );
}
switch (_fitnessMode) { switch (_fitnessMode) {
case FitnessMode.feed: case FitnessMode.feed:
return new FitnessItemList( return new FitnessItemList(
...@@ -186,11 +183,9 @@ class FeedFragmentState extends State<FeedFragment> { ...@@ -186,11 +183,9 @@ class FeedFragmentState extends State<FeedFragment> {
onDismissed: _handleItemDismissed onDismissed: _handleItemDismissed
); );
case FitnessMode.chart: case FitnessMode.chart:
return new Material( return new Container(
child: new Container( padding: const EdgeDims.all(20.0),
padding: const EdgeDims.all(20.0), child: buildChart()
child: buildChart()
)
); );
} }
} }
......
...@@ -85,19 +85,17 @@ class MealFragmentState extends State<MealFragment> { ...@@ -85,19 +85,17 @@ class MealFragmentState extends State<MealFragment> {
Widget buildBody() { Widget buildBody() {
Meal meal = new Meal(when: new DateTime.now()); Meal meal = new Meal(when: new DateTime.now());
return new Material( return new ScrollableViewport(
child: new ScrollableViewport( child: new Container(
child: new Container( padding: const EdgeDims.all(20.0),
padding: const EdgeDims.all(20.0), child: new BlockBody([
child: new BlockBody([ new Text(meal.displayDate),
new Text(meal.displayDate), new Input(
new Input( key: descriptionKey,
key: descriptionKey, placeholder: 'Describe meal',
placeholder: 'Describe meal', onChanged: _handleDescriptionChanged
onChanged: _handleDescriptionChanged ),
), ])
])
)
) )
); );
} }
......
...@@ -172,28 +172,26 @@ class MeasurementFragmentState extends State<MeasurementFragment> { ...@@ -172,28 +172,26 @@ class MeasurementFragmentState extends State<MeasurementFragment> {
Widget buildBody(BuildContext context) { Widget buildBody(BuildContext context) {
Measurement measurement = new Measurement(when: _when); Measurement measurement = new Measurement(when: _when);
// TODO(jackson): Revisit the layout of this pane to be more maintainable // TODO(jackson): Revisit the layout of this pane to be more maintainable
return new Material( return new Container(
child: new Container( padding: const EdgeDims.all(20.0),
padding: const EdgeDims.all(20.0), child: new Column([
child: new Column([ new GestureDetector(
new GestureDetector( onTap: _handleDatePressed,
onTap: _handleDatePressed, child: new Container(
child: new Container( height: 50.0,
height: 50.0, child: new Column([
child: new Column([ new Text('Measurement Date'),
new Text('Measurement Date'), new Text(measurement.displayDate, style: Theme.of(context).text.caption),
new Text(measurement.displayDate, style: Theme.of(context).text.caption), ], alignItems: FlexAlignItems.start)
], alignItems: FlexAlignItems.start) )
) ),
), new Input(
new Input( key: weightKey,
key: weightKey, placeholder: 'Enter weight',
placeholder: 'Enter weight', keyboardType: KeyboardType.NUMBER,
keyboardType: KeyboardType.NUMBER, onChanged: _handleWeightChanged
onChanged: _handleWeightChanged ),
), ], alignItems: FlexAlignItems.stretch)
], alignItems: FlexAlignItems.stretch)
)
); );
} }
......
...@@ -92,29 +92,27 @@ class SettingsFragmentState extends State<SettingsFragment> { ...@@ -92,29 +92,27 @@ class SettingsFragmentState extends State<SettingsFragment> {
} }
Widget buildSettingsPane(BuildContext context) { Widget buildSettingsPane(BuildContext context) {
return new Material( return new ScrollableViewport(
child: new ScrollableViewport( child: new Container(
child: new Container( padding: const EdgeDims.symmetric(vertical: 20.0),
padding: const EdgeDims.symmetric(vertical: 20.0), child: new BlockBody([
child: new BlockBody([ new DrawerItem(
new DrawerItem( onPressed: () { _handleBackupChanged(!(config.userData.backupMode == BackupMode.enabled)); },
onPressed: () { _handleBackupChanged(!(config.userData.backupMode == BackupMode.enabled)); }, child: new Row([
child: new Row([ new Flexible(child: new Text('Back up data to the cloud')),
new Flexible(child: new Text('Back up data to the cloud')), new Switch(value: config.userData.backupMode == BackupMode.enabled, onChanged: _handleBackupChanged),
new Switch(value: config.userData.backupMode == BackupMode.enabled, onChanged: _handleBackupChanged), ])
]) ),
), new DrawerItem(
new DrawerItem( onPressed: () => _handleGoalWeightPressed(),
onPressed: () => _handleGoalWeightPressed(), child: new Column([
child: new Column([ new Text('Goal Weight'),
new Text('Goal Weight'), new Text(goalWeightText, style: Theme.of(context).text.caption),
new Text(goalWeightText, style: Theme.of(context).text.caption), ],
], alignItems: FlexAlignItems.start
alignItems: FlexAlignItems.start )
) ),
), ])
])
)
) )
); );
} }
......
...@@ -12,18 +12,16 @@ class StockList extends StatelessComponent { ...@@ -12,18 +12,16 @@ class StockList extends StatelessComponent {
final StockRowActionCallback onAction; final StockRowActionCallback onAction;
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new Material( return new ScrollableList<Stock>(
child: new ScrollableList<Stock>( items: stocks,
items: stocks, itemExtent: StockRow.kHeight,
itemExtent: StockRow.kHeight, itemBuilder: (BuildContext context, Stock stock) {
itemBuilder: (BuildContext context, Stock stock) { return new StockRow(
return new StockRow( stock: stock,
stock: stock, onPressed: onOpen,
onPressed: onOpen, onLongPressed: onAction
onLongPressed: onAction );
); }
}
)
); );
} }
} }
...@@ -83,35 +83,33 @@ class StockSettingsState extends State<StockSettings> { ...@@ -83,35 +83,33 @@ class StockSettingsState extends State<StockSettings> {
Widget buildSettingsPane(BuildContext context) { Widget buildSettingsPane(BuildContext context) {
// TODO(ianh): Once we have the gesture API hooked up, fix https://github.com/domokit/mojo/issues/281 // TODO(ianh): Once we have the gesture API hooked up, fix https://github.com/domokit/mojo/issues/281
// (whereby tapping the widgets below causes both the widget and the menu item to fire their callbacks) // (whereby tapping the widgets below causes both the widget and the menu item to fire their callbacks)
return new Material( return new ScrollableViewport(
child: new ScrollableViewport( child: new Container(
child: new Container( padding: const EdgeDims.symmetric(vertical: 20.0),
padding: const EdgeDims.symmetric(vertical: 20.0), child: new BlockBody(<Widget>[
child: new BlockBody(<Widget>[ new DrawerItem(
new DrawerItem( icon: 'action/thumb_up',
icon: 'action/thumb_up', onPressed: () => _confirmOptimismChange(),
onPressed: () => _confirmOptimismChange(), child: new Row(<Widget>[
child: new Row(<Widget>[ new Flexible(child: new Text('Everything is awesome')),
new Flexible(child: new Text('Everything is awesome')), new Checkbox(
new Checkbox( value: config.optimism == StockMode.optimistic,
value: config.optimism == StockMode.optimistic, onChanged: (bool value) => _confirmOptimismChange()
onChanged: (bool value) => _confirmOptimismChange() ),
), ])
]) ),
), new DrawerItem(
new DrawerItem( icon: 'action/backup',
icon: 'action/backup', onPressed: () { _handleBackupChanged(!(config.backup == BackupMode.enabled)); },
onPressed: () { _handleBackupChanged(!(config.backup == BackupMode.enabled)); }, child: new Row(<Widget>[
child: new Row(<Widget>[ new Flexible(child: new Text('Back up stock list to the cloud')),
new Flexible(child: new Text('Back up stock list to the cloud')), new Switch(
new Switch( value: config.backup == BackupMode.enabled,
value: config.backup == BackupMode.enabled, onChanged: _handleBackupChanged
onChanged: _handleBackupChanged ),
), ])
]) ),
), ])
])
)
) )
); );
} }
......
...@@ -32,24 +32,22 @@ class StockSymbolViewerState extends State<StockSymbolViewer> { ...@@ -32,24 +32,22 @@ class StockSymbolViewerState extends State<StockSymbolViewer> {
), ),
center: new Text('${config.stock.name} (${config.stock.symbol})') center: new Text('${config.stock.name} (${config.stock.symbol})')
), ),
body: new Material( body: new Block(<Widget>[
child: new Block(<Widget>[ new Container(
new Container( padding: new EdgeDims.all(20.0),
padding: new EdgeDims.all(20.0), child: new Column(<Widget>[
child: new Column(<Widget>[ new Text('Last Sale', style: headings),
new Text('Last Sale', style: headings), new Text('$lastSale ($changeInPrice)'),
new Text('$lastSale ($changeInPrice)'), new Container(
new Container( height: 8.0
height: 8.0 ),
), new Text('Market Cap', style: headings),
new Text('Market Cap', style: headings), new Text('${config.stock.marketCap}'),
new Text('${config.stock.marketCap}'), ],
], alignItems: FlexAlignItems.stretch
alignItems: FlexAlignItems.stretch
)
) )
]) )
) ])
); );
} }
......
...@@ -34,12 +34,10 @@ class DatePickerDemoState extends State<DatePickerDemo> { ...@@ -34,12 +34,10 @@ class DatePickerDemoState extends State<DatePickerDemo> {
child: new Stack([ child: new Stack([
new Scaffold( new Scaffold(
toolBar: new ToolBar(center: new Text("Date Picker")), toolBar: new ToolBar(center: new Text("Date Picker")),
body: new Material( body: new Row(
child: new Row( [new Text(_dateTime.toString())],
[new Text(_dateTime.toString())], alignItems: FlexAlignItems.end,
alignItems: FlexAlignItems.end, justifyContent: FlexJustifyContent.center
justifyContent: FlexJustifyContent.center
)
) )
), ),
new Dialog( new Dialog(
......
...@@ -103,26 +103,24 @@ class DragAndDropAppState extends State<DragAndDropApp> { ...@@ -103,26 +103,24 @@ class DragAndDropAppState extends State<DragAndDropApp> {
toolBar: new ToolBar( toolBar: new ToolBar(
center: new Text('Drag and Drop Flutter Demo') center: new Text('Drag and Drop Flutter Demo')
), ),
body: new Material( body: new DefaultTextStyle(
child: new DefaultTextStyle( style: Theme.of(context).text.body1.copyWith(textAlign: TextAlign.center),
style: Theme.of(context).text.body1.copyWith(textAlign: TextAlign.center), child: new Column([
child: new Column([ new Flexible(child: new Row([
new Flexible(child: new Row([ new ExampleDragSource(navigator: config.navigator, name: 'Orange', color: const Color(0xFFFF9000)),
new ExampleDragSource(navigator: config.navigator, name: 'Orange', color: const Color(0xFFFF9000)), new ExampleDragSource(navigator: config.navigator, name: 'Teal', color: const Color(0xFF00FFFF)),
new ExampleDragSource(navigator: config.navigator, name: 'Teal', color: const Color(0xFF00FFFF)), new ExampleDragSource(navigator: config.navigator, name: 'Yellow', color: const Color(0xFFFFF000)),
new ExampleDragSource(navigator: config.navigator, name: 'Yellow', color: const Color(0xFFFFF000)), ],
], alignItems: FlexAlignItems.center,
alignItems: FlexAlignItems.center, justifyContent: FlexJustifyContent.spaceAround
justifyContent: FlexJustifyContent.spaceAround )),
)), new Flexible(child: new Row([
new Flexible(child: new Row([ new Flexible(child: new ExampleDragTarget()),
new Flexible(child: new ExampleDragTarget()), new Flexible(child: new ExampleDragTarget()),
new Flexible(child: new ExampleDragTarget()), new Flexible(child: new ExampleDragTarget()),
new Flexible(child: new ExampleDragTarget()), new Flexible(child: new ExampleDragTarget()),
new Flexible(child: new ExampleDragTarget()), ])),
])), ])
])
)
) )
); );
} }
......
...@@ -40,14 +40,11 @@ class IndexedStackDemoState extends State<IndexedStackDemo> { ...@@ -40,14 +40,11 @@ class IndexedStackDemoState extends State<IndexedStackDemo> {
toolBar: new ToolBar(center: new Text('IndexedStackDemo Demo')), toolBar: new ToolBar(center: new Text('IndexedStackDemo Demo')),
body: new GestureDetector( body: new GestureDetector(
onTap: _handleTap, onTap: _handleTap,
child: new Container( child: new Center(
decoration: new BoxDecoration(backgroundColor: Theme.of(context).primarySwatch[50]), child: new Container(
child: new Center( child: indexedStack,
child: new Container( padding: const EdgeDims.all(8.0),
child: indexedStack, decoration: new BoxDecoration(border: new Border.all(color: Theme.of(context).accentColor))
padding: const EdgeDims.all(8.0),
decoration: new BoxDecoration(border: new Border.all(color: Theme.of(context).accentColor))
)
) )
) )
) )
......
...@@ -139,7 +139,6 @@ class OverlayGeometryAppState extends State<OverlayGeometryApp> { ...@@ -139,7 +139,6 @@ class OverlayGeometryAppState extends State<OverlayGeometryApp> {
toolBar: new ToolBar(center: new Text('Tap a Card')), toolBar: new ToolBar(center: new Text('Tap a Card')),
body: new Container( body: new Container(
padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0), padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0),
decoration: new BoxDecoration(backgroundColor: Theme.of(context).primarySwatch[50]),
child: new ScrollableMixedWidgetList( child: new ScrollableMixedWidgetList(
builder: builder, builder: builder,
token: cardModels.length, token: cardModels.length,
......
...@@ -137,10 +137,7 @@ class PageableListAppState extends State<PageableListApp> { ...@@ -137,10 +137,7 @@ class PageableListAppState extends State<PageableListApp> {
); );
return new SizeObserver( return new SizeObserver(
callback: updatePageSize, callback: updatePageSize,
child: new Container( child: list
child: list,
decoration: new BoxDecoration(backgroundColor: Theme.of(context).primarySwatch[50])
)
); );
} }
......
...@@ -82,7 +82,6 @@ class ProgressIndicatorAppState extends State<ProgressIndicatorApp> { ...@@ -82,7 +82,6 @@ class ProgressIndicatorAppState extends State<ProgressIndicatorApp> {
onTap: handleTap, onTap: handleTap,
child: new Container( child: new Container(
padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0), padding: const EdgeDims.symmetric(vertical: 12.0, horizontal: 8.0),
decoration: new BoxDecoration(backgroundColor: Theme.of(context).cardColor),
child: new BuilderTransition( child: new BuilderTransition(
variables: [valueAnimation.variable], variables: [valueAnimation.variable],
performance: valueAnimation.view, performance: valueAnimation.view,
......
...@@ -60,12 +60,10 @@ class ScaleAppState extends State<ScaleApp> { ...@@ -60,12 +60,10 @@ class ScaleAppState extends State<ScaleApp> {
child: new Scaffold( child: new Scaffold(
toolBar: new ToolBar( toolBar: new ToolBar(
center: new Text('Scale Demo')), center: new Text('Scale Demo')),
body: new Material( body: new GestureDetector(
child: new GestureDetector( onScaleStart: _handleScaleStart,
onScaleStart: _handleScaleStart, onScaleUpdate: _handleScaleUpdate,
onScaleUpdate: _handleScaleUpdate, child: new CustomPaint(callback: paint, token: "$_zoom $_offset")
child: new CustomPaint(callback: paint, token: "$_zoom $_offset")
)
) )
) )
); );
......
...@@ -49,7 +49,6 @@ class ScrollbarAppState extends State<ScrollbarApp> { ...@@ -49,7 +49,6 @@ class ScrollbarAppState extends State<ScrollbarApp> {
return new Scaffold( return new Scaffold(
toolBar: new ToolBar(center: new Text('Scrollbar Demo')), toolBar: new ToolBar(center: new Text('Scrollbar Demo')),
body: new Container( body: new Container(
decoration: new BoxDecoration(backgroundColor: Theme.of(context).primarySwatch[50]),
padding: new EdgeDims.all(12.0), padding: new EdgeDims.all(12.0),
child: new Center(child: new Card(child: scrollable)) child: new Center(child: new Card(child: scrollable))
) )
......
...@@ -68,56 +68,54 @@ class SectorAppState extends State<SectorApp> { ...@@ -68,56 +68,54 @@ class SectorAppState extends State<SectorApp> {
} }
Widget buildBody() { Widget buildBody() {
return new Material( return new Column(<Widget>[
child: new Column(<Widget>[ new Container(
new Container( padding: new EdgeDims.symmetric(horizontal: 8.0, vertical: 25.0),
padding: new EdgeDims.symmetric(horizontal: 8.0, vertical: 25.0), child: new Row(<Widget>[
child: new Row(<Widget>[ new RaisedButton(
new RaisedButton( enabled: _enabledAdd,
enabled: _enabledAdd, child: new IntrinsicWidth(
child: new IntrinsicWidth( child: new Row(<Widget>[
child: new Row(<Widget>[ new Container(
new Container( padding: new EdgeDims.all(4.0),
padding: new EdgeDims.all(4.0), margin: new EdgeDims.only(right: 10.0),
margin: new EdgeDims.only(right: 10.0), child: new WidgetToRenderBoxAdapter(sectorAddIcon)
child: new WidgetToRenderBoxAdapter(sectorAddIcon) ),
), new Text('ADD SECTOR'),
new Text('ADD SECTOR'), ])
])
),
onPressed: addSector
), ),
new RaisedButton( onPressed: addSector
enabled: _enabledRemove,
child: new IntrinsicWidth(
child: new Row(<Widget>[
new Container(
padding: new EdgeDims.all(4.0),
margin: new EdgeDims.only(right: 10.0),
child: new WidgetToRenderBoxAdapter(sectorRemoveIcon)
),
new Text('REMOVE SECTOR'),
])
),
onPressed: removeSector
)
],
justifyContent: FlexJustifyContent.spaceAround
)
),
new Flexible(
child: new Container(
margin: new EdgeDims.all(8.0),
decoration: new BoxDecoration(
border: new Border.all(color: new Color(0xFF000000))
), ),
padding: new EdgeDims.all(8.0), new RaisedButton(
child: new WidgetToRenderBoxAdapter(sectors) enabled: _enabledRemove,
) child: new IntrinsicWidth(
), child: new Row(<Widget>[
], new Container(
justifyContent: FlexJustifyContent.spaceBetween padding: new EdgeDims.all(4.0),
) margin: new EdgeDims.only(right: 10.0),
child: new WidgetToRenderBoxAdapter(sectorRemoveIcon)
),
new Text('REMOVE SECTOR'),
])
),
onPressed: removeSector
)
],
justifyContent: FlexJustifyContent.spaceAround
)
),
new Flexible(
child: new Container(
margin: new EdgeDims.all(8.0),
decoration: new BoxDecoration(
border: new Border.all(color: new Color(0xFF000000))
),
padding: new EdgeDims.all(8.0),
child: new WidgetToRenderBoxAdapter(sectors)
)
),
],
justifyContent: FlexJustifyContent.spaceBetween
); );
} }
......
...@@ -96,9 +96,8 @@ class TabbedNavigatorAppState extends State<TabbedNavigatorApp> { ...@@ -96,9 +96,8 @@ class TabbedNavigatorAppState extends State<TabbedNavigatorApp> {
Container _buildCard(BuildContext context, TabNavigator tabNavigator) { Container _buildCard(BuildContext context, TabNavigator tabNavigator) {
return new Container( return new Container(
child: new Card(child: new Padding(child: tabNavigator, padding: const EdgeDims.all(8.0))), padding: const EdgeDims.all(12.0),
padding: const EdgeDims.all(12.0), child: new Card(child: new Padding(child: tabNavigator, padding: const EdgeDims.all(8.0)))
decoration: new BoxDecoration(backgroundColor: Theme.of(context).primarySwatch[100])
); );
} }
......
...@@ -7,6 +7,7 @@ import 'dart:ui' as ui; ...@@ -7,6 +7,7 @@ import 'dart:ui' as ui;
import 'package:flutter/widgets.dart'; import 'package:flutter/widgets.dart';
import 'constants.dart'; import 'constants.dart';
import 'material.dart';
class Scaffold extends StatelessComponent { class Scaffold extends StatelessComponent {
Scaffold({ Scaffold({
...@@ -38,7 +39,9 @@ class Scaffold extends StatelessComponent { ...@@ -38,7 +39,9 @@ class Scaffold extends StatelessComponent {
if (body != null) { if (body != null) {
children.add(new Positioned( children.add(new Positioned(
top: toolBarHeight, right: 0.0, bottom: statusBarHeight, left: 0.0, top: toolBarHeight, right: 0.0, bottom: statusBarHeight, left: 0.0,
child: body child: new Material(
child: body
)
)); ));
} }
......
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