Add a menu to the stocks app

We should probably move this menu into a view for an individual stock, but for
now add it to the main stock screen.

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

Review URL: https://codereview.chromium.org/1008003007

examples/stocks-fn/lib/stock_app.dart

@@ -14,6 +14,7 @@ import 'package:sky/framework/fn.dart';
 import 'package:sky/framework/theme/typography.dart' as typography;
 import 'stock_data.dart';
 import 'stock_list.dart';
+import 'stock_menu.dart';
 
 class StocksApp extends App {
 
@@ -39,6 +40,7 @@ class StocksApp extends App {
 
   List<Stock> _sortedStocks;
   bool _isSearching = false;
+  bool _isShowingMenu = false;
   String _searchQuery;
 
   StocksApp() : super() {
@@ -52,6 +54,12 @@ class StocksApp extends App {
     });
   }
 
+  void _handleMenuClick(_) {
+    setState(() {
+      _isShowingMenu = !_isShowingMenu;
+    });
+  }
+
   void _handleSearchQueryChanged(query) {
     setState(() {
       _searchQuery = query;
@@ -116,6 +124,7 @@ class StocksApp extends App {
         new Icon(key: 'more_white', style: _iconStyle,
             size: 24,
             type: 'navigation/more_vert_white')
+          ..events.listen('gesturetap', _handleMenuClick),
       ]
     );
 
@@ -124,17 +133,19 @@ class StocksApp extends App {
     var fab = new FloatingActionButton(content: new Icon(
       type: 'content/add_white', size: 24), level: 3);
 
-    return new Container(
-      key: 'StocksApp',
-      children: [
+    var children = [
       new Container(
         key: 'Content',
         style: _style,
         children: [toolbar, list]
       ),
       fab,
-        drawer,
-      ]
-    );
+      drawer
+    ];
+
+    if (_isShowingMenu)
+      children.add(new StockMenu());
+
+    return new Container(key: 'StocksApp', children: children);
   }
 }

examples/stocks-fn/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 'package:sky/framework/components/popup_menu.dart';
+import 'package:sky/framework/fn.dart';
+import 'package:sky/framework/theme/view-configuration.dart';
+import 'stock_arrow.dart';
+import 'stock_data.dart';
+
+class StockMenu extends Component {
+  static final Style _style = new Style('''
+    position: absolute;
+    right: 8px;
+    top: ${8 + kStatusBarHeight}px;''');
+
+  StockMenu({Object key}) : super(key: key);
+
+  Node build() {
+    return new Container(
+      style: _style,
+      children: [
+        new PopupMenu(
+          items: [
+            [new Text('Add stock')],
+            [new Text('Remove stock')],
+            [new Text('Help & feeback')],
+          ],
+          level: 4)
+      ]
+    );
+  }
+}

examples/widgets-fn/widgets_app.dart

@@ -5,7 +5,6 @@
 import '../../framework/fn.dart';
 import '../../framework/components/button.dart';
 import '../../framework/components/popup_menu.dart';
-import '../../framework/components/popup_menu_item.dart';
 
 class WidgetsApp extends App {
   static final Style _menuStyle = new Style('''
@@ -22,14 +21,14 @@ class WidgetsApp extends App {
           style: _menuStyle,
           children: [
             new PopupMenu(
-              children: [
-                  new PopupMenuItem(key: '1', children: [new Text('People & options')]),
-                  new PopupMenuItem(key: '2', children: [new Text('New group conversation')]),
-                  new PopupMenuItem(key: '3', children: [new Text('Turn history off')]),
-                  new PopupMenuItem(key: '4', children: [new Text('Archive')]),
-                  new PopupMenuItem(key: '5', children: [new Text('Delete')]),
-                  new PopupMenuItem(key: '6', children: [new Text('Un-merge SMS')]),
-                  new PopupMenuItem(key: '7', children: [new Text('Help & feeback')]),
+              items: [
+                [new Text('People & options')],
+                [new Text('New group conversation')],
+                [new Text('Turn history off')],
+                [new Text('Archive')],
+                [new Text('Delete')],
+                [new Text('Un-merge SMS')],
+                [new Text('Help & feeback')],
               ],
               level: 4),
             ]