FlatButton highlights but doesn't tap around edge Now we trigger the highlight from the InkWell so that it matches the tap. Fixes #1525
diff --git a/packages/flutter/lib/src/widgets/drawer_item.dart b/packages/flutter/lib/src/widgets/drawer_item.dart index c41ac4a..3c5ca71 100644 --- a/packages/flutter/lib/src/widgets/drawer_item.dart +++ b/packages/flutter/lib/src/widgets/drawer_item.dart
@@ -26,7 +26,15 @@ _DrawerItemState createState() => new _DrawerItemState(); } -class _DrawerItemState extends ButtonState<DrawerItem> { +class _DrawerItemState extends State<DrawerItem> { + bool _highlight = false; + + void _handleHighlightChanged(bool value) { + setState(() { + _highlight = value; + }); + } + TextStyle _getTextStyle(ThemeData themeData) { TextStyle result = themeData.text.body2; if (config.selected) @@ -35,7 +43,7 @@ } Color _getBackgroundColor(ThemeData themeData) { - if (highlight) + if (_highlight) return themeData.highlightColor; if (config.selected) return themeData.selectedColor; @@ -48,7 +56,7 @@ return new sky.ColorFilter.mode(const Color(0x73000000), sky.TransferMode.dstIn); } - Widget buildContent(BuildContext context) { + Widget build(BuildContext context) { ThemeData themeData = Theme.of(context); List<Widget> flexChildren = new List<Widget>(); @@ -80,6 +88,7 @@ decoration: new BoxDecoration(backgroundColor: _getBackgroundColor(themeData)), child: new InkWell( onTap: config.onPressed, + onHighlightChanged: _handleHighlightChanged, child: new Row(flexChildren) ) );
diff --git a/packages/flutter/lib/src/widgets/floating_action_button.dart b/packages/flutter/lib/src/widgets/floating_action_button.dart index d2fb663..168b5d0 100644 --- a/packages/flutter/lib/src/widgets/floating_action_button.dart +++ b/packages/flutter/lib/src/widgets/floating_action_button.dart
@@ -30,8 +30,16 @@ _FloatingActionButtonState createState() => new _FloatingActionButtonState(); } -class _FloatingActionButtonState extends ButtonState<FloatingActionButton> { - Widget buildContent(BuildContext context) { +class _FloatingActionButtonState extends State<FloatingActionButton> { + bool _highlight = false; + + void _handleHighlightChanged(bool value) { + setState(() { + _highlight = value; + }); + } + + Widget build(BuildContext context) { IconThemeColor iconThemeColor = IconThemeColor.white; Color materialColor = config.backgroundColor; if (materialColor == null) { @@ -43,13 +51,14 @@ return new Material( color: materialColor, type: MaterialType.circle, - level: highlight ? 3 : 2, + level: _highlight ? 3 : 2, child: new ClipOval( child: new Container( width: _kSize, height: _kSize, child: new InkWell( onTap: config.onPressed, + onHighlightChanged: _handleHighlightChanged, child: new Center( child: new IconTheme( data: new IconThemeData(color: iconThemeColor),
diff --git a/packages/flutter/lib/src/widgets/ink_well.dart b/packages/flutter/lib/src/widgets/ink_well.dart index df49343..140e2c9 100644 --- a/packages/flutter/lib/src/widgets/ink_well.dart +++ b/packages/flutter/lib/src/widgets/ink_well.dart
@@ -98,13 +98,17 @@ } } +typedef _HighlightChangedCallback(bool value); + class _RenderInkWell extends RenderProxyBox { _RenderInkWell({ RenderBox child, GestureTapCallback onTap, - GestureLongPressCallback onLongPress + GestureLongPressCallback onLongPress, + _HighlightChangedCallback onHighlightChanged }) : super(child) { this.onTap = onTap; + this.onHighlightChanged = onHighlightChanged; this.onLongPress = onLongPress; } @@ -115,6 +119,13 @@ _syncTapRecognizer(); } + _HighlightChangedCallback get onHighlightChanged => _onHighlightChanged; + _HighlightChangedCallback _onHighlightChanged; + void set onHighlightChanged (_HighlightChangedCallback value) { + _onHighlightChanged = value; + _syncTapRecognizer(); + } + GestureTapCallback get onLongPress => _onLongPress; GestureTapCallback _onLongPress; void set onLongPress (GestureTapCallback value) { @@ -148,10 +159,11 @@ } void _syncTapRecognizer() { - if (onTap == null) { + if (onTap == null && onHighlightChanged == null) { _disposeTapRecognizer(); } else { _tap ??= new TapGestureRecognizer(router: FlutterBinding.instance.pointerRouter) + ..onTapDown = _handleTapDown ..onTap = _handleTap ..onTapCancel = _handleTapCancel; } @@ -176,13 +188,26 @@ _longPress = null; } + void _handleTapDown() { + if (onHighlightChanged != null) + onHighlightChanged(true); + } + void _handleTap() { - _splashes.last?.confirm(); - onTap(); + if (_splashes.isNotEmpty) + _splashes.last.confirm(); + + if (onHighlightChanged != null) + onHighlightChanged(false); + + if (onTap != null) + onTap(); } void _handleTapCancel() { _splashes.last?.cancel(); + if (onHighlightChanged != null) + onHighlightChanged(false); } void _handleLongPress() { @@ -209,16 +234,19 @@ Key key, Widget child, this.onTap, + this.onHighlightChanged, this.onLongPress }) : super(key: key, child: child); final GestureTapCallback onTap; + final _HighlightChangedCallback onHighlightChanged; final GestureLongPressCallback onLongPress; - _RenderInkWell createRenderObject() => new _RenderInkWell(onTap: onTap, onLongPress: onLongPress); + _RenderInkWell createRenderObject() => new _RenderInkWell(onTap: onTap, onHighlightChanged: onHighlightChanged, onLongPress: onLongPress); void updateRenderObject(_RenderInkWell renderObject, InkWell oldWidget) { renderObject.onTap = onTap; + renderObject.onHighlightChanged = onHighlightChanged; renderObject.onLongPress = onLongPress; } }
diff --git a/packages/flutter/lib/src/widgets/material_button.dart b/packages/flutter/lib/src/widgets/material_button.dart index 7016120..bbd127c 100644 --- a/packages/flutter/lib/src/widgets/material_button.dart +++ b/packages/flutter/lib/src/widgets/material_button.dart
@@ -25,11 +25,19 @@ final GestureTapCallback onPressed; } -abstract class MaterialButtonState<T extends MaterialButton> extends ButtonState<T> { +abstract class MaterialButtonState<T extends MaterialButton> extends State<T> { + bool highlight = false; + Color getColor(BuildContext context); int get level; - Widget buildContent(BuildContext context) { + void _handleHighlightChanged(bool value) { + setState(() { + highlight = value; + }); + } + + Widget build(BuildContext context) { Widget contents = new Container( padding: new EdgeDims.symmetric(horizontal: 8.0), child: new Center( @@ -47,6 +55,7 @@ color: getColor(context), child: new InkWell( onTap: config.enabled ? config.onPressed : null, + onHighlightChanged: config.enabled ? _handleHighlightChanged : null, child: contents ) )