diff --git a/packages/flutter/lib/src/material/expansion_panel.dart b/packages/flutter/lib/src/material/expansion_panel.dart index 7731324c3a..0b13a3dc29 100644 --- a/packages/flutter/lib/src/material/expansion_panel.dart +++ b/packages/flutter/lib/src/material/expansion_panel.dart @@ -78,6 +78,7 @@ class ExpansionPanel { required this.body, this.isExpanded = false, this.canTapOnHeader = false, + this.backgroundColor, }) : assert(headerBuilder != null), assert(body != null), assert(isExpanded != null), @@ -101,6 +102,10 @@ class ExpansionPanel { /// Defaults to false. final bool canTapOnHeader; + /// Defines the background color of the panel. + /// + /// Defaults to [ThemeData.cardColor]. + final Color? backgroundColor; } /// An expansion panel that allows for radio-like functionality. @@ -123,11 +128,13 @@ class ExpansionPanelRadio extends ExpansionPanel { required ExpansionPanelHeaderBuilder headerBuilder, required Widget body, bool canTapOnHeader = false, + Color? backgroundColor, }) : assert(value != null), super( body: body, headerBuilder: headerBuilder, canTapOnHeader: canTapOnHeader, + backgroundColor: backgroundColor, ); /// The value that uniquely identifies a radio panel so that the currently @@ -530,6 +537,7 @@ class _ExpansionPanelListState extends State { items.add( MaterialSlice( key: _SaltedKey(context, index * 2), + color: child.backgroundColor, child: Column( children: [ header, diff --git a/packages/flutter/test/material/expansion_panel_test.dart b/packages/flutter/test/material/expansion_panel_test.dart index 0f31aec9d7..fa690d7ad1 100644 --- a/packages/flutter/test/material/expansion_panel_test.dart +++ b/packages/flutter/test/material/expansion_panel_test.dart @@ -1458,4 +1458,75 @@ void main() { ' possible elevation values.' )); }); + + testWidgets('ExpansionPanel.panelColor test', (WidgetTester tester) async { + const Color firstPanelColor = Colors.red; + const Color secondPanelColor = Colors.brown; + + await tester.pumpWidget( + MaterialApp( + home: SingleChildScrollView( + child: ExpansionPanelList( + expansionCallback: (int _index, bool _isExpanded) {}, + children: [ + ExpansionPanel( + backgroundColor: firstPanelColor, + headerBuilder: (BuildContext context, bool isExpanded) { + return const Text('A'); + }, + body: const SizedBox(height: 100.0), + ), + ExpansionPanel( + backgroundColor: secondPanelColor, + headerBuilder: (BuildContext context, bool isExpanded) { + return const Text('B'); + }, + body: const SizedBox(height: 100.0), + ), + ], + ), + ), + ), + ); + + final MergeableMaterial mergeableMaterial = tester.widget(find.byType(MergeableMaterial)); + + expect((mergeableMaterial.children.first as MaterialSlice).color, firstPanelColor); + expect((mergeableMaterial.children.last as MaterialSlice).color, secondPanelColor); + }); + + testWidgets('ExpansionPanelRadio.backgroundColor test', (WidgetTester tester) async { + const Color firstPanelColor = Colors.red; + const Color secondPanelColor = Colors.brown; + + await tester.pumpWidget(MaterialApp( + home: SingleChildScrollView( + child: ExpansionPanelList.radio( + children: [ + ExpansionPanelRadio( + backgroundColor: firstPanelColor, + headerBuilder: (BuildContext context, bool isExpanded) { + return const Text('A'); + }, + body: const SizedBox(height: 100.0), + value: 0, + ), + ExpansionPanelRadio( + backgroundColor: secondPanelColor, + headerBuilder: (BuildContext context, bool isExpanded) { + return const Text('B'); + }, + body: const SizedBox(height: 100.0), + value: 1, + ), + ], + ), + ), + )); + + final MergeableMaterial mergeableMaterial = tester.widget(find.byType(MergeableMaterial)); + + expect((mergeableMaterial.children.first as MaterialSlice).color, firstPanelColor); + expect((mergeableMaterial.children.last as MaterialSlice).color, secondPanelColor); + }); }