Add CheckedPopupMenuitem, update the Stocks demo

examples/material_gallery/lib/demo/menu_demo.dart

@@ -94,7 +94,7 @@ class MenuDemoState extends State<MenuDemo> {
                   child: new Text('Context menu item one')
                 ),
                 new PopupMenuItem(
-                  disabled: true,
+                  isDisabled: true,
                   child: new Text('A disabled menu item')
                 ),
                 new PopupMenuItem(
@@ -176,34 +176,26 @@ class MenuDemoState extends State<MenuDemo> {
             right: new PopupMenuButton<String>(
               onSelected: showCheckedMenuSelections,
               items: <PopupMenuItem>[
-                new PopupMenuItem(
+                new CheckedPopupMenuItem(
                   value: _checkedValue1,
-                  child: new ListItem(
-                      left: new Icon(icon: isChecked(_checkedValue1) ? 'action/done' : null),
-                    primary: new Text(_checkedValue1)
-                  )
+                  isChecked: isChecked(_checkedValue1),
+                  child: new Text(_checkedValue1)
                 ),
-                new PopupMenuItem(
-                  value: _checkedValue2,
-                  child: new ListItem(
-                    left: new Icon(icon: isChecked(_checkedValue2) ? 'action/done' : null),
-                    primary: new Text(_checkedValue2)
-                  )
+                new CheckedPopupMenuItem(
+                  isDisabled: true,
+                  isChecked: isChecked(_checkedValue2),
+                  child: new Text(_checkedValue2)
                 ),
-                new PopupMenuItem(
+                new CheckedPopupMenuItem(
                   value: _checkedValue3,
-                  child: new ListItem(
-                    left: new Icon(icon: isChecked(_checkedValue3) ? 'action/done' : null),
-                    primary: new Text(_checkedValue3)
-                  )
+                  isChecked: isChecked(_checkedValue3),
+                  child: new Text(_checkedValue3)
                 ),
-                new PopupMenuItem(
+                new CheckedPopupMenuItem(
                   value: _checkedValue4,
-                  child: new ListItem(
-                    left: new Icon(icon: isChecked(_checkedValue4) ? 'action/done' : null),
-                    primary: new Text(_checkedValue4)
-                  )
-                ),
+                  isChecked: isChecked(_checkedValue4),
+                  child: new Text(_checkedValue4)
+                )
               ]
             )
           )

examples/stocks/flutter.yaml

@@ -6,6 +6,7 @@ material-design-icons:
   - name: action/account_balance
   - name: action/assessment
   - name: action/backup
+  - name: action/done
   - name: action/help
   - name: action/picture_in_picture
   - name: action/search

examples/stocks/lib/stock_home.dart

@@ -6,18 +6,50 @@ import 'dart:collection';
 
 import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart' show debugDumpRenderTree, debugDumpLayerTree, debugDumpSemanticsTree;
-
+import 'package:flutter/scheduler.dart' show timeDilation;
 import 'stock_data.dart';
 import 'stock_list.dart';
-import 'stock_menu.dart';
 import 'stock_strings.dart';
 import 'stock_symbol_viewer.dart';
 import 'stock_types.dart';
 
 typedef void ModeUpdater(StockMode mode);
 
+enum _StockMenuItem { autorefresh, refresh, speedUp, speedDown }
 enum StockHomeTab { market, portfolio }
 
+class _NotImplementedDialog extends StatelessComponent {
+  Widget build(BuildContext context) {
+    return new Dialog(
+      title: new Text('Not Implemented'),
+      content: new Text('This feature has not yet been implemented.'),
+      actions: <Widget>[
+        new FlatButton(
+          child: new Row(
+            children: <Widget>[
+              new Icon(
+                icon: 'device/dvr',
+                size: IconSize.s18
+              ),
+              new Container(
+                width: 8.0
+              ),
+              new Text('DUMP APP TO CONSOLE'),
+            ]
+          ),
+          onPressed: () { debugDumpApp(); }
+        ),
+        new FlatButton(
+          child: new Text('OH WELL'),
+          onPressed: () {
+            Navigator.pop(context, false);
+          }
+        )
+      ]
+    );
+  }
+}
+
 class StockHome extends StatefulComponent {
   const StockHome(this.stocks, this.symbols, this.configuration, this.updater);
 
@@ -34,6 +66,7 @@ class StockHomeState extends State<StockHome> {
   final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
   bool _isSearching = false;
   InputValue _searchQuery = InputValue.empty;
+  bool _autorefresh = false;
 
   void _handleSearchBegin() {
     ModalRoute.of(context).addLocalHistoryEntry(new LocalHistoryEntry(
@@ -59,24 +92,31 @@ class StockHomeState extends State<StockHome> {
     });
   }
 
-  bool _autorefresh = false;
-  void _handleAutorefreshChanged(bool value) {
-    setState(() {
-      _autorefresh = value;
-    });
-  }
-
   void _handleStockModeChange(StockMode value) {
     if (config.updater != null)
       config.updater(config.configuration.copyWith(stockMode: value));
   }
 
-  void _handleMenuShow() {
-    showStockMenu(
-      context: context,
-      autorefresh: _autorefresh,
-      onAutorefreshChanged: _handleAutorefreshChanged
-    );
+  void _handleStockMenu(BuildContext context, _StockMenuItem value) {
+    switch(value) {
+      case _StockMenuItem.autorefresh:
+        setState(() {
+          _autorefresh = !_autorefresh;
+        });
+        break;
+      case _StockMenuItem.refresh:
+        showDialog(
+          context: context,
+          child: new _NotImplementedDialog()
+        );
+        break;
+      case _StockMenuItem.speedUp:
+        timeDilation /= 5.0;
+        break;
+      case _StockMenuItem.speedDown:
+        timeDilation *= 5.0;
+        break;
+    }
   }
 
   Widget _buildDrawer(BuildContext context) {
@@ -176,10 +216,27 @@ class StockHomeState extends State<StockHome> {
           onPressed: _handleSearchBegin,
           tooltip: 'Search'
         ),
-        new IconButton(
-          icon: "navigation/more_vert",
-          onPressed: _handleMenuShow,
-          tooltip: 'Show menu'
+        new PopupMenuButton<_StockMenuItem>(
+          onSelected: (_StockMenuItem value) { _handleStockMenu(context, value); },
+          items: <PopupMenuItem>[
+            new CheckedPopupMenuItem(
+              value: _StockMenuItem.autorefresh,
+              isChecked: _autorefresh,
+              child: new Text('Autorefresh')
+            ),
+            new PopupMenuItem(
+              value: _StockMenuItem.refresh,
+              child: new Text('Refresh')
+            ),
+            new PopupMenuItem(
+              value: _StockMenuItem.speedUp,
+              child: new Text('Increase animation speed')
+            ),
+            new PopupMenuItem(
+              value: _StockMenuItem.speedDown,
+              child: new Text('Decrease animation speed')
+            )
+          ]
         )
       ],
       tabBar: new TabBar<StockHomeTab>(

examples/stocks/lib/stock_menu.dart

-// 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 'dart:async';
-import 'dart:ui' as ui show window;
-
-import 'package:flutter/material.dart';
-import 'package:flutter/scheduler.dart' show timeDilation;
-
-enum _MenuItems { autorefresh, autorefreshCheckbox, refresh, speedUp, speedDown }
-
-const double _kMenuMargin = 16.0; // 24.0 on tablet
-
-Future showStockMenu({BuildContext context, bool autorefresh, ValueChanged<bool> onAutorefreshChanged }) async {
-  StateSetter autorefreshStateSetter;
-  switch (await showMenu(
-    context: context,
-    position: new ModalPosition(
-      right: ui.window.padding.right + _kMenuMargin,
-      top: ui.window.padding.top + _kMenuMargin
-    ),
-    items: <PopupMenuItem>[
-      new PopupMenuItem(
-        value: _MenuItems.autorefresh,
-        child: new Row(
-          children: <Widget>[
-            new Flexible(child: new Text('Autorefresh')),
-            new StatefulBuilder(
-              builder: (BuildContext context, StateSetter setState) {
-                autorefreshStateSetter = setState;
-                return new Checkbox(
-                  value: autorefresh,
-                  onChanged: (bool value) {
-                    setState(() {
-                      autorefresh = value;
-                    });
-                    Navigator.pop(context, _MenuItems.autorefreshCheckbox);
-                  }
-                );
-              }
-            )
-          ]
-        )
-      ),
-      new PopupMenuItem(
-        value: _MenuItems.refresh,
-        child: new Text('Refresh')
-      ),
-      new PopupMenuItem(
-        value: _MenuItems.speedUp,
-        child: new Text('Increase animation speed')
-      ),
-      new PopupMenuItem(
-        value: _MenuItems.speedDown,
-        child: new Text('Decrease animation speed')
-      ),
-    ]
-  )) {
-    case _MenuItems.autorefresh:
-      autorefreshStateSetter(() {
-        autorefresh = !autorefresh;
-      });
-      continue autorefreshNotify;
-    autorefreshNotify:
-    case _MenuItems.autorefreshCheckbox:
-      onAutorefreshChanged(autorefresh);
-      break;
-    case _MenuItems.speedUp:
-      timeDilation /= 5.0;
-      break;
-    case _MenuItems.speedDown:
-      timeDilation *= 5.0;
-      break;
-    case _MenuItems.refresh:
-      await showDialog(
-        context: context,
-        child: new Dialog(
-          title: new Text('Not Implemented'),
-          content: new Text('This feature has not yet been implemented.'),
-          actions: <Widget>[
-            new FlatButton(
-              child: new Row(
-                children: <Widget>[
-                  new Icon(
-                    icon: 'device/dvr',
-                    size: IconSize.s18
-                  ),
-                  new Container(
-                    width: 8.0
-                  ),
-                  new Text('DUMP APP TO CONSOLE'),
-                ]
-              ),
-              onPressed: () { debugDumpApp(); }
-            ),
-            new FlatButton(
-              child: new Text('OH WELL'),
-              onPressed: () {
-                Navigator.pop(context, false);
-              }
-            ),
-          ]
-        )
-      );
-      break;
-    default:
-      // menu was canceled.
-  }
-}

packages/flutter/lib/src/material/list_item.dart

@@ -23,6 +23,7 @@ class ListItem extends StatelessComponent {
     this.right,
     this.isThreeLine: false,
     this.isDense: false,
+    this.isDisabled: false,
     this.onTap,
     this.onLongPress
   }) : super(key: key) {
@@ -36,11 +37,17 @@ class ListItem extends StatelessComponent {
   final Widget right;
   final bool isThreeLine;
   final bool isDense;
+  final bool isDisabled;
   final GestureTapCallback onTap;
   final GestureLongPressCallback onLongPress;
 
   TextStyle primaryTextStyle(BuildContext context) {
-    final TextStyle style = Theme.of(context).text.subhead;
+    final ThemeData theme = Theme.of(context);
+    final TextStyle style = theme.text.subhead;
+    if (isDisabled) {
+      final Color color = theme.disabledColor;
+      return isDense ? style.copyWith(fontSize: 13.0, color: color) : style.copyWith(color: color);
+    }
     return isDense ? style.copyWith(fontSize: 13.0) : style;
   }
 
@@ -113,8 +120,8 @@ class ListItem extends StatelessComponent {
     }
 
     return new InkWell(
-      onTap: onTap,
-      onLongPress: onLongPress,
+      onTap: isDisabled ? null : onTap,
+      onLongPress: isDisabled ? null : onLongPress,
       child: new Container(
         height: itemHeight,
         padding: const EdgeDims.symmetric(horizontal: 16.0),

packages/flutter/lib/src/material/popup_menu.dart

@@ -6,8 +6,12 @@ import 'dart:async';
 
 import 'package:flutter/widgets.dart';
 
+import 'icon.dart';
 import 'icon_button.dart';
+import 'icon_theme.dart';
+import 'icon_theme_data.dart';
 import 'ink_well.dart';
+import 'list_item.dart';
 import 'material.dart';
 import 'theme.dart';
 
@@ -21,27 +25,43 @@ const double _kMenuMinWidth = 2.0 * _kMenuWidthStep;
 const double _kMenuVerticalPadding = 8.0;
 const double _kMenuWidthStep = 56.0;
 const double _kMenuScreenPadding = 8.0;
+const double _kDisabledIconOpacity = 0.38;
 
 class PopupMenuItem<T> extends StatelessComponent {
   PopupMenuItem({
     Key key,
     this.value,
-    this.disabled: false,
+    this.isDisabled: false,
     this.hasDivider: false,
     this.child
   }) : super(key: key);
 
   final T value;
-  final bool disabled;
+  final bool isDisabled;
   final bool hasDivider;
   final Widget child;
 
   Widget build(BuildContext context) {
     final ThemeData theme = Theme.of(context);
     TextStyle style = theme.text.subhead;
-    if (disabled)
+    if (isDisabled)
       style = style.copyWith(color: theme.disabledColor);
 
+    Widget item = new DefaultTextStyle(
+      style: style,
+      child: new Baseline(
+        baseline: _kMenuItemHeight - _kBaselineOffsetFromBottom,
+        child: child
+      )
+    );
+    if (isDisabled) {
+      final bool isDark = theme.brightness == ThemeBrightness.dark;
+      item = new IconTheme(
+        data: new IconThemeData(opacity: isDark ? 0.5 : 0.38),
+        child: item
+      );
+    }
+
     return new MergeSemantics(
       child: new Container(
         height: _kMenuItemHeight,
@@ -49,18 +69,31 @@ class PopupMenuItem<T> extends StatelessComponent {
         decoration: !hasDivider ? null : new BoxDecoration(
           border: new Border(bottom: new BorderSide(color: theme.dividerColor))
         ),
-        child: new DefaultTextStyle(
-          style: style,
-          child: new Baseline(
-            baseline: _kMenuItemHeight - _kBaselineOffsetFromBottom,
-            child: child
-          )
-        )
+        child: item
       )
     );
   }
 }
 
+class CheckedPopupMenuItem<T> extends PopupMenuItem<T> {
+  CheckedPopupMenuItem({
+    Key key,
+    T value,
+    isChecked: false,
+    bool isDisabled: false,
+    Widget child
+  }) : super(
+    key: key,
+    value: value,
+    isDisabled: isDisabled,
+    child: new ListItem(
+      isDisabled: isDisabled,
+      left: new Icon(icon: isChecked ? 'action/done' : null),
+      primary: child
+    )
+  );
+}
+
 class _PopupMenu<T> extends StatelessComponent {
   _PopupMenu({
     Key key,
@@ -80,7 +113,7 @@ class _PopupMenu<T> extends StatelessComponent {
         parent: route.animation,
         curve: new Interval(start, end)
       );
-      final bool disabled = route.items[i].disabled;
+      final bool isDisabled = route.items[i].isDisabled;
       Widget item = route.items[i];
       if (route.initialValue != null && route.initialValue == route.items[i].value) {
         item = new Container(
@@ -91,7 +124,7 @@ class _PopupMenu<T> extends StatelessComponent {
       children.add(new FadeTransition(
         opacity: opacity,
         child: new InkWell(
-          onTap: disabled ? null : () { Navigator.pop(context, route.items[i].value); },
+          onTap: isDisabled ? null : () { Navigator.pop(context, route.items[i].value); },
           child: item
         )
       ));
@@ -298,7 +331,7 @@ class _PopupMenuButtonState<T> extends State<PopupMenuButton<T>> {
       )
     )
     .then((T value) {
-      if (config.onSelected != null)
+      if (value != null && config.onSelected != null)
         config.onSelected(value);
     });
   }