Commit bfc39aa8 authored by Adam Barth's avatar Adam Barth

Remove IconThemeColor

This enum doesn't make sense anymore now that we can arbitrarily colorize
icons.  Instead, we just use a Color, which is both simpler and can be
interpolated during animations.

Fixes #1279
parent d6441b07
...@@ -120,7 +120,7 @@ class CardCollectionState extends State<CardCollection> { ...@@ -120,7 +120,7 @@ class CardCollectionState extends State<CardCollection> {
Widget _buildDrawer() { Widget _buildDrawer() {
return new Drawer( return new Drawer(
child: new IconTheme( child: new IconTheme(
data: const IconThemeData(color: IconThemeColor.black), data: const IconThemeData(color: Colors.black),
child: new Block(children: <Widget>[ child: new Block(children: <Widget>[
new DrawerHeader(child: new Text('Options')), new DrawerHeader(child: new Text('Options')),
buildDrawerCheckbox("Make card labels editable", _editable, _toggleEditable), buildDrawerCheckbox("Make card labels editable", _editable, _toggleEditable),
...@@ -385,7 +385,7 @@ class CardCollectionState extends State<CardCollection> { ...@@ -385,7 +385,7 @@ class CardCollectionState extends State<CardCollection> {
return new IconTheme( return new IconTheme(
key: cardModel.key, key: cardModel.key,
data: const IconThemeData(color: IconThemeColor.white), data: const IconThemeData(color: Colors.white),
child: new Stack(children: <Widget>[background, card]) child: new Stack(children: <Widget>[background, card])
); );
} }
......
...@@ -124,7 +124,7 @@ class PageableListAppState extends State<PageableListApp> { ...@@ -124,7 +124,7 @@ class PageableListAppState extends State<PageableListApp> {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return new IconTheme( return new IconTheme(
data: const IconThemeData(color: IconThemeColor.white), data: const IconThemeData(color: Colors.white),
child: new Scaffold( child: new Scaffold(
toolBar: _buildToolBar(), toolBar: _buildToolBar(),
drawer: _buildDrawer(), drawer: _buildDrawer(),
......
...@@ -4,8 +4,9 @@ ...@@ -4,8 +4,9 @@
import 'package:flutter/widgets.dart'; import 'package:flutter/widgets.dart';
import 'icon_theme.dart'; import 'colors.dart';
import 'icon_theme_data.dart'; import 'icon_theme_data.dart';
import 'icon_theme.dart';
import 'ink_well.dart'; import 'ink_well.dart';
import 'material.dart'; import 'material.dart';
import 'theme.dart'; import 'theme.dart';
...@@ -94,17 +95,17 @@ class _FloatingActionButtonState extends State<FloatingActionButton> { ...@@ -94,17 +95,17 @@ class _FloatingActionButtonState extends State<FloatingActionButton> {
} }
Widget build(BuildContext context) { Widget build(BuildContext context) {
IconThemeColor iconThemeColor = IconThemeColor.white; Color iconColor = Colors.white;
Color materialColor = config.backgroundColor; Color materialColor = config.backgroundColor;
if (materialColor == null) { if (materialColor == null) {
ThemeData themeData = Theme.of(context); ThemeData themeData = Theme.of(context);
materialColor = themeData.accentColor; materialColor = themeData.accentColor;
iconThemeColor = themeData.accentColorBrightness == ThemeBrightness.dark ? IconThemeColor.white : IconThemeColor.black; iconColor = themeData.accentColorBrightness == ThemeBrightness.dark ? Colors.white : Colors.black;
} }
Widget result = new Center( Widget result = new Center(
child: new IconTheme( child: new IconTheme(
data: new IconThemeData(color: iconThemeColor), data: new IconThemeData(color: iconColor),
child: new RotationTransition( child: new RotationTransition(
turns: _childSegue, turns: _childSegue,
child: config.child child: config.child
......
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
import 'package:flutter/widgets.dart'; import 'package:flutter/widgets.dart';
import 'colors.dart';
import 'icon_theme.dart'; import 'icon_theme.dart';
import 'icon_theme_data.dart'; import 'icon_theme_data.dart';
import 'typography.dart'; import 'typography.dart';
...@@ -77,7 +78,7 @@ class GridTileBar extends StatelessComponent { ...@@ -77,7 +78,7 @@ class GridTileBar extends StatelessComponent {
padding: padding, padding: padding,
decoration: decoration, decoration: decoration,
child: new IconTheme( child: new IconTheme(
data: new IconThemeData(color: IconThemeColor.white), data: new IconThemeData(color: Colors.white),
child: new Row( child: new Row(
alignItems: FlexAlignItems.center, alignItems: FlexAlignItems.center,
children: children children: children
......
...@@ -7,7 +7,6 @@ import 'package:flutter/widgets.dart'; ...@@ -7,7 +7,6 @@ import 'package:flutter/widgets.dart';
import 'colors.dart'; import 'colors.dart';
import 'icons.dart'; import 'icons.dart';
import 'icon_theme.dart'; import 'icon_theme.dart';
import 'icon_theme_data.dart';
import 'theme.dart'; import 'theme.dart';
class Icon extends StatelessComponent { class Icon extends StatelessComponent {
...@@ -15,53 +14,43 @@ class Icon extends StatelessComponent { ...@@ -15,53 +14,43 @@ class Icon extends StatelessComponent {
Key key, Key key,
this.size: 24.0, this.size: 24.0,
this.icon, this.icon,
this.colorTheme,
this.color this.color
}) : super(key: key) { }) : super(key: key) {
assert(size != null); assert(size != null);
} }
/// The size of the icon in logical pixels.
///
/// Icons occupy a square with width and height equal to size.
final double size; final double size;
/// The icon to display.
final IconData icon; final IconData icon;
final IconThemeColor colorTheme;
/// The color to use when drawing the icon.
final Color color; final Color color;
IconThemeColor _getIconThemeColor(BuildContext context) { Color _getDefaultColorForThemeBrightness(ThemeBrightness brightness) {
IconThemeColor iconThemeColor = colorTheme; switch (brightness) {
if (iconThemeColor == null) { case ThemeBrightness.dark:
IconThemeData iconThemeData = IconTheme.of(context); return Colors.white;
iconThemeColor = iconThemeData == null ? null : iconThemeData.color; case ThemeBrightness.light:
return Colors.black;
} }
if (iconThemeColor == null) {
ThemeBrightness themeBrightness = Theme.of(context).brightness;
iconThemeColor = themeBrightness == ThemeBrightness.dark ? IconThemeColor.white : IconThemeColor.black;
} }
return iconThemeColor;
Color _getDefaultColor(BuildContext context) {
return IconTheme.of(context)?.color ?? _getDefaultColorForThemeBrightness(Theme.of(context).brightness);
} }
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (icon == null) { if (icon == null)
return new SizedBox( return new SizedBox(width: size, height: size);
width: size,
height: size
);
}
Color iconColor = color; Color iconColor = color ?? _getDefaultColor(context);
final int iconAlpha = (255.0 * (IconTheme.of(context)?.clampedOpacity ?? 1.0)).round(); final int iconAlpha = (255.0 * (IconTheme.of(context)?.clampedOpacity ?? 1.0)).round();
if (color != null) {
if (iconAlpha != 255) if (iconAlpha != 255)
iconColor = color.withAlpha((iconAlpha * color.opacity).round()); iconColor = color.withAlpha((iconAlpha * color.opacity).round());
} else {
switch(_getIconThemeColor(context)) {
case IconThemeColor.black:
iconColor = Colors.black.withAlpha(iconAlpha);
break;
case IconThemeColor.white:
iconColor = Colors.white.withAlpha(iconAlpha);
break;
}
}
return new SizedBox( return new SizedBox(
width: size, width: size,
...@@ -83,8 +72,6 @@ class Icon extends StatelessComponent { ...@@ -83,8 +72,6 @@ class Icon extends StatelessComponent {
super.debugFillDescription(description); super.debugFillDescription(description);
description.add('$icon'); description.add('$icon');
description.add('size: $size'); description.add('size: $size');
if (this.colorTheme != null)
description.add('colorTheme: $colorTheme');
if (this.color != null) if (this.color != null)
description.add('color: $color'); description.add('color: $color');
} }
......
...@@ -6,7 +6,6 @@ import 'package:flutter/widgets.dart'; ...@@ -6,7 +6,6 @@ import 'package:flutter/widgets.dart';
import 'icon.dart'; import 'icon.dart';
import 'icons.dart'; import 'icons.dart';
import 'icon_theme_data.dart';
import 'ink_well.dart'; import 'ink_well.dart';
import 'theme.dart'; import 'theme.dart';
import 'tooltip.dart'; import 'tooltip.dart';
...@@ -25,21 +24,32 @@ class IconButton extends StatelessComponent { ...@@ -25,21 +24,32 @@ class IconButton extends StatelessComponent {
Key key, Key key,
this.size: 24.0, this.size: 24.0,
this.icon, this.icon,
this.colorTheme,
this.color, this.color,
this.onPressed, this.onPressed,
this.tooltip this.tooltip
}) : super(key: key); }) : super(key: key);
/// The size of the icon inside the button.
///
/// The button itself will be larger than the icon by 8.0 logical pixels in
/// each direction.
final double size; final double size;
/// The icon to display inside the button.
final IconData icon; final IconData icon;
final IconThemeColor colorTheme;
/// The color to use for the icon inside the button.
final Color color; final Color color;
/// The callback that is invoked when the button is tapped or otherwise activated. /// The callback that is invoked when the button is tapped or otherwise activated.
/// ///
/// If this is set to null, the button will be disabled. /// If this is set to null, the button will be disabled.
final VoidCallback onPressed; final VoidCallback onPressed;
/// Text that describes the action that will occur when the button is pressed.
///
/// This text is displayed when the user long-presses on the button and is
/// used for accessibility.
final String tooltip; final String tooltip;
Widget build(BuildContext context) { Widget build(BuildContext context) {
...@@ -48,7 +58,6 @@ class IconButton extends StatelessComponent { ...@@ -48,7 +58,6 @@ class IconButton extends StatelessComponent {
child: new Icon( child: new Icon(
size: size, size: size,
icon: icon, icon: icon,
colorTheme: colorTheme,
color: onPressed != null ? color : Theme.of(context).disabledColor color: onPressed != null ? color : Theme.of(context).disabledColor
) )
); );
...@@ -69,8 +78,6 @@ class IconButton extends StatelessComponent { ...@@ -69,8 +78,6 @@ class IconButton extends StatelessComponent {
description.add('$icon'); description.add('$icon');
if (onPressed == null) if (onPressed == null)
description.add('disabled'); description.add('disabled');
if (colorTheme != null)
description.add('$colorTheme');
if (tooltip != null) if (tooltip != null)
description.add('tooltip: "$tooltip"'); description.add('tooltip: "$tooltip"');
} }
......
...@@ -3,21 +3,22 @@ ...@@ -3,21 +3,22 @@
// found in the LICENSE file. // found in the LICENSE file.
import 'dart:ui' as ui show lerpDouble; import 'dart:ui' as ui show lerpDouble;
import 'dart:ui' show hashValues; import 'dart:ui' show Color, hashValues;
enum IconThemeColor { white, black }
class IconThemeData { class IconThemeData {
const IconThemeData({ this.color, this.opacity }); const IconThemeData({ this.color, this.opacity });
final IconThemeColor color; /// The default color for icons.
final Color color;
/// An opacity to apply to both explicit and default icon colors.
final double opacity; final double opacity;
double get clampedOpacity => (opacity ?? 1.0).clamp(0.0, 1.0); double get clampedOpacity => (opacity ?? 1.0).clamp(0.0, 1.0);
static IconThemeData lerp(IconThemeData begin, IconThemeData end, double t) { static IconThemeData lerp(IconThemeData begin, IconThemeData end, double t) {
return new IconThemeData( return new IconThemeData(
color: t < 0.5 ? begin.color : end.color, color: Color.lerp(begin.color, end.color, t),
opacity: ui.lerpDouble(begin.clampedOpacity, end.clampedOpacity, t) opacity: ui.lerpDouble(begin.clampedOpacity, end.clampedOpacity, t)
); );
} }
......
...@@ -125,7 +125,7 @@ class ThemeData { ...@@ -125,7 +125,7 @@ class ThemeData {
errorColor ??= Colors.red[700]; errorColor ??= Colors.red[700];
text ??= isDark ? Typography.white : Typography.black; text ??= isDark ? Typography.white : Typography.black;
primaryTextTheme ??= primaryColorBrightness == ThemeBrightness.dark ? Typography.white : Typography.black; primaryTextTheme ??= primaryColorBrightness == ThemeBrightness.dark ? Typography.white : Typography.black;
primaryIconTheme ??= primaryColorBrightness == ThemeBrightness.dark ? const IconThemeData(color: IconThemeColor.white) : const IconThemeData(color: IconThemeColor.black); primaryIconTheme ??= primaryColorBrightness == ThemeBrightness.dark ? const IconThemeData(color: Colors.white) : const IconThemeData(color: Colors.black);
return new ThemeData.raw( return new ThemeData.raw(
brightness: brightness, brightness: brightness,
primaryColor: primaryColor, primaryColor: primaryColor,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment