Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Sign in
Toggle navigation
F
Front-End
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
abdullh.alsoleman
Front-End
Commits
9b3307a4
Commit
9b3307a4
authored
Aug 08, 2017
by
Hans Muller
Committed by
GitHub
Aug 08, 2017
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Add splashColor and highlightColor to IconButton (#11524)
parent
02c21447
Changes
6
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
121 additions
and
7 deletions
+121
-7
button.dart
packages/flutter/lib/src/material/button.dart
+2
-2
flat_button.dart
packages/flutter/lib/src/material/flat_button.dart
+2
-2
icon_button.dart
packages/flutter/lib/src/material/icon_button.dart
+22
-0
ink_well.dart
packages/flutter/lib/src/material/ink_well.dart
+2
-2
buttons_test.dart
packages/flutter/test/material/buttons_test.dart
+3
-1
icon_button_test.dart
packages/flutter/test/material/icon_button_test.dart
+90
-0
No files found.
packages/flutter/lib/src/material/button.dart
View file @
9b3307a4
...
...
@@ -184,7 +184,7 @@ class MaterialButton extends StatefulWidget {
/// fill the button area if the touch is held for long enough time. If the splash
/// color has transparency then the highlight and button color will show through.
///
/// Defaults to the
splash color from the [Theme
].
/// Defaults to the
Theme's splash color, [ThemeData.splashColor
].
final
Color
splashColor
;
/// The secondary color of the button when the button is in the down (pressed)
...
...
@@ -192,7 +192,7 @@ class MaterialButton extends StatefulWidget {
/// button color (if any). If the highlight color has transparency, the button color
/// will show through. The highlight fades in quickly as the button is held down.
///
/// Defaults to the
highlight color from the [Theme
].
/// Defaults to the
Theme's highlight color, [ThemeData.highlightColor
].
final
Color
highlightColor
;
/// The z-coordinate at which to place this button. This controls the size of
...
...
packages/flutter/lib/src/material/flat_button.dart
View file @
9b3307a4
...
...
@@ -101,7 +101,7 @@ class FlatButton extends StatelessWidget {
/// fill the button area if the touch is held for long enough time. If the splash
/// color has transparency then the highlight and button color will show through.
///
/// Defaults to the
splash color from the [Theme
].
/// Defaults to the
Theme's splash color, [ThemeData.splashColor
].
final
Color
splashColor
;
/// The secondary color of the button when the button is in the down (pressed)
...
...
@@ -109,7 +109,7 @@ class FlatButton extends StatelessWidget {
/// button color (if any). If the highlight color has transparency, the button color
/// will show through. The highlight fades in quickly as the button is held down.
///
/// Defaults to the
highlight color from the [Theme
].
/// Defaults to the
Theme's highlight color, [ThemeData.highlightColor
].
final
Color
highlightColor
;
/// The color of the button when the button is disabled. Buttons are disabled
...
...
packages/flutter/lib/src/material/icon_button.dart
View file @
9b3307a4
...
...
@@ -76,6 +76,8 @@ class IconButton extends StatelessWidget {
this
.
alignment
:
FractionalOffset
.
center
,
@required
this
.
icon
,
this
.
color
,
this
.
highlightColor
,
this
.
splashColor
,
this
.
disabledColor
,
@required
this
.
onPressed
,
this
.
tooltip
...
...
@@ -136,6 +138,24 @@ class IconButton extends StatelessWidget {
/// ```
final
Color
color
;
/// The primary color of the button when the button is in the down (pressed) state.
/// The splash is represented as a circular overlay that appears above the
/// [highlightColor] overlay. The splash overlay has a center point that matches
/// the hit point of the user touch event. The splash overlay will expand to
/// fill the button area if the touch is held for long enough time. If the splash
/// color has transparency then the highlight and button color will show through.
///
/// Defaults to the Theme's splash color, [ThemeData.splashColor].
final
Color
splashColor
;
/// The secondary color of the button when the button is in the down (pressed)
/// state. The higlight color is represented as a solid color that is overlaid over the
/// button color (if any). If the highlight color has transparency, the button color
/// will show through. The highlight fades in quickly as the button is held down.
///
/// Defaults to the Theme's highlight color, [ThemeData.highlightColor].
final
Color
highlightColor
;
/// The color to use for the icon inside the button, if the icon is disabled.
/// Defaults to the [ThemeData.disabledColor] of the current [Theme].
///
...
...
@@ -194,6 +214,8 @@ class IconButton extends StatelessWidget {
return
new
InkResponse
(
onTap:
onPressed
,
child:
result
,
highlightColor:
highlightColor
??
Theme
.
of
(
context
).
highlightColor
,
splashColor:
splashColor
??
Theme
.
of
(
context
).
splashColor
,
radius:
math
.
max
(
Material
.
defaultSplashRadius
,
(
iconSize
+
math
.
min
(
padding
.
horizontal
,
padding
.
vertical
))
*
0.7
,
...
...
packages/flutter/lib/src/material/ink_well.dart
View file @
9b3307a4
...
...
@@ -165,7 +165,7 @@ class InkResponse extends StatefulWidget {
final
BorderRadius
borderRadius
;
/// 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
, [ThemeData.highlightColor],
will be used.
///
/// See also:
///
...
...
@@ -174,7 +174,7 @@ class InkResponse extends StatefulWidget {
final
Color
highlightColor
;
/// 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
, [ThemeData.splashColor],
will be used.
///
/// See also:
///
...
...
packages/flutter/test/material/buttons_test.dart
View file @
9b3307a4
...
...
@@ -41,7 +41,9 @@ void main() {
semantics
.
dispose
();
});
testWidgets
(
'Does button highlight + splash colors work if set directly'
,
(
WidgetTester
tester
)
async
{
// This test is very similar to the '...explicit splashColor and highlightColor' test
// in icon_button_test.dart. If you change this one, you may want to also change that one.
testWidgets
(
'MaterialButton with explicit splashColor and highlightColor'
,
(
WidgetTester
tester
)
async
{
final
Color
directSplashColor
=
const
Color
(
0xFF000011
);
final
Color
directHighlightColor
=
const
Color
(
0xFF000011
);
...
...
packages/flutter/test/material/icon_button_test.dart
View file @
9b3307a4
...
...
@@ -5,6 +5,8 @@
import
'package:flutter/material.dart'
;
import
'package:flutter_test/flutter_test.dart'
;
import
'../rendering/mock_canvas.dart'
;
class
MockOnPressedFunction
implements
Function
{
int
called
=
0
;
...
...
@@ -191,4 +193,92 @@ void main() {
final
RenderBox
iconBox
=
tester
.
renderObject
(
find
.
byType
(
IconButton
));
expect
(
iconBox
.
size
.
height
,
equals
(
barBox
.
size
.
height
));
});
// This test is very similar to the '...explicit splashColor and highlightColor' test
// in buttons_test.dart. If you change this one, you may want to also change that one.
testWidgets
(
'IconButton with explicit splashColor and highlightColor'
,
(
WidgetTester
tester
)
async
{
final
Color
directSplashColor
=
const
Color
(
0xFF00000F
);
final
Color
directHighlightColor
=
const
Color
(
0xFF0000F0
);
Widget
buttonWidget
=
new
Material
(
child:
new
Center
(
child:
new
IconButton
(
icon:
const
Icon
(
Icons
.
android
),
splashColor:
directSplashColor
,
highlightColor:
directHighlightColor
,
onPressed:
()
{
/* enable the button */
},
),
),
);
await
tester
.
pumpWidget
(
new
Theme
(
data:
new
ThemeData
(),
child:
buttonWidget
,
),
);
final
Offset
center
=
tester
.
getCenter
(
find
.
byType
(
IconButton
));
final
TestGesture
gesture
=
await
tester
.
startGesture
(
center
);
await
tester
.
pump
();
// start gesture
await
tester
.
pump
(
const
Duration
(
milliseconds:
200
));
// wait for splash to be well under way
expect
(
Material
.
of
(
tester
.
element
(
find
.
byType
(
IconButton
))),
paints
..
circle
(
color:
directSplashColor
)
..
circle
(
color:
directHighlightColor
)
);
final
Color
themeSplashColor1
=
const
Color
(
0xFF000F00
);
final
Color
themeHighlightColor1
=
const
Color
(
0xFF00FF00
);
buttonWidget
=
new
Material
(
child:
new
Center
(
child:
new
IconButton
(
icon:
const
Icon
(
Icons
.
android
),
onPressed:
()
{
/* enable the button */
},
),
),
);
await
tester
.
pumpWidget
(
new
Theme
(
data:
new
ThemeData
(
highlightColor:
themeHighlightColor1
,
splashColor:
themeSplashColor1
,
),
child:
buttonWidget
,
),
);
expect
(
Material
.
of
(
tester
.
element
(
find
.
byType
(
IconButton
))),
paints
..
circle
(
color:
themeSplashColor1
)
..
circle
(
color:
themeHighlightColor1
)
);
final
Color
themeSplashColor2
=
const
Color
(
0xFF002200
);
final
Color
themeHighlightColor2
=
const
Color
(
0xFF001100
);
await
tester
.
pumpWidget
(
new
Theme
(
data:
new
ThemeData
(
highlightColor:
themeHighlightColor2
,
splashColor:
themeSplashColor2
,
),
child:
buttonWidget
,
// same widget, so does not get updated because of us
),
);
expect
(
Material
.
of
(
tester
.
element
(
find
.
byType
(
IconButton
))),
paints
..
circle
(
color:
themeSplashColor2
)
..
circle
(
color:
themeHighlightColor2
)
);
await
gesture
.
up
();
});
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment