From 17aeeb1c513d55be85081cf9b66ea5af375d28b0 Mon Sep 17 00:00:00 2001 From: Hixie Date: Thu, 14 May 2015 13:16:35 -0700 Subject: [PATCH] [Effen] Make the stock app use the radio button widget so that it's being tested. Changes: - adds a couple of radio buttons to the drawer menu list. - makes menu items support being tapped and reporting the tap. - hooks up the checkbox to actually support being checked. - changes the drawer menu items to make more sense in a stock app. R=eseidel@chromium.org Review URL: https://codereview.chromium.org/1137373004 --- examples/stocks/lib/stock_app.dart | 56 ++++++++++++++++++++++++----- framework/components/menu_item.dart | 38 +++++++++++--------- framework/fn.dart | 3 +- 3 files changed, 72 insertions(+), 25 deletions(-) diff --git a/examples/stocks/lib/stock_app.dart b/examples/stocks/lib/stock_app.dart index 2c63f6a073e..3b6ad62e8f5 100644 --- a/examples/stocks/lib/stock_app.dart +++ b/examples/stocks/lib/stock_app.dart @@ -13,6 +13,7 @@ import 'package:sky/framework/components/menu_divider.dart'; import 'package:sky/framework/components/menu_item.dart'; import 'package:sky/framework/components/modal_overlay.dart'; import 'package:sky/framework/components/popup_menu.dart'; +import 'package:sky/framework/components/radio.dart'; import 'package:sky/framework/components/scaffold.dart'; import 'package:sky/framework/fn.dart'; import 'package:sky/framework/theme/typography.dart' as typography; @@ -26,6 +27,8 @@ import 'package:sky/framework/layout.dart'; const bool debug = false; // set to true to dump the DOM for debugging purposes +enum StockMode { Optimistic, Pessimistic } + class StocksApp extends App { static final Style _actionBarStyle = new Style(''' @@ -100,6 +103,22 @@ class StocksApp extends App { }); } + bool _autorefresh = false; + void _handleAutorefreshChanged(bool value) { + setState(() { + _autorefresh = value; + }); + } + + StockMode _stockMode = StockMode.Optimistic; + void _handleStockModeChange(StockMode value) { + setState(() { + _stockMode = value; + }); + } + + static FlexBoxParentData _flex1 = new FlexBoxParentData()..flex = 1; + Drawer buildDrawer() { return new Drawer( controller: _drawerController, @@ -107,14 +126,31 @@ class StocksApp extends App { children: [ new DrawerHeader(children: [new Text('Stocks')]), new MenuItem( - key: 'Inbox', - icon: 'content/inbox', - children: [new Text('Inbox')]), - new MenuDivider(), + key: 'Stock list', + icon: 'action/assessment', + children: [new Text('Stock List')]), new MenuItem( - key: 'Drafts', - icon: 'content/drafts', - children: [new Text('Drafts')]), + key: 'Account Balance', + icon: 'action/account_balance', + children: [new Text('Account Balance')]), + new MenuDivider(key: 'div1'), + new MenuItem( + key: 'Optimistic Menu Item', + icon: 'action/thumb_up', + onGestureTap: (event) => _handleStockModeChange(StockMode.Optimistic), + children: [ + new ParentDataNode(new Text('Optimistic'), _flex1), + new Radio(key: 'optimistic-radio', value: StockMode.Optimistic, groupValue: _stockMode, onChanged: _handleStockModeChange) + ]), + new MenuItem( + key: 'Pessimistic Menu Item', + icon: 'action/thumb_down', + onGestureTap: (event) => _handleStockModeChange(StockMode.Pessimistic), + children: [ + new ParentDataNode(new Text('Pessimistic'), _flex1), + new Radio(key: 'pessimistic-radio', value: StockMode.Pessimistic, groupValue: _stockMode, onChanged: _handleStockModeChange) + ]), + new MenuDivider(key: 'div2'), new MenuItem( key: 'Settings', icon: 'action/settings', @@ -165,7 +201,11 @@ class StocksApp extends App { if (_menuController == null) return; overlays.add(new ModalOverlay( - children: [new StockMenu(controller: _menuController)], + children: [new StockMenu( + controller: _menuController, + autorefresh: _autorefresh, + onAutorefreshChanged: _handleAutorefreshChanged + )], onDismiss: _handleMenuHide)); } diff --git a/framework/components/menu_item.dart b/framework/components/menu_item.dart index 9f6ee033d05..8d7cda7c7f9 100644 --- a/framework/components/menu_item.dart +++ b/framework/components/menu_item.dart @@ -3,6 +3,7 @@ // found in the LICENSE file. import '../fn.dart'; +import '../layout.dart'; import 'button_base.dart'; import 'icon.dart'; import 'ink_well.dart'; @@ -32,27 +33,32 @@ class MenuItem extends ButtonBase { List children; String icon; + GestureEventListener onGestureTap; - MenuItem({ Object key, this.icon, this.children }) : super(key: key); + MenuItem({ Object key, this.icon, this.children, this.onGestureTap }) : super(key: key); UINode buildContent() { - return new StyleNode( - new InkWell( - children: [ - new StyleNode( - new Icon( - size: 24, - type: "${icon}_grey600" + return new EventListenerNode( + new StyleNode( + new InkWell( + children: [ + new StyleNode( + new Icon( + size: 24, + type: "${icon}_grey600" + ), + _iconStyle ), - _iconStyle - ), - new Container( - style: _labelStyle, - children: children - ) - ] + new FlexContainer( + direction: FlexDirection.Row, + style: _labelStyle, + children: children + ) + ] + ), + highlight ? _highlightStyle : _style ), - highlight ? _highlightStyle : _style + onGestureTap: onGestureTap ); } } diff --git a/framework/fn.dart b/framework/fn.dart index 906b7078ae6..3bc9dbbfcc5 100644 --- a/framework/fn.dart +++ b/framework/fn.dart @@ -358,7 +358,8 @@ abstract class SkyElementWrapper extends SkyNodeWrapper { if (!idSet.add(child._key)) { throw '''If multiple (non-Text) nodes of the same type exist as children - of another node, they must have unique keys.'''; + of another node, they must have unique keys. + Duplicate: "${child._key}"'''; } } return false;