/// For a variant of this widget that is specialized for rectangular areas that
/// For a variant of this widget that is specialized for rectangular areas that
/// always clip splashes, see [InkWell].
/// always clip splashes, see [InkWell].
///
///
/// An [InkResponse] widget does two things when responding to a tap:
///
/// * It starts to animate a _highlight_. The shape of the highlight is
/// determined by [highlightShape]. If it is a [BoxShape.circle], the
/// default, then the highlight is a circle of fixed size centered in the
/// [InkResponse]. If it is [BoxShape.rectangle], then the highlight is a box
/// the size of the [InkResponse] itself, unless [getRectCallback] is
/// provided, in which case that callback defines the rectangle. The color of
/// the highlight is set by [highlightColor].
///
/// * Simultaneously, it starts to animate a _splash_. This is a growing circle
/// initially centered on the tap location. If this is a [containedInkWell],
/// the splash grows to the [radius] while remaining centered at the tap
/// location. Otherwise, the splash migrates to the center of the box as it
/// grows.
///
/// The following two diagrams show how [InkResponse] looks when tapped if the
/// The following two diagrams show how [InkResponse] looks when tapped if the
/// [highlightShape] is [BoxShape.circle] (the default) and [containedInkWell]
/// [highlightShape] is [BoxShape.circle] (the default) and [containedInkWell]
/// is false (also the default). The first diagram shows how it looks if the
/// is false (also the default).
/// [InkResponse] is relatively large, the second shows how it looks if it is
///
/// small. The main thing to notice is that the splashes happily exceed the
/// The first diagram shows how it looks if the [InkResponse] is relatively
/// bounds of the widget (because [containedInkWell] is false).
/// large:
///
///
/// ![The highlight is a disc centered in the box, smaller than the child widget.](https://flutter.github.io/assets-for-api-docs/material/ink_response_large.png)
/// ![The highlight is a disc centered in the box, smaller than the child widget.](https://flutter.github.io/assets-for-api-docs/material/ink_response_large.png)
///
/// The second diagram shows how it looks if the [InkResponse] is small:
///
/// ![The highlight is a disc overflowing the box, centered on the child.](https://flutter.github.io/assets-for-api-docs/material/ink_response_small.png)
/// ![The highlight is a disc overflowing the box, centered on the child.](https://flutter.github.io/assets-for-api-docs/material/ink_response_small.png)
///
///
/// The main thing to notice from these diagrams is that the splashes happily
/// exceed the bounds of the widget (because [containedInkWell] is false).
///
/// The following diagram shows the effect when the [InkResponse] has a
/// The following diagram shows the effect when the [InkResponse] has a
/// [highlightShape] of [BoxShape.rectangle] with [containedInkWell] set to
/// [highlightShape] of [BoxShape.rectangle] with [containedInkWell] set to
/// true. These are the values used by [InkWell].
/// true. These are the values used by [InkWell].
///
///
/// ![The highlight is a rectangle the size of the box.](https://flutter.github.io/assets-for-api-docs/material/ink_well.png)
/// ![The highlight is a rectangle the size of the box.](https://flutter.github.io/assets-for-api-docs/material/ink_well.png)
///
///
/// The [InkResponse] widbget must have a [Material] widget as an ancestor. The
/// The [InkResponse] widget must have a [Material] widget as an ancestor. The
/// [Material] widget is where the ink reactions are actually painted. This
/// [Material] widget is where the ink reactions are actually painted. This
/// matches the material design premise wherein the [Material] is what is
/// matches the material design premise wherein the [Material] is what is
/// actually reacting to touches by spreading ink.
/// actually reacting to touches by spreading ink.
...
@@ -76,7 +98,7 @@ class InkResponse extends StatefulWidget {
...
@@ -76,7 +98,7 @@ class InkResponse extends StatefulWidget {
/// The widget below this widget in the tree.
/// The widget below this widget in the tree.
finalWidgetchild;
finalWidgetchild;
/// Called when the user taps this part of the material
/// Called when the user taps this part of the material.
finalGestureTapCallbackonTap;
finalGestureTapCallbackonTap;
/// Called when the user double taps this part of the material.
/// Called when the user double taps this part of the material.
...
@@ -85,7 +107,8 @@ class InkResponse extends StatefulWidget {
...
@@ -85,7 +107,8 @@ class InkResponse extends StatefulWidget {
/// Called when the user long-presses on this part of the material.
/// Called when the user long-presses on this part of the material.
finalGestureLongPressCallbackonLongPress;
finalGestureLongPressCallbackonLongPress;
/// Called when this part of the material either becomes highlighted or stops behing highlighted.
/// Called when this part of the material either becomes highlighted or stops
/// being highlighted.
///
///
/// The value passed to the callback is true if this part of the material has
/// The value passed to the callback is true if this part of the material has
/// become highlighted and false if this part of the material has stopped
/// become highlighted and false if this part of the material has stopped
...
@@ -93,12 +116,46 @@ class InkResponse extends StatefulWidget {
...
@@ -93,12 +116,46 @@ class InkResponse extends StatefulWidget {
finalValueChanged<bool>onHighlightChanged;
finalValueChanged<bool>onHighlightChanged;
/// Whether this ink response should be clipped its bounds.
/// Whether this ink response should be clipped its bounds.
///
/// This flag also controls whether the splash migrates to the center of the
/// [InkResponse] or not. If [containedInkWell] is true, the splash remains
/// centered around the tap location. If it is false, the splash migrates to
/// the center of the [InkResponse] as it grows.
///
/// See also:
///
/// * [highlightShape], which determines the shape of the highlight.
/// * [borderRadius], which controls the corners when the box is a rectangle.
/// * [getRectCallback], which controls the size and position of the box when
/// it is a rectangle.
finalboolcontainedInkWell;
finalboolcontainedInkWell;
/// The shape (e.g., circle, rectangle) to use for the highlight drawn around this part of the material.
/// The shape (e.g., circle, rectangle) to use for the highlight drawn around
/// this part of the material.
///
/// If the shape is [BoxShape.circle], then the highlight is centered on the
/// [InkResponse]. If the shape is [BoxShape.rectangle], then the highlight
/// fills the [InkResponse], or the rectangle provided by [getRectCallback] if
/// the callback is specified.
///
/// See also:
///
/// * [containedInkWell], which controls clipping behavior.
/// * [borderRadius], which controls the corners when the box is a rectangle.
/// * [highlightColor], the color of the highlight.
/// * [getRectCallback], which controls the size and position of the box when
/// it is a rectangle.
finalBoxShapehighlightShape;
finalBoxShapehighlightShape;
/// The radius of the ink splash.
/// The radius of the ink splash.
///
/// Splashes grow up to this size. By default, this size is determined from
/// the size of the rectangle provided by [getRectCallback], or the size of
/// the [InkResponse] itself.
///
/// See also:
///
/// * [splashColor], the color of the splash.
finaldoubleradius;
finaldoubleradius;
/// The clipping radius of the containing rect.
/// The clipping radius of the containing rect.
...
@@ -106,10 +163,20 @@ class InkResponse extends StatefulWidget {
...
@@ -106,10 +163,20 @@ class InkResponse extends StatefulWidget {
/// The highlight color of the ink response. If this property is null then the
/// The highlight color of the ink response. If this property is null then the
/// highlight color of the theme will be used.
/// highlight color of the theme will be used.
///
/// See also:
///
/// * [highlightShape], the shape of the highlight.
/// * [splashColor], the color of the splash.
finalColorhighlightColor;
finalColorhighlightColor;
/// The splash color of the ink response. If this property is null then the
/// The splash color of the ink response. If this property is null then the
/// splash color of the theme will be used.
/// splash color of the theme will be used.
///
/// See also:
///
/// * [radius], the (maximum) size of the ink splash.
/// * [highlightColor], the color of the highlight.
finalColorsplashColor;
finalColorsplashColor;
/// The rectangle to use for the highlight effect and for clipping
/// The rectangle to use for the highlight effect and for clipping