icon_button.dart 4.58 KB
Newer Older
1 2 3 4
// Copyright 2015 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.

5
import 'package:flutter/widgets.dart';
6
import 'package:meta/meta.dart';
7

8
import 'debug.dart';
9
import 'icon.dart';
Ian Hickson's avatar
Ian Hickson committed
10 11
import 'icon_theme.dart';
import 'icon_theme_data.dart';
12
import 'icons.dart';
13
import 'ink_well.dart';
14
import 'theme.dart';
Hixie's avatar
Hixie committed
15
import 'tooltip.dart';
16

17
/// A material design icon button.
18 19 20 21
///
/// An icon button is a picture printed on a [Material] widget that reacts to
/// touches by filling with color.
///
22 23
/// Icon buttons are commonly used in the [AppBar.actions] field, but they can
/// be used in many other places as well.
24 25 26
///
/// If the [onPressed] callback is not specified or null, then the button will
/// be disabled, will not react to touch.
27
///
28 29
/// Requires one of its ancestors to be a [Material] widget.
///
30 31 32 33
/// See also:
///
///  * [Icons]
///  * [AppBar]
34
class IconButton extends StatelessWidget {
35 36 37 38 39 40
  /// Creates an icon button.
  ///
  /// Icon buttons are commonly used in the [AppBar.actions] field, but they can
  /// be used in many other places as well.
  ///
  /// Requires one of its ancestors to be a [Material] widget.
41 42 43 44
  ///
  /// The [size], [padding], and [alignment] arguments must not be null (though
  /// they each have default values).
  ///
Ian Hickson's avatar
Ian Hickson committed
45 46
  /// The [icon] argument must be specified, and is typically either an [Icon]
  /// or an [ImageIcon].
47 48
  const IconButton({
    Key key,
49
    this.size: 24.0,
50 51
    this.padding: const EdgeInsets.all(8.0),
    this.alignment: FractionalOffset.center,
52
    @required this.icon,
53
    this.color,
54
    this.disabledColor,
55
    @required this.onPressed,
Hixie's avatar
Hixie committed
56
    this.tooltip
57
  }) : super(key: key);
58

Adam Barth's avatar
Adam Barth committed
59
  /// The size of the icon inside the button.
60 61
  ///
  /// This property must not be null. It defaults to 24.0.
62
  final double size;
Adam Barth's avatar
Adam Barth committed
63

64 65
  /// The padding around the button's icon. The entire padded icon will react
  /// to input gestures.
66 67
  ///
  /// This property must not be null. It defaults to 8.0 padding on all sides.
68 69 70
  final EdgeInsets padding;

  /// Defines how the icon is positioned within the IconButton.
71 72
  ///
  /// This property must not be null. It defaults to [FractionalOffset.center].
73 74
  final FractionalOffset alignment;

Ian Hickson's avatar
Ian Hickson committed
75 76 77 78 79
  /// The icon to display inside the button.
  ///
  /// The size and color of the icon is configured automatically using an
  /// [IconTheme] and therefore does not need to be explicitly given in the
  /// icon widget.
80 81
  ///
  /// This property must not be null.
Ian Hickson's avatar
Ian Hickson committed
82 83 84
  ///
  /// See [Icon], [ImageIcon].
  final Widget icon;
Adam Barth's avatar
Adam Barth committed
85

86
  /// The color to use for the icon inside the button, if the icon is enabled.
Ian Hickson's avatar
Ian Hickson committed
87
  /// Defaults to leaving this up to the [icon] widget.
88 89 90 91
  ///
  /// The icon is enabled if [onPressed] is not null.
  ///
  /// See also [disabledColor].
Adam Barth's avatar
Adam Barth committed
92
  final Color color;
93

94 95 96 97 98 99 100 101
  /// The color to use for the icon inside the button, if the icon is disabled.
  /// Defaults to the [ThemeData.disabledColor] of the current [Theme].
  ///
  /// The icon is disabled if [onPressed] is null.
  ///
  /// See also [color].
  final Color disabledColor;

102
  /// The callback that is called when the button is tapped or otherwise activated.
103 104
  ///
  /// If this is set to null, the button will be disabled.
105
  final VoidCallback onPressed;
Adam Barth's avatar
Adam Barth committed
106 107 108 109 110

  /// 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.
Hixie's avatar
Hixie committed
111
  final String tooltip;
112

113
  @override
114
  Widget build(BuildContext context) {
115
    assert(debugCheckHasMaterial(context));
116 117 118 119 120
    Color currentColor;
    if (onPressed != null)
      currentColor = color;
    else
      currentColor = disabledColor ?? Theme.of(context).disabledColor;
Hixie's avatar
Hixie committed
121
    Widget result = new Padding(
122 123 124 125 126 127
      padding: padding,
      child: new LimitedBox(
        maxWidth: size,
        maxHeight: size,
        child: new Align(
          alignment: alignment,
Ian Hickson's avatar
Ian Hickson committed
128 129 130 131 132 133 134
          child: new IconTheme.merge(
            context: context,
            data: new IconThemeData(
              size: size,
              color: currentColor
            ),
            child: icon
135 136
          )
        )
137
      )
138
    );
Hixie's avatar
Hixie committed
139 140 141 142 143 144
    if (tooltip != null) {
      result = new Tooltip(
        message: tooltip,
        child: result
      );
    }
Hixie's avatar
Hixie committed
145 146 147 148
    return new InkResponse(
      onTap: onPressed,
      child: result
    );
149
  }
Hixie's avatar
Hixie committed
150

151
  @override
Hixie's avatar
Hixie committed
152 153 154
  void debugFillDescription(List<String> description) {
    super.debugFillDescription(description);
    description.add('$icon');
Hixie's avatar
Hixie committed
155 156 157 158
    if (onPressed == null)
      description.add('disabled');
    if (tooltip != null)
      description.add('tooltip: "$tooltip"');
Hixie's avatar
Hixie committed
159
  }
160
}