mirror of
https://github.com/flutter/flutter.git
synced 2025-06-03 00:51:18 +00:00
Fix ColorScheme
example and tests (#150018)
## Description This fixes the `ColorScheme` example to actually work. The test had wrapped the app in an additional `MaterialApp`, which allowed the tests to work, but the real problem was using a `context` that was outside the `MaterialApp` to open the bottom sheet, which caused an exception when you actually try to run it interactively. This fixes the example and the test. ## Tests - Fixed the test to not artificially add a second `MaterialApp`.
This commit is contained in:
parent
14df7be3f9
commit
966d2b9223
@ -40,26 +40,17 @@ class _ColorSchemeExampleState extends State<ColorSchemeExample> {
|
|||||||
seedColor: selectedColor,
|
seedColor: selectedColor,
|
||||||
brightness: selectedBrightness,
|
brightness: selectedBrightness,
|
||||||
contrastLevel: selectedContrast,
|
contrastLevel: selectedContrast,
|
||||||
)
|
),
|
||||||
),
|
),
|
||||||
home: Scaffold(
|
home: Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
title: const Text('ColorScheme'),
|
title: const Text('ColorScheme'),
|
||||||
actions: <Widget>[
|
actions: <Widget>[
|
||||||
IconButton(
|
SettingsButton(
|
||||||
icon: const Icon(Icons.settings),
|
|
||||||
onPressed: () {
|
|
||||||
showModalBottomSheet<void>(
|
|
||||||
barrierColor: Colors.transparent,
|
|
||||||
context: context,
|
|
||||||
builder: (BuildContext context) => Settings(
|
|
||||||
selectedColor: selectedColor,
|
selectedColor: selectedColor,
|
||||||
selectedBrightness: selectedBrightness,
|
selectedBrightness: selectedBrightness,
|
||||||
selectedContrast: selectedContrast,
|
selectedContrast: selectedContrast,
|
||||||
updateTheme: updateTheme
|
updateTheme: updateTheme,
|
||||||
)
|
|
||||||
);
|
|
||||||
},
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
@ -118,7 +109,8 @@ class _SettingsState extends State<Settings> {
|
|||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Theme(
|
return Theme(
|
||||||
data: Theme.of(context).copyWith(colorScheme: ColorScheme.fromSeed(
|
data: Theme.of(context).copyWith(
|
||||||
|
colorScheme: ColorScheme.fromSeed(
|
||||||
seedColor: selectedColor,
|
seedColor: selectedColor,
|
||||||
contrastLevel: selectedContrast,
|
contrastLevel: selectedContrast,
|
||||||
brightness: selectedBrightness,
|
brightness: selectedBrightness,
|
||||||
@ -139,16 +131,16 @@ class _SettingsState extends State<Settings> {
|
|||||||
setState(() {
|
setState(() {
|
||||||
selectedBrightness = value ? Brightness.light : Brightness.dark;
|
selectedBrightness = value ? Brightness.light : Brightness.dark;
|
||||||
});
|
});
|
||||||
widget.updateTheme.call(selectedBrightness, selectedColor, selectedContrast);
|
widget.updateTheme(selectedBrightness, selectedColor, selectedContrast);
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
Wrap(
|
Wrap(crossAxisAlignment: WrapCrossAlignment.center, children: <Widget>[
|
||||||
crossAxisAlignment: WrapCrossAlignment.center,
|
|
||||||
children: <Widget>[
|
|
||||||
const Text('Seed color: '),
|
const Text('Seed color: '),
|
||||||
...List<Widget>.generate(ColorSeed.values.length, (int index) {
|
...List<Widget>.generate(
|
||||||
|
ColorSeed.values.length,
|
||||||
|
(int index) {
|
||||||
final Color itemColor = ColorSeed.values[index].color;
|
final Color itemColor = ColorSeed.values[index].color;
|
||||||
return IconButton(
|
return IconButton(
|
||||||
icon: selectedColor == ColorSeed.values[index].color
|
icon: selectedColor == ColorSeed.values[index].color
|
||||||
@ -158,12 +150,12 @@ class _SettingsState extends State<Settings> {
|
|||||||
setState(() {
|
setState(() {
|
||||||
selectedColor = itemColor;
|
selectedColor = itemColor;
|
||||||
});
|
});
|
||||||
widget.updateTheme.call(selectedBrightness, selectedColor, selectedContrast);
|
widget.updateTheme(selectedBrightness, selectedColor, selectedContrast);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
}),
|
},
|
||||||
]
|
|
||||||
),
|
),
|
||||||
|
]),
|
||||||
Row(
|
Row(
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
const Text('Contrast level: '),
|
const Text('Contrast level: '),
|
||||||
@ -177,7 +169,7 @@ class _SettingsState extends State<Settings> {
|
|||||||
setState(() {
|
setState(() {
|
||||||
selectedContrast = value;
|
selectedContrast = value;
|
||||||
});
|
});
|
||||||
widget.updateTheme.call(selectedBrightness, selectedColor, selectedContrast);
|
widget.updateTheme(selectedBrightness, selectedColor, selectedContrast);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@ -230,7 +222,7 @@ class ColorSchemeVariantColumn extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
)
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -426,3 +418,39 @@ enum ColorSeed {
|
|||||||
final String label;
|
final String label;
|
||||||
final Color color;
|
final Color color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class SettingsButton extends StatelessWidget {
|
||||||
|
const SettingsButton({
|
||||||
|
super.key,
|
||||||
|
required this.updateTheme,
|
||||||
|
required this.selectedBrightness,
|
||||||
|
required this.selectedContrast,
|
||||||
|
required this.selectedColor,
|
||||||
|
});
|
||||||
|
|
||||||
|
final Brightness selectedBrightness;
|
||||||
|
final double selectedContrast;
|
||||||
|
final Color selectedColor;
|
||||||
|
|
||||||
|
final void Function(Brightness, Color, double) updateTheme;
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return IconButton(
|
||||||
|
icon: const Icon(Icons.settings),
|
||||||
|
onPressed: () {
|
||||||
|
showModalBottomSheet<void>(
|
||||||
|
barrierColor: Colors.transparent,
|
||||||
|
context: context,
|
||||||
|
builder: (BuildContext context) {
|
||||||
|
return Settings(
|
||||||
|
selectedColor: selectedColor,
|
||||||
|
selectedBrightness: selectedBrightness,
|
||||||
|
selectedContrast: selectedContrast,
|
||||||
|
updateTheme: updateTheme);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -9,8 +9,7 @@ import 'package:flutter_test/flutter_test.dart';
|
|||||||
void main() {
|
void main() {
|
||||||
testWidgets('ColorScheme Smoke Test', (WidgetTester tester) async {
|
testWidgets('ColorScheme Smoke Test', (WidgetTester tester) async {
|
||||||
await tester.pumpWidget(
|
await tester.pumpWidget(
|
||||||
const MaterialApp(home: example.ColorSchemeExample()
|
const example.ColorSchemeExample(),
|
||||||
),
|
|
||||||
);
|
);
|
||||||
expect(find.text('tonalSpot (Default)'), findsOneWidget);
|
expect(find.text('tonalSpot (Default)'), findsOneWidget);
|
||||||
|
|
||||||
@ -19,7 +18,7 @@ void main() {
|
|||||||
|
|
||||||
testWidgets('Change color seed', (WidgetTester tester) async {
|
testWidgets('Change color seed', (WidgetTester tester) async {
|
||||||
await tester.pumpWidget(
|
await tester.pumpWidget(
|
||||||
const MaterialApp(home: example.ColorSchemeExample()),
|
const example.ColorSchemeExample(),
|
||||||
);
|
);
|
||||||
|
|
||||||
ColoredBox coloredBox() {
|
ColoredBox coloredBox() {
|
||||||
@ -31,8 +30,9 @@ void main() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
expect(coloredBox().color, const Color(0xff65558f));
|
expect(coloredBox().color, const Color(0xff65558f));
|
||||||
await tester.tap(find.byIcon(Icons.settings));
|
await tester.tap(find.byType(example.SettingsButton));
|
||||||
await tester.pumpAndSettle();
|
await tester.pumpAndSettle();
|
||||||
|
expect(find.text('Settings'), findsOneWidget);
|
||||||
await tester.tap(find.byType(IconButton).at(6));
|
await tester.tap(find.byType(IconButton).at(6));
|
||||||
await tester.pumpAndSettle();
|
await tester.pumpAndSettle();
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user