firka/flutter
firka/flutter
5
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Introduce Scaffold to Sky framework

Browse Source 
This CL extracts a Scaffold component from StockApp. The Scaffold component
lets you create an "app-like" layout with an action bar, a drawer, etc.

R=ojan@chromium.org, rafaelw@chromium.org

Review URL: https://codereview.chromium.org/1027813002
This commit is contained in:
Adam Barth 2015-03-20 09:34:06 -07:00
parent 7ff22a955c
commit f65ff7f4e5
1 changed files with 13 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
examples/stocks-fn/lib/stock_app.dart
View File

@ -11,6 +11,7 @@ import 'package:sky/framework/components/input.dart';
import 'package:sky/framework/components/menu_divider.dart'; import 'package:sky/framework/components/menu_divider.dart';
import 'package:sky/framework/components/menu_item.dart'; import 'package:sky/framework/components/menu_item.dart';
import 'package:sky/framework/components/popup_menu.dart'; import 'package:sky/framework/components/popup_menu.dart';
import 'package:sky/framework/components/scaffold.dart';
import 'package:sky/framework/fn.dart'; import 'package:sky/framework/fn.dart';
import 'package:sky/framework/theme/typography.dart' as typography; import 'package:sky/framework/theme/typography.dart' as typography;
import 'stock_data.dart'; import 'stock_data.dart';
@ -22,14 +23,6 @@ class StocksApp extends App {
DrawerController _drawerController = new DrawerController(); DrawerController _drawerController = new DrawerController();
PopupMenuController _menuController; PopupMenuController _menuController;
static Style _style = new Style('''
display: flex;
flex-direction: column;
height: -webkit-fill-available;
${typography.typeface};
${typography.black.body1};'''
);
static Style _iconStyle = new Style(''' static Style _iconStyle = new Style('''
padding: 8px;''' padding: 8px;'''
); );
@ -40,10 +33,6 @@ class StocksApp extends App {
${typography.white.title};''' ${typography.white.title};'''
); );
static Style _stocklistHeight = new Style('''
flex: 1;'''
);
List<Stock> _sortedStocks; List<Stock> _sortedStocks;
bool _isSearching = false; bool _isSearching = false;
bool _isShowingMenu = false; bool _isShowingMenu = false;
@ -114,7 +103,7 @@ class StocksApp extends App {
title = new Text('Stocks'); title = new Text('Stocks');
} }
var toolbar = new ActionBar( var actionBar = new ActionBar(
children: [ children: [
new EventTarget( new EventTarget(
new Icon(key: 'menu', style: _iconStyle, new Icon(key: 'menu', style: _iconStyle,
@ -141,25 +130,10 @@ class StocksApp extends App {
] ]
); );
var list = new StyleNode( List<Node> overlays = [];
new Stocklist(stocks: _sortedStocks, query: _searchQuery),
_stocklistHeight);
var fab = new FloatingActionButton(content: new Icon(
type: 'content/add_white', size: 24), level: 3);
var children = [
new Container(
key: 'Content',
style: _style,
children: [toolbar, list]
),
fab,
drawer
];
if (_menuController != null) { if (_menuController != null) {
var menu = new EventTarget( overlays.add(new EventTarget(
new StockMenu(controller: _menuController), new StockMenu(controller: _menuController),
onGestureTap: (_) { onGestureTap: (_) {
// TODO(abarth): We should close the menu when you tap away from the // TODO(abarth): We should close the menu when you tap away from the
@ -169,10 +143,16 @@ class StocksApp extends App {
_menuController = null; _menuController = null;
}); });
} }
); ));
children.add(menu);
} }
return new Container(key: 'StocksApp', children: children); return new Scaffold(
actionBar: actionBar,
content: new Stocklist(stocks: _sortedStocks, query: _searchQuery),
fab: new FloatingActionButton(
content: new Icon(type: 'content/add_white', size: 24), level: 3),
drawer: drawer,
overlays: overlays
);
} }
} }