Increase contrast of Checkbox, Radio, And Switch widgets (#17637)
This commit is contained in:
parent
d2d2fb4163
commit
ebd9a9621d
@ -98,7 +98,7 @@ class Checkbox extends StatefulWidget {
|
|||||||
|
|
||||||
/// The color to use when this checkbox is checked.
|
/// The color to use when this checkbox is checked.
|
||||||
///
|
///
|
||||||
/// Defaults to accent color of the current [Theme].
|
/// Defaults to [ThemeData.toggleableActiveColor].
|
||||||
final Color activeColor;
|
final Color activeColor;
|
||||||
|
|
||||||
/// If true the checkbox's [value] can be true, false, or null.
|
/// If true the checkbox's [value] can be true, false, or null.
|
||||||
@ -128,7 +128,7 @@ class _CheckboxState extends State<Checkbox> with TickerProviderStateMixin {
|
|||||||
return new _CheckboxRenderObjectWidget(
|
return new _CheckboxRenderObjectWidget(
|
||||||
value: widget.value,
|
value: widget.value,
|
||||||
tristate: widget.tristate,
|
tristate: widget.tristate,
|
||||||
activeColor: widget.activeColor ?? themeData.accentColor,
|
activeColor: widget.activeColor ?? themeData.toggleableActiveColor,
|
||||||
inactiveColor: widget.onChanged != null ? themeData.unselectedWidgetColor : themeData.disabledColor,
|
inactiveColor: widget.onChanged != null ? themeData.unselectedWidgetColor : themeData.disabledColor,
|
||||||
onChanged: widget.onChanged,
|
onChanged: widget.onChanged,
|
||||||
vsync: this,
|
vsync: this,
|
||||||
|
@ -93,7 +93,7 @@ class Radio<T> extends StatefulWidget {
|
|||||||
|
|
||||||
/// The color to use when this radio button is selected.
|
/// The color to use when this radio button is selected.
|
||||||
///
|
///
|
||||||
/// Defaults to accent color of the current [Theme].
|
/// Defaults to [ThemeData.toggleableActiveColor].
|
||||||
final Color activeColor;
|
final Color activeColor;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
@ -118,7 +118,7 @@ class _RadioState<T> extends State<Radio<T>> with TickerProviderStateMixin {
|
|||||||
final ThemeData themeData = Theme.of(context);
|
final ThemeData themeData = Theme.of(context);
|
||||||
return new _RadioRenderObjectWidget(
|
return new _RadioRenderObjectWidget(
|
||||||
selected: widget.value == widget.groupValue,
|
selected: widget.value == widget.groupValue,
|
||||||
activeColor: widget.activeColor ?? themeData.accentColor,
|
activeColor: widget.activeColor ?? themeData.toggleableActiveColor,
|
||||||
inactiveColor: _getInactiveColor(themeData),
|
inactiveColor: _getInactiveColor(themeData),
|
||||||
onChanged: _enabled ? _handleChanged : null,
|
onChanged: _enabled ? _handleChanged : null,
|
||||||
vsync: this,
|
vsync: this,
|
||||||
|
@ -88,12 +88,12 @@ class Switch extends StatefulWidget {
|
|||||||
|
|
||||||
/// The color to use when this switch is on.
|
/// The color to use when this switch is on.
|
||||||
///
|
///
|
||||||
/// Defaults to accent color of the current [Theme].
|
/// Defaults to [ThemeData.toggleableActiveColor].
|
||||||
final Color activeColor;
|
final Color activeColor;
|
||||||
|
|
||||||
/// The color to use on the track when this switch is on.
|
/// The color to use on the track when this switch is on.
|
||||||
///
|
///
|
||||||
/// Defaults to accent color of the current [Theme] with the opacity set at 50%.
|
/// Defaults to [ThemeData.toggleableActiveColor] with the opacity set at 50%.
|
||||||
final Color activeTrackColor;
|
final Color activeTrackColor;
|
||||||
|
|
||||||
/// The color to use on the thumb when this switch is off.
|
/// The color to use on the thumb when this switch is off.
|
||||||
@ -130,7 +130,7 @@ class _SwitchState extends State<Switch> with TickerProviderStateMixin {
|
|||||||
final ThemeData themeData = Theme.of(context);
|
final ThemeData themeData = Theme.of(context);
|
||||||
final bool isDark = themeData.brightness == Brightness.dark;
|
final bool isDark = themeData.brightness == Brightness.dark;
|
||||||
|
|
||||||
final Color activeThumbColor = widget.activeColor ?? themeData.accentColor;
|
final Color activeThumbColor = widget.activeColor ?? themeData.toggleableActiveColor;
|
||||||
final Color activeTrackColor = widget.activeTrackColor ?? activeThumbColor.withAlpha(0x80);
|
final Color activeTrackColor = widget.activeTrackColor ?? activeThumbColor.withAlpha(0x80);
|
||||||
|
|
||||||
Color inactiveThumbColor;
|
Color inactiveThumbColor;
|
||||||
|
@ -93,6 +93,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
Color indicatorColor,
|
Color indicatorColor,
|
||||||
Color hintColor,
|
Color hintColor,
|
||||||
Color errorColor,
|
Color errorColor,
|
||||||
|
Color toggleableActiveColor,
|
||||||
String fontFamily,
|
String fontFamily,
|
||||||
TextTheme textTheme,
|
TextTheme textTheme,
|
||||||
TextTheme primaryTextTheme,
|
TextTheme primaryTextTheme,
|
||||||
@ -114,6 +115,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
primaryColorDark ??= isDark ? Colors.black : primarySwatch[700];
|
primaryColorDark ??= isDark ? Colors.black : primarySwatch[700];
|
||||||
final bool primaryIsDark = primaryColorBrightness == Brightness.dark;
|
final bool primaryIsDark = primaryColorBrightness == Brightness.dark;
|
||||||
accentColor ??= isDark ? Colors.tealAccent[200] : primarySwatch[500];
|
accentColor ??= isDark ? Colors.tealAccent[200] : primarySwatch[500];
|
||||||
|
toggleableActiveColor ??= isDark ? Colors.tealAccent[200] : primarySwatch[600];
|
||||||
accentColorBrightness ??= estimateBrightnessForColor(accentColor);
|
accentColorBrightness ??= estimateBrightnessForColor(accentColor);
|
||||||
final bool accentIsDark = accentColorBrightness == Brightness.dark;
|
final bool accentIsDark = accentColorBrightness == Brightness.dark;
|
||||||
canvasColor ??= isDark ? Colors.grey[850] : Colors.grey[50];
|
canvasColor ??= isDark ? Colors.grey[850] : Colors.grey[50];
|
||||||
@ -186,6 +188,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
unselectedWidgetColor: unselectedWidgetColor,
|
unselectedWidgetColor: unselectedWidgetColor,
|
||||||
disabledColor: disabledColor,
|
disabledColor: disabledColor,
|
||||||
buttonColor: buttonColor,
|
buttonColor: buttonColor,
|
||||||
|
toggleableActiveColor: toggleableActiveColor,
|
||||||
buttonTheme: buttonTheme,
|
buttonTheme: buttonTheme,
|
||||||
secondaryHeaderColor: secondaryHeaderColor,
|
secondaryHeaderColor: secondaryHeaderColor,
|
||||||
textSelectionColor: textSelectionColor,
|
textSelectionColor: textSelectionColor,
|
||||||
@ -243,6 +246,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
@required this.indicatorColor,
|
@required this.indicatorColor,
|
||||||
@required this.hintColor,
|
@required this.hintColor,
|
||||||
@required this.errorColor,
|
@required this.errorColor,
|
||||||
|
@required this.toggleableActiveColor,
|
||||||
@required this.textTheme,
|
@required this.textTheme,
|
||||||
@required this.primaryTextTheme,
|
@required this.primaryTextTheme,
|
||||||
@required this.accentTextTheme,
|
@required this.accentTextTheme,
|
||||||
@ -271,6 +275,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
assert(selectedRowColor != null),
|
assert(selectedRowColor != null),
|
||||||
assert(unselectedWidgetColor != null),
|
assert(unselectedWidgetColor != null),
|
||||||
assert(disabledColor != null),
|
assert(disabledColor != null),
|
||||||
|
assert(toggleableActiveColor != null),
|
||||||
assert(buttonTheme != null),
|
assert(buttonTheme != null),
|
||||||
assert(secondaryHeaderColor != null),
|
assert(secondaryHeaderColor != null),
|
||||||
assert(textSelectionColor != null),
|
assert(textSelectionColor != null),
|
||||||
@ -402,6 +407,10 @@ class ThemeData extends Diagnosticable {
|
|||||||
/// The default fill color of the [Material] used in [RaisedButton]s.
|
/// The default fill color of the [Material] used in [RaisedButton]s.
|
||||||
final Color buttonColor;
|
final Color buttonColor;
|
||||||
|
|
||||||
|
/// The color used to highlight the active states of toggleable widgets like
|
||||||
|
/// [Switch], [Radio], and [Checkbox].
|
||||||
|
final Color toggleableActiveColor;
|
||||||
|
|
||||||
/// Defines the default configuration of button widgets, like [RaisedButton]
|
/// Defines the default configuration of button widgets, like [RaisedButton]
|
||||||
/// and [FlatButton].
|
/// and [FlatButton].
|
||||||
final ButtonThemeData buttonTheme;
|
final ButtonThemeData buttonTheme;
|
||||||
@ -504,6 +513,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
Color indicatorColor,
|
Color indicatorColor,
|
||||||
Color hintColor,
|
Color hintColor,
|
||||||
Color errorColor,
|
Color errorColor,
|
||||||
|
Color toggleableActiveColor,
|
||||||
TextTheme textTheme,
|
TextTheme textTheme,
|
||||||
TextTheme primaryTextTheme,
|
TextTheme primaryTextTheme,
|
||||||
TextTheme accentTextTheme,
|
TextTheme accentTextTheme,
|
||||||
@ -544,6 +554,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
indicatorColor: indicatorColor ?? this.indicatorColor,
|
indicatorColor: indicatorColor ?? this.indicatorColor,
|
||||||
hintColor: hintColor ?? this.hintColor,
|
hintColor: hintColor ?? this.hintColor,
|
||||||
errorColor: errorColor ?? this.errorColor,
|
errorColor: errorColor ?? this.errorColor,
|
||||||
|
toggleableActiveColor: toggleableActiveColor ?? this.toggleableActiveColor,
|
||||||
textTheme: textTheme ?? this.textTheme,
|
textTheme: textTheme ?? this.textTheme,
|
||||||
primaryTextTheme: primaryTextTheme ?? this.primaryTextTheme,
|
primaryTextTheme: primaryTextTheme ?? this.primaryTextTheme,
|
||||||
accentTextTheme: accentTextTheme ?? this.accentTextTheme,
|
accentTextTheme: accentTextTheme ?? this.accentTextTheme,
|
||||||
@ -670,6 +681,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
indicatorColor: Color.lerp(a.indicatorColor, b.indicatorColor, t),
|
indicatorColor: Color.lerp(a.indicatorColor, b.indicatorColor, t),
|
||||||
hintColor: Color.lerp(a.hintColor, b.hintColor, t),
|
hintColor: Color.lerp(a.hintColor, b.hintColor, t),
|
||||||
errorColor: Color.lerp(a.errorColor, b.errorColor, t),
|
errorColor: Color.lerp(a.errorColor, b.errorColor, t),
|
||||||
|
toggleableActiveColor: Color.lerp(a.toggleableActiveColor, b.toggleableActiveColor, t),
|
||||||
textTheme: TextTheme.lerp(a.textTheme, b.textTheme, t),
|
textTheme: TextTheme.lerp(a.textTheme, b.textTheme, t),
|
||||||
primaryTextTheme: TextTheme.lerp(a.primaryTextTheme, b.primaryTextTheme, t),
|
primaryTextTheme: TextTheme.lerp(a.primaryTextTheme, b.primaryTextTheme, t),
|
||||||
accentTextTheme: TextTheme.lerp(a.accentTextTheme, b.accentTextTheme, t),
|
accentTextTheme: TextTheme.lerp(a.accentTextTheme, b.accentTextTheme, t),
|
||||||
@ -703,6 +715,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
(otherData.unselectedWidgetColor == unselectedWidgetColor) &&
|
(otherData.unselectedWidgetColor == unselectedWidgetColor) &&
|
||||||
(otherData.disabledColor == disabledColor) &&
|
(otherData.disabledColor == disabledColor) &&
|
||||||
(otherData.buttonColor == buttonColor) &&
|
(otherData.buttonColor == buttonColor) &&
|
||||||
|
(otherData.toggleableActiveColor == toggleableActiveColor) &&
|
||||||
(otherData.buttonTheme == buttonTheme) &&
|
(otherData.buttonTheme == buttonTheme) &&
|
||||||
(otherData.secondaryHeaderColor == secondaryHeaderColor) &&
|
(otherData.secondaryHeaderColor == secondaryHeaderColor) &&
|
||||||
(otherData.textSelectionColor == textSelectionColor) &&
|
(otherData.textSelectionColor == textSelectionColor) &&
|
||||||
@ -749,6 +762,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
textSelectionColor,
|
textSelectionColor,
|
||||||
textSelectionHandleColor,
|
textSelectionHandleColor,
|
||||||
hashValues( // Too many values.
|
hashValues( // Too many values.
|
||||||
|
toggleableActiveColor,
|
||||||
backgroundColor,
|
backgroundColor,
|
||||||
accentColor,
|
accentColor,
|
||||||
accentColorBrightness,
|
accentColorBrightness,
|
||||||
@ -799,6 +813,7 @@ class ThemeData extends Diagnosticable {
|
|||||||
properties.add(new DiagnosticsProperty<Color>('indicatorColor', indicatorColor, defaultValue: defaultData.indicatorColor));
|
properties.add(new DiagnosticsProperty<Color>('indicatorColor', indicatorColor, defaultValue: defaultData.indicatorColor));
|
||||||
properties.add(new DiagnosticsProperty<Color>('hintColor', hintColor, defaultValue: defaultData.hintColor));
|
properties.add(new DiagnosticsProperty<Color>('hintColor', hintColor, defaultValue: defaultData.hintColor));
|
||||||
properties.add(new DiagnosticsProperty<Color>('errorColor', errorColor, defaultValue: defaultData.errorColor));
|
properties.add(new DiagnosticsProperty<Color>('errorColor', errorColor, defaultValue: defaultData.errorColor));
|
||||||
|
properties.add(new DiagnosticsProperty<Color>('toggleableActiveColor', toggleableActiveColor, defaultValue: defaultData.toggleableActiveColor));
|
||||||
properties.add(new DiagnosticsProperty<ButtonThemeData>('buttonTheme', buttonTheme));
|
properties.add(new DiagnosticsProperty<ButtonThemeData>('buttonTheme', buttonTheme));
|
||||||
properties.add(new DiagnosticsProperty<TextTheme>('textTheme', textTheme));
|
properties.add(new DiagnosticsProperty<TextTheme>('textTheme', textTheme));
|
||||||
properties.add(new DiagnosticsProperty<TextTheme>('primaryTextTheme', primaryTextTheme));
|
properties.add(new DiagnosticsProperty<TextTheme>('primaryTextTheme', primaryTextTheme));
|
||||||
|
Loading…
x
Reference in New Issue
Block a user