flutterdartwidgetfolding

I can't find widget to fold or expand children widget

I am sorry about cant upload IMG because of sign up first. so I got the link

https://getbootstrap.com/docs/3.3/javascript/#collapse

like this function,

I want to make a widget in normal times, only the parent widget reveals its shape, but if I press the parent widget, its children's widgets reveal their shape under its shape. but I can't find a widget to get this function. could you tell me the widget? or could I solve this problem with animation?

I find StackOverflow, flutter documents. but I can't find

Solution

  • You can use ExpansionTile Widget for that. refer to below code hope its helps you.

    ExpansionTile(
          title: Text('Collapsible Group Item #1'),
          children: <Widget>[
            ListTile(
              title: Text(
                'Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus'
                'terry richardson ad squid. 3 wolf moon officia aute,'
                'non cupidatat skateboard dolor brunch. Food truck quinoa'
                'nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put'
                'a bird on it squid single-origin coffee nulla assumenda shoreditch et.'
                'Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred'
                'nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo.'
                'Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt'
                'you probably havent heard of them accusamus labore sustainable VHS.',
              ),
            ),
          ],
        ),

    Full Code:

    import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: const MyStatefulWidget(),
      ),
    );
  }
}

class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget({Key? key}) : super(key: key);

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  bool _customTileExpanded = false;

  @override
  Widget build(BuildContext context) {
    return const ExpansionTile(
      title: Text('Collapsible Group Item #1'),
      children: <Widget>[
        ListTile(
          title: Text(
            'Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus'
            'terry richardson ad squid. 3 wolf moon officia aute,'
            'non cupidatat skateboard dolor brunch. Food truck quinoa'
            'nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put'
            'a bird on it squid single-origin coffee nulla assumenda shoreditch et.'
            'Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred'
            'nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo.'
            'Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt'
            'you probably havent heard of them accusamus labore sustainable VHS.',
          ),
        ),
      ],
    );
  }
}

    You can test your code on Dartpad

    Your result screen-> image