diff --git a/examples/material_gallery/lib/demo/tooltip_demo.dart b/examples/material_gallery/lib/demo/tooltip_demo.dart new file mode 100644 index 0000000000..2f979942bc --- /dev/null +++ b/examples/material_gallery/lib/demo/tooltip_demo.dart @@ -0,0 +1,65 @@ +// 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: [ + new Text(_introText, style: theme.text.subhead), + new Row( + children: [ + 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() + ); + } + ) + ); + } +} diff --git a/examples/material_gallery/lib/gallery/home.dart b/examples/material_gallery/lib/gallery/home.dart index af2b8a4bdc..11c8ab9862 100644 --- a/examples/material_gallery/lib/gallery/home.dart +++ b/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 { 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 { new GallerySection( title: 'Usability', image: 'assets/section_usability.png', - colors: Colors.lightGreen + colors: Colors.lightGreen, + demos: [ + new GalleryDemo(title: 'Tooltips', builder: () => new TooltipDemo()) + ] ) ] ) diff --git a/packages/flutter/lib/src/material/icon_button.dart b/packages/flutter/lib/src/material/icon_button.dart index 4d05f7a24f..85adc34b6a 100644 --- a/packages/flutter/lib/src/material/icon_button.dart +++ b/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