Collapsible

1class CollapsibleExample extends StatefulWidget {
2  @override
3  State<CollapsibleExample> createState() => _CollapsibleExampleState();
4}
5
6class _CollapsibleExampleState extends State<CollapsibleExample>
7    with SingleTickerProviderStateMixin {
8  late final _controller = AnimationController(
9    duration: const Duration(milliseconds: 300),
10    vsync: this,
11  );
12  late final _animation = CurvedAnimation(
13    parent: _controller,
14    curve: Curves.easeInOut,
15  );
16  bool _expanded = false;
17
18  @override
19  void dispose() {
20    _animation.dispose();
21    _controller.dispose();
22    super.dispose();
23  }
24
25  @override
26  Widget build(BuildContext _) => Column(
27    mainAxisSize: .min,
28    spacing: 16,
29    children: [
30      FButton(
31        variant: .outline,
32        size: .sm,
33        mainAxisSize: .min,
34        onPress: () {
35          setState(() => _expanded = !_expanded);
36          _controller.toggle();
37        },
38        child: Text(_expanded ? 'Collapse' : 'Expand'),
39      ),
40      AnimatedBuilder(
41        animation: _animation,
42        builder: (context, child) => FCollapsible(
43          value: _animation.value,
44          child: FCard(
45            title: const Text('Lorem ipsum'),
46            child: const Text(
47              'Sed ut perspiciatis unde omnis iste natus error sit voluptatem '
48              'accusantium doloremque laudantium, totam rem aperiam, eaque ipsa '
49              'quae ab illo inventore veritatis et quasi architecto beatae vitae '
50              'dicta sunt explicabo.',
51            ),
52          ),
53        ),
54      ),
55    ],
56  );
57}
58

Usage

`FCollapsible(...)`

1FCollapsible(
2  value: 0.5,
3  child: Placeholder(),
4)

Usage

FCollapsible(...)

On this page

`FCollapsible(...)`