Skip to content

Commit

Permalink
Make dialog background color configurable (flutter#7320)
Browse files Browse the repository at this point in the history
  • Loading branch information
lequem committed Jan 3, 2017
1 parent 2bb93db commit eda8985
Show file tree
Hide file tree
Showing 3 changed files with 57 additions and 9 deletions.
12 changes: 3 additions & 9 deletions packages/flutter/lib/src/material/dialog.dart
Expand Up @@ -37,15 +37,9 @@ class Dialog extends StatelessWidget {
final Widget child;

Color _getColor(BuildContext context) {
Brightness brightness = Theme.of(context).brightness;
assert(brightness != null);
switch (brightness) {
case Brightness.light:
return Colors.white;
case Brightness.dark:
return Colors.grey[800];
}
return null;
ThemeData theme = Theme.of(context);
assert(theme != null);
return theme.dialogBackgroundColor;
}

@override
Expand Down
13 changes: 13 additions & 0 deletions packages/flutter/lib/src/material/theme_data.dart
Expand Up @@ -89,6 +89,7 @@ class ThemeData {
Color textSelectionColor,
Color textSelectionHandleColor,
Color backgroundColor,
Color dialogBackgroundColor,
Color indicatorColor,
Color hintColor,
Color errorColor,
Expand Down Expand Up @@ -124,6 +125,7 @@ class ThemeData {
textSelectionColor ??= isDark ? accentColor : primarySwatch[200];
textSelectionHandleColor ??= isDark ? Colors.tealAccent[400] : primarySwatch[300];
backgroundColor ??= isDark ? Colors.grey[700] : primarySwatch[200];
dialogBackgroundColor ??= isDark ? Colors.grey[800] : Colors.white;
indicatorColor ??= accentColor == primaryColor ? Colors.white : accentColor;
hintColor ??= isDark ? const Color(0x42FFFFFF) : const Color(0x4C000000);
errorColor ??= Colors.red[700];
Expand Down Expand Up @@ -155,6 +157,7 @@ class ThemeData {
textSelectionColor: textSelectionColor,
textSelectionHandleColor: textSelectionHandleColor,
backgroundColor: backgroundColor,
dialogBackgroundColor: dialogBackgroundColor,
indicatorColor: indicatorColor,
hintColor: hintColor,
errorColor: errorColor,
Expand Down Expand Up @@ -194,6 +197,7 @@ class ThemeData {
this.textSelectionColor,
this.textSelectionHandleColor,
this.backgroundColor,
this.dialogBackgroundColor,
this.indicatorColor,
this.hintColor,
this.errorColor,
Expand All @@ -212,6 +216,7 @@ class ThemeData {
assert(accentColorBrightness != null);
assert(canvasColor != null);
assert(scaffoldBackgroundColor != null);
assert(dialogBackgroundColor != null);
assert(cardColor != null);
assert(dividerColor != null);
assert(highlightColor != null);
Expand Down Expand Up @@ -327,6 +332,9 @@ class ThemeData {
/// remaining part of a progress bar.
final Color backgroundColor;

/// The background color of [Dialog] elements.
final Color dialogBackgroundColor;

/// The color of the selected tab indicator in a tab bar.
final Color indicatorColor;

Expand Down Expand Up @@ -381,6 +389,7 @@ class ThemeData {
Color textSelectionColor,
Color textSelectionHandleColor,
Color backgroundColor,
Color dialogBackgroundColor,
Color indicatorColor,
Color hintColor,
Color errorColor,
Expand Down Expand Up @@ -412,6 +421,7 @@ class ThemeData {
textSelectionColor: textSelectionColor ?? this.textSelectionColor,
textSelectionHandleColor: textSelectionHandleColor ?? this.textSelectionHandleColor,
backgroundColor: backgroundColor ?? this.backgroundColor,
dialogBackgroundColor: dialogBackgroundColor ?? this.dialogBackgroundColor,
indicatorColor: indicatorColor ?? this.indicatorColor,
hintColor: hintColor ?? this.hintColor,
errorColor: errorColor ?? this.errorColor,
Expand Down Expand Up @@ -445,6 +455,7 @@ class ThemeData {
textSelectionColor: Color.lerp(begin.textSelectionColor, end.textSelectionColor, t),
textSelectionHandleColor: Color.lerp(begin.textSelectionHandleColor, end.textSelectionHandleColor, t),
backgroundColor: Color.lerp(begin.backgroundColor, end.backgroundColor, t),
dialogBackgroundColor: Color.lerp(begin.dialogBackgroundColor, end.dialogBackgroundColor, t),
accentColor: Color.lerp(begin.accentColor, end.accentColor, t),
accentColorBrightness: t < 0.5 ? begin.accentColorBrightness : end.accentColorBrightness,
indicatorColor: Color.lerp(begin.indicatorColor, end.indicatorColor, t),
Expand Down Expand Up @@ -482,6 +493,7 @@ class ThemeData {
(otherData.textSelectionColor == textSelectionColor) &&
(otherData.textSelectionHandleColor == textSelectionHandleColor) &&
(otherData.backgroundColor == backgroundColor) &&
(otherData.dialogBackgroundColor == dialogBackgroundColor) &&
(otherData.accentColor == accentColor) &&
(otherData.accentColorBrightness == accentColorBrightness) &&
(otherData.indicatorColor == indicatorColor) &&
Expand Down Expand Up @@ -520,6 +532,7 @@ class ThemeData {
accentColorBrightness,
hashValues( // Too many values.
indicatorColor,
dialogBackgroundColor,
hintColor,
errorColor,
textTheme,
Expand Down
41 changes: 41 additions & 0 deletions packages/flutter/test/material/dialog_test.dart
Expand Up @@ -55,4 +55,45 @@ void main() {
await tester.tap(find.text('OK'));
expect(didPressOk, true);
});

testWidgets('Dialog background color', (WidgetTester tester) async {

await tester.pumpWidget(
new MaterialApp(
theme: new ThemeData(brightness: Brightness.dark),
home: new Material(
child: new Builder(
builder: (BuildContext context) {
return new Center(
child: new RaisedButton(
child: new Text('X'),
onPressed: () {
showDialog(
context: context,
child: new AlertDialog(
content: new Text('Y'),
actions: <Widget>[
]
)
);
}
)
);
}
)
)
)
);

await tester.tap(find.text('X'));
await tester.pump(); // start animation
await tester.pump(const Duration(seconds: 1));

StatefulElement widget = tester.element(find.byType(Material).last);
Material materialconfig = widget.state.config;
//first and second expect check that the material is the dialog's one
expect(materialconfig.type, MaterialType.card);
expect(materialconfig.elevation, 24);
expect(materialconfig.color, Colors.grey[800]);
});
}

0 comments on commit eda8985

Please sign in to comment.