From eeea4ab7c79afb1ee89d7152ba13c78f27bebbb0 Mon Sep 17 00:00:00 2001 From: Adam Barth Date: Wed, 28 Oct 2015 07:26:09 -0700 Subject: [PATCH] Icon should use an enum rather than an int for size Material design icons are defined to work at specific sizes: 18, 24, 36, 48. The current API doesn't reflect that and just takes a size int. If an invalid size is chosen an error is printed to the console and no icon shows up. Fixes #1816 --- examples/address_book/lib/main.dart | 4 +-- examples/fitness/lib/feed.dart | 2 +- examples/stocks/lib/stock_home.dart | 2 +- examples/stocks/lib/stock_menu.dart | 2 +- examples/widgets/card_collection.dart | 6 ++--- .../flutter/lib/src/material/drawer_item.dart | 1 - .../flutter/lib/src/material/dropdown.dart | 2 +- packages/flutter/lib/src/material/icon.dart | 25 +++++++++++++++---- .../flutter/lib/src/material/icon_button.dart | 1 - packages/flutter/lib/src/material/tabs.dart | 3 +-- 10 files changed, 30 insertions(+), 18 deletions(-) diff --git a/examples/address_book/lib/main.dart b/examples/address_book/lib/main.dart index ab9372c1d73..4394946d930 100644 --- a/examples/address_book/lib/main.dart +++ b/examples/address_book/lib/main.dart @@ -20,7 +20,7 @@ class Field extends StatelessComponent { return new Row([ new Padding( padding: const EdgeDims.symmetric(horizontal: 16.0), - child: new Icon(type: icon, size: 24) + child: new Icon(type: icon) ), new Flexible( child: new Input( @@ -43,7 +43,7 @@ class AddressBookHome extends StatelessComponent { Widget buildFloatingActionButton(BuildContext context) { return new FloatingActionButton( - child: new Icon(type: 'image/photo_camera', size: 24), + child: new Icon(type: 'image/photo_camera'), backgroundColor: Theme.of(context).accentColor ); } diff --git a/examples/fitness/lib/feed.dart b/examples/fitness/lib/feed.dart index 5adc86a87a9..fa15bf5c4b8 100644 --- a/examples/fitness/lib/feed.dart +++ b/examples/fitness/lib/feed.dart @@ -200,7 +200,7 @@ class FeedFragmentState extends State { switch (_fitnessMode) { case FitnessMode.feed: return new FloatingActionButton( - child: new Icon(type: 'content/add', size: 24), + child: new Icon(type: 'content/add'), onPressed: _handleActionButtonPressed ); case FitnessMode.chart: diff --git a/examples/stocks/lib/stock_home.dart b/examples/stocks/lib/stock_home.dart index 0085a93314e..9e1fa4a009d 100644 --- a/examples/stocks/lib/stock_home.dart +++ b/examples/stocks/lib/stock_home.dart @@ -254,7 +254,7 @@ class StockHomeState extends State { Widget buildFloatingActionButton() { return new FloatingActionButton( - child: new Icon(type: 'content/add', size: 24), + child: new Icon(type: 'content/add'), backgroundColor: Colors.redAccent[200], onPressed: _handleStockPurchased ); diff --git a/examples/stocks/lib/stock_menu.dart b/examples/stocks/lib/stock_menu.dart index 68c9f4d7aa6..f58ab32501c 100644 --- a/examples/stocks/lib/stock_menu.dart +++ b/examples/stocks/lib/stock_menu.dart @@ -63,7 +63,7 @@ Future showStockMenu({BuildContext context, bool autorefresh, ValueChanged child: new Row([ new Icon( type: 'device/dvr', - size: 18 + size: IconSize.s18 ), new Container( width: 8.0 diff --git a/examples/widgets/card_collection.dart b/examples/widgets/card_collection.dart index 32af1b1aa02..beda83703c1 100644 --- a/examples/widgets/card_collection.dart +++ b/examples/widgets/card_collection.dart @@ -289,7 +289,7 @@ class CardCollectionState extends State { child: new Container( height: cardModel.height, padding: const EdgeDims.all(8.0), - child: _editable ? + child: _editable ? new Center( child: new Input( key: new GlobalObjectKey(cardModel), @@ -329,11 +329,11 @@ class CardCollectionState extends State { backgroundMessage = "Unsupported dismissDirection"; } - Widget leftArrowIcon = new Icon(type: 'navigation/arrow_back', size: 36); + Widget leftArrowIcon = new Icon(type: 'navigation/arrow_back', size: IconSize.s36); if (_dismissDirection == DismissDirection.right) leftArrowIcon = new Opacity(opacity: 0.1, child: leftArrowIcon); - Widget rightArrowIcon = new Icon(type: 'navigation/arrow_forward', size: 36); + Widget rightArrowIcon = new Icon(type: 'navigation/arrow_forward', size: IconSize.s36); if (_dismissDirection == DismissDirection.left) rightArrowIcon = new Opacity(opacity: 0.1, child: rightArrowIcon); diff --git a/packages/flutter/lib/src/material/drawer_item.dart b/packages/flutter/lib/src/material/drawer_item.dart index 5c6614bf399..bc4d431637a 100644 --- a/packages/flutter/lib/src/material/drawer_item.dart +++ b/packages/flutter/lib/src/material/drawer_item.dart @@ -49,7 +49,6 @@ class DrawerItem extends StatelessComponent { padding: const EdgeDims.symmetric(horizontal: 16.0), child: new Icon( type: icon, - size: 24, colorFilter: _getColorFilter(themeData) ) ) diff --git a/packages/flutter/lib/src/material/dropdown.dart b/packages/flutter/lib/src/material/dropdown.dart index b8b89f3083e..b70511090a9 100644 --- a/packages/flutter/lib/src/material/dropdown.dart +++ b/packages/flutter/lib/src/material/dropdown.dart @@ -244,7 +244,7 @@ class DropdownButton extends StatelessComponent { alignment: const FractionalOffset(0.5, 0.0) ), new Container( - child: new Icon(type: 'navigation/arrow_drop_down', size: 36), + child: new Icon(type: 'navigation/arrow_drop_down', size: IconSize.s36), padding: const EdgeDims.only(top: 6.0) ) ]) diff --git a/packages/flutter/lib/src/material/icon.dart b/packages/flutter/lib/src/material/icon.dart index e5e47b45b48..11881458a20 100644 --- a/packages/flutter/lib/src/material/icon.dart +++ b/packages/flutter/lib/src/material/icon.dart @@ -8,10 +8,24 @@ import 'theme.dart'; import 'icon_theme.dart'; import 'icon_theme_data.dart'; +enum IconSize { + s18, + s24, + s36, + s48, +} + +const Map _kIconSize = const { + IconSize.s18: 18, + IconSize.s24: 24, + IconSize.s36: 36, + IconSize.s48: 48, +}; + class Icon extends StatelessComponent { Icon({ Key key, - this.size, + this.size: IconSize.s24, this.type: '', this.color, this.colorFilter @@ -20,7 +34,7 @@ class Icon extends StatelessComponent { assert(type != null); } - final int size; + final IconSize size; final String type; final IconThemeColor color; final ColorFilter colorFilter; @@ -55,10 +69,11 @@ class Icon extends StatelessComponent { // Should we use the ios images on ios? String density = 'drawable-xxhdpi'; String colorSuffix = _getColorSuffix(context); + int iconSize = _kIconSize[size]; return new AssetImage( - name: '$category/$density/ic_${subtype}_${colorSuffix}_${size}dp.png', - width: size.toDouble(), - height: size.toDouble(), + name: '$category/$density/ic_${subtype}_${colorSuffix}_${iconSize}dp.png', + width: iconSize.toDouble(), + height: iconSize.toDouble(), colorFilter: colorFilter ); } diff --git a/packages/flutter/lib/src/material/icon_button.dart b/packages/flutter/lib/src/material/icon_button.dart index 0370a597f98..eb78d316f46 100644 --- a/packages/flutter/lib/src/material/icon_button.dart +++ b/packages/flutter/lib/src/material/icon_button.dart @@ -28,7 +28,6 @@ class IconButton extends StatelessComponent { padding: const EdgeDims.all(8.0), child: new Icon( type: icon, - size: 24, color: color, colorFilter: colorFilter ) diff --git a/packages/flutter/lib/src/material/tabs.dart b/packages/flutter/lib/src/material/tabs.dart index 0134165a54b..01c6499af00 100644 --- a/packages/flutter/lib/src/material/tabs.dart +++ b/packages/flutter/lib/src/material/tabs.dart @@ -27,7 +27,6 @@ const double _kTabIndicatorHeight = 2.0; const double _kMinTabWidth = 72.0; const double _kMaxTabWidth = 264.0; const EdgeDims _kTabLabelPadding = const EdgeDims.symmetric(horizontal: 12.0); -const int _kTabIconSize = 24; const double _kTabBarScrollDrag = 0.025; const Duration _kTabBarScroll = const Duration(milliseconds: 200); @@ -321,7 +320,7 @@ class Tab extends StatelessComponent { assert(label.icon != null); Color iconColor = selected ? selectedColor : color; ColorFilter filter = new ColorFilter.mode(iconColor, TransferMode.srcATop); - return new Icon(type: label.icon, size: _kTabIconSize, colorFilter: filter); + return new Icon(type: label.icon, colorFilter: filter); } Widget build(BuildContext context) {