Merge pull request #2021 from HansMuller/tooltip

Tooltip Gallery demo

examples/material_gallery/lib/demo/tooltip_demo.dart

+// Copyright 2016 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:flutter/material.dart';
+
+const String _introText =
+  "Tooltips are short identifying messages that briefly appear in response to "
+  "a long press. Tooltip messages are also used by services that make Flutter "
+  "apps accessible, like screen readers.";
+
+class TooltipDemo extends StatelessComponent {
+  Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
+    return new Scaffold(
+      toolBar: new ToolBar(
+        center: new Text('Tooltip')
+      ),
+      body: new Builder(
+        builder: (BuildContext context) {
+          return new Column(
+            alignItems: FlexAlignItems.stretch,
+            children: <Widget>[
+              new Text(_introText, style: theme.text.subhead),
+              new Row(
+                children: <Widget>[
+                  new Text('Long press the ', style: theme.text.subhead),
+                  new Tooltip(
+                    message: 'call icon',
+                    child: new Icon(
+                      size: IconSize.s18,
+                      icon: 'communication/call',
+                      color: theme.primaryColor
+                    )
+                  ),
+                  new Text(' icon', style: theme.text.subhead)
+                ]
+              ),
+              new Center(
+                child: new IconButton(
+                  size: IconSize.s48,
+                  icon: 'communication/call',
+                  color: theme.primaryColor,
+                  tooltip: 'place a phone call',
+                  onPressed: () {
+                    Scaffold.of(context).showSnackBar(new SnackBar(
+                       content: new Text('That was an ordinary tap')
+                    ));
+                  }
+                )
+              )
+            ]
+            .map((Widget widget) {
+              return new Padding(
+                padding: const EdgeDims.only(top: 16.0, left: 16.0, right: 16.0),
+                child: widget
+              );
+            })
+            .toList()
+          );
+        }
+      )
+    );
+  }
+}

examples/material_gallery/lib/gallery/home.dart

@@ -16,6 +16,7 @@ import '../demo/chip_demo.dart';
 import '../demo/date_picker_demo.dart';
 import '../demo/dialog_demo.dart';
 import '../demo/drop_down_demo.dart';
+import '../demo/fitness_demo.dart';
 import '../demo/grid_list_demo.dart';
 import '../demo/modal_bottom_sheet_demo.dart';
 import '../demo/page_selector_demo.dart';
@@ -28,10 +29,10 @@ import '../demo/snack_bar_demo.dart';
 import '../demo/tabs_demo.dart';
 import '../demo/tabs_fab_demo.dart';
 import '../demo/time_picker_demo.dart';
+import '../demo/tooltip_demo.dart';
 import '../demo/two_level_list_demo.dart';
 import '../demo/typography_demo.dart';
 import '../demo/weathers_demo.dart';
-import '../demo/fitness_demo.dart';
 
 class GalleryHome extends StatefulComponent {
   GalleryHome({ Key key }) : super(key: key);
@@ -111,7 +112,8 @@ class GalleryHomeState extends State<GalleryHome> {
                     new GalleryDemo(title: 'Sliders', builder: () => new SliderDemo()),
                     new GalleryDemo(title: 'SnackBar', builder: () => new SnackBarDemo()),
                     new GalleryDemo(title: 'Tabs', builder: () => new TabsDemo()),
-                    new GalleryDemo(title: 'Time Picker', builder: () => new TimePickerDemo())
+                    new GalleryDemo(title: 'Time Picker', builder: () => new TimePickerDemo()),
+                    new GalleryDemo(title: 'Tooltips', builder: () => new TooltipDemo())
                   ]
                 )
               ]
@@ -129,7 +131,10 @@ class GalleryHomeState extends State<GalleryHome> {
                 new GallerySection(
                   title: 'Usability',
                   image: 'assets/section_usability.png',
-                  colors: Colors.lightGreen
+                  colors: Colors.lightGreen,
+                  demos: <GalleryDemo>[
+                    new GalleryDemo(title: 'Tooltips', builder: () => new TooltipDemo())
+                  ]
                 )
               ]
             )

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

@@ -21,6 +21,7 @@ import 'tooltip.dart';
 class IconButton extends StatelessComponent {
   const IconButton({
     Key key,
+    this.size: IconSize.s24,
     this.icon,
     this.colorTheme,
     this.color,
@@ -28,6 +29,7 @@ class IconButton extends StatelessComponent {
     this.tooltip
   }) : super(key: key);
 
+  final IconSize size;
   final String icon;
   final IconThemeColor colorTheme;
   final Color color;
@@ -42,6 +44,7 @@ class IconButton extends StatelessComponent {
     Widget result = new Padding(
       padding: const EdgeDims.all(8.0),
       child: new Icon(
+        size: size,
         icon: icon,
         colorTheme: colorTheme,
         color: color