Skip to content

Commit 835b892

Browse files
authored
[ExpansionPanelList] add materialGapSize property in ExpansionPanelList Widget (flutter#123971)
Adds `materialGapSize` property to `ExpansionPanelList` widget. | `materialGapSize: 0` | `materialGapSize: 16` (default) | `materialGapSize: 30` | | --- | --- | --- | | ![screenshot_1680450783](https://user-images.githubusercontent.com/13456345/229366131-8dd105cd-6371-4852-b57b-5900e3dbd203.png) | ![screenshot_1680453525](https://user-images.githubusercontent.com/13456345/229366640-e2ae5f95-0cd6-4694-b8ff-0de7fb7c8554.png) | ![screenshot_1680450910](https://user-images.githubusercontent.com/13456345/229366742-3121331b-b22e-46a1-bdfa-20b5663cbe2b.png) | | ![screenshot_1680450785](https://user-images.githubusercontent.com/13456345/229366133-bf345914-9d74-4dcc-afc4-a6a9ccca13ab.png) | ![screenshot_1680453527](https://user-images.githubusercontent.com/13456345/229366644-bfff8e4f-8a66-4419-90b8-6a16442b7157.png) | ![screenshot_1680450912](https://user-images.githubusercontent.com/13456345/229366745-364b1a1e-ed2c-4463-a74d-d8e94bf509b9.png) | | ![screenshot_1680450787](https://user-images.githubusercontent.com/13456345/229366138-3f6280f0-e58a-4621-aced-c7eee2077ef8.png) | ![screenshot_1680453530](https://user-images.githubusercontent.com/13456345/229366648-3805db23-29b0-46a3-82ce-92688e65f0fd.png) | ![screenshot_1680450914](https://user-images.githubusercontent.com/13456345/229366747-73d46f9c-3edc-4197-8f02-651ff8499323.png) | | ![screenshot_1680450789](https://user-images.githubusercontent.com/13456345/229366140-4ff8572c-8d06-4985-a697-3af0ce0e5743.png) | ![screenshot_1680453532](https://user-images.githubusercontent.com/13456345/229366651-88af37ac-7503-4abc-b6a6-d8556a583871.png) | ![screenshot_1680450916](https://user-images.githubusercontent.com/13456345/229366749-0db156b0-6b53-4ef2-9699-0d3e8704433b.png) | Fixes: flutter#118167
1 parent 61cdb08 commit 835b892

File tree

2 files changed

+96
-2
lines changed

2 files changed

+96
-2
lines changed

packages/flutter/lib/src/material/expansion_panel.dart

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -171,6 +171,7 @@ class ExpansionPanelList extends StatefulWidget {
171171
this.dividerColor,
172172
this.elevation = 2,
173173
this.expandIconColor,
174+
this.materialGapSize = 16.0,
174175
}) : _allowOnlyOnePanelOpen = false,
175176
initialOpenPanelValue = null;
176177

@@ -197,6 +198,7 @@ class ExpansionPanelList extends StatefulWidget {
197198
this.dividerColor,
198199
this.elevation = 2,
199200
this.expandIconColor,
201+
this.materialGapSize = 16.0,
200202
}) : _allowOnlyOnePanelOpen = true;
201203

202204
/// The children of the expansion panel list. They are laid out in a similar
@@ -253,6 +255,12 @@ class ExpansionPanelList extends StatefulWidget {
253255
/// {@macro flutter.material.ExpandIcon.color}
254256
final Color? expandIconColor;
255257

258+
/// Defines the [MaterialGap.size] of the [MaterialGap] which is placed
259+
/// between the [ExpansionPanelList.children] when they're expanded.
260+
///
261+
/// Defaults to `16.0`.
262+
final double materialGapSize;
263+
256264
@override
257265
State<StatefulWidget> createState() => _ExpansionPanelListState();
258266
}
@@ -348,7 +356,7 @@ class _ExpansionPanelListState extends State<ExpansionPanelList> {
348356

349357
for (int index = 0; index < widget.children.length; index += 1) {
350358
if (_isChildExpanded(index) && index != 0 && !_isChildExpanded(index - 1)) {
351-
items.add(MaterialGap(key: _SaltedKey<BuildContext, int>(context, index * 2 - 1)));
359+
items.add(MaterialGap(key: _SaltedKey<BuildContext, int>(context, index * 2 - 1), size: widget.materialGapSize));
352360
}
353361

354362
final ExpansionPanel child = widget.children[index];
@@ -422,7 +430,7 @@ class _ExpansionPanelListState extends State<ExpansionPanelList> {
422430
);
423431

424432
if (_isChildExpanded(index) && index != widget.children.length - 1) {
425-
items.add(MaterialGap(key: _SaltedKey<BuildContext, int>(context, index * 2 + 1)));
433+
items.add(MaterialGap(key: _SaltedKey<BuildContext, int>(context, index * 2 + 1), size: widget.materialGapSize));
426434
}
427435
}
428436

packages/flutter/test/material/expansion_panel_test.dart

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1619,4 +1619,90 @@ void main() {
16191619
expect((mergeableMaterial.children.first as MaterialSlice).color, firstPanelColor);
16201620
expect((mergeableMaterial.children.last as MaterialSlice).color, secondPanelColor);
16211621
});
1622+
1623+
testWidgets('ExpansionPanelList.materialGapSize defaults to 16.0', (WidgetTester tester) async {
1624+
await tester.pumpWidget(MaterialApp(
1625+
home: SingleChildScrollView(
1626+
child: ExpansionPanelList(
1627+
children: <ExpansionPanel>[
1628+
ExpansionPanel(
1629+
canTapOnHeader: true,
1630+
body: const SizedBox.shrink(),
1631+
headerBuilder: (BuildContext context, bool isExpanded) {
1632+
return const SizedBox.shrink();
1633+
},
1634+
)
1635+
],
1636+
),
1637+
),
1638+
));
1639+
1640+
final ExpansionPanelList expansionPanelList = tester.widget(find.byType(ExpansionPanelList));
1641+
expect(expansionPanelList.materialGapSize, 16);
1642+
});
1643+
1644+
testWidgets('ExpansionPanelList respects materialGapSize', (WidgetTester tester) async {
1645+
Widget buildWidgetForTest({double materialGapSize = 16}) {
1646+
return MaterialApp(
1647+
home: SingleChildScrollView(
1648+
child: ExpansionPanelList(
1649+
materialGapSize: materialGapSize,
1650+
children: <ExpansionPanel>[
1651+
ExpansionPanel(
1652+
isExpanded: true,
1653+
canTapOnHeader: true,
1654+
body: const SizedBox.shrink(),
1655+
headerBuilder: (BuildContext context, bool isExpanded) {
1656+
return const SizedBox.shrink();
1657+
},
1658+
),
1659+
ExpansionPanel(
1660+
canTapOnHeader: true,
1661+
body: const SizedBox.shrink(),
1662+
headerBuilder: (BuildContext context, bool isExpanded) {
1663+
return const SizedBox.shrink();
1664+
},
1665+
),
1666+
],
1667+
),
1668+
),
1669+
);
1670+
}
1671+
1672+
await tester.pumpWidget(buildWidgetForTest(materialGapSize: 0));
1673+
await tester.pumpAndSettle();
1674+
final MergeableMaterial mergeableMaterial = tester.widget(find.byType(MergeableMaterial));
1675+
expect(mergeableMaterial.children.length, 3);
1676+
expect(mergeableMaterial.children.whereType<MaterialGap>().length, 1);
1677+
expect(mergeableMaterial.children.whereType<MaterialSlice>().length, 2);
1678+
for (final MergeableMaterialItem e in mergeableMaterial.children) {
1679+
if (e is MaterialGap) {
1680+
expect(e.size, 0);
1681+
}
1682+
}
1683+
1684+
await tester.pumpWidget(buildWidgetForTest(materialGapSize: 20));
1685+
await tester.pumpAndSettle();
1686+
final MergeableMaterial mergeableMaterial2 = tester.widget(find.byType(MergeableMaterial));
1687+
expect(mergeableMaterial2.children.length, 3);
1688+
expect(mergeableMaterial2.children.whereType<MaterialGap>().length, 1);
1689+
expect(mergeableMaterial2.children.whereType<MaterialSlice>().length, 2);
1690+
for (final MergeableMaterialItem e in mergeableMaterial2.children) {
1691+
if (e is MaterialGap) {
1692+
expect(e.size, 20);
1693+
}
1694+
}
1695+
1696+
await tester.pumpWidget(buildWidgetForTest());
1697+
await tester.pumpAndSettle();
1698+
final MergeableMaterial mergeableMaterial3 = tester.widget(find.byType(MergeableMaterial));
1699+
expect(mergeableMaterial3.children.length, 3);
1700+
expect(mergeableMaterial3.children.whereType<MaterialGap>().length, 1);
1701+
expect(mergeableMaterial3.children.whereType<MaterialSlice>().length, 2);
1702+
for (final MergeableMaterialItem e in mergeableMaterial3.children) {
1703+
if (e is MaterialGap) {
1704+
expect(e.size, 16);
1705+
}
1706+
}
1707+
});
16221708
}

0 commit comments

Comments
 (0)