Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to align sub-headings in the Expansion Tile in a Drawer?

Tags:

flutter

dart

I've an ExpansionTile in a ListView in a Drawer ..I want the sub headings to align directly under its main heading the following gif shows current state..

Drawer: Want Subheading directly under Item0

Scaffold(
  appBar: AppBar(title: Text(title)),
  body: Center(child: Text('My Page!')),
  drawer: Drawer(
    // Add a ListView to the drawer. This ensures the user can scroll
    // through the options in the Drawer if there isn't enough vertical
    // space to fit everything.
    child: ListView(
      // Important: Remove any padding from the ListView.
      // padding: EdgeInsets.zero,
      children: <Widget>[
        DrawerHeader(
          child: Text('Drawer Header'),
          decoration: BoxDecoration(
            color: Colors.blue,
          ),
        ),
        ExpansionTile(
          title: Text('Item0'),
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text('subHeading1'),
            ),
            Text('subheading2')
          ],
        ),
        ListTile(
          title: Text('Item 1'),
          onTap: () {
            // Update the state of the app
            // ...
            // Then close the drawer
            Navigator.pop(context);
          },
        ),
        ListTile(
          title: Text('Item 2'),
          onTap: () {
            // Update the state of the app
            // ...
            // Then close the drawer
            Navigator.pop(context);
          },
        ),
      ],
    ),
  ),
);
like image 430
flutter Avatar asked Oct 20 '25 04:10

flutter


1 Answers

This Should Solve this :

    ExpansionTile(
      title: Text('Item0'),
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Align(
            alignment: Alignment.topLeft,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Text('subHeading1'),
                Text('subHeading2')
              ],
            ),
          ),
        ),
      ],
    ),
like image 180
anmol.majhail Avatar answered Oct 22 '25 19:10

anmol.majhail



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!