Класс ExpansionPanel

Класс ExpansionPanel передают в children у ExpansionPanelList. Заголовок - headerBuilder, тело - body, можно ли раскрыть - canTapOnHeader.

Синтаксис

ExpansionPanel(
	headerBuilder: (BuildContext context, bool isExpanded) {
		return ListTile(title: Text('abcde'));
	},
	body: Padding(
		padding: EdgeInsets.all(16),
		child: Text('12345'),
	),
)

Параметры

Параметр	Описание
`headerBuilder`	Строит заголовок панели.
`body`	Содержимое раскрытой панели.
`isExpanded`	Раскрыта ли эта панель сейчас.

Пример

Давайте соберём ExpansionPanelList:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: PanelDemo()));
}

class PanelDemo extends StatefulWidget
{
	const PanelDemo({super.key});

	@override
	State<PanelDemo> createState() => _PanelDemoState();
}

class _PanelDemoState extends State<PanelDemo>
{
	int open = 0;

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			body: ExpansionPanelList(
				expansionCallback: (i, open) {
					setState(() => this.open = open ? i : -1);
				},
				children: [
					ExpansionPanel(
						isExpanded: open == 0,
						headerBuilder: (c, e) => ListTile(title: Text('abcde')),
						body: Text('12345'),
					),
				],
			),
		);
	}
}

Нажатие на заголовок раскроет текст '12345'.

Пример

Давайте добавим вторую панель:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: ExpansionPanelList(
					expansionCallback: (i, o) {},
					children: [
						ExpansionPanel(
							headerBuilder: (c, e) => Text('abcde'),
							body: Text('11111'),
						),
						ExpansionPanel(
							headerBuilder: (c, e) => Text('12345'),
							body: Text('22222'),
						),
					],
				),
			),
		),
	);
}

Две панели с разными заголовками и телами.

Смотрите также

виджет ExpansionPanelList,
список панелей
класс ExpansionPanelRadio,
вариант с radio
виджет ExpansionTile,
одна раскрывающаяся строка
виджет ListTile,
заголовок в headerBuilder