Flutter ExpansionTile Example - Expandable Listview

Written by mouli150388 on Jan 19th, 2021 ・ Views ・ Report Post

mouli150388 Visit User Profile

We have two ways of creating an expandable view in flutter.

ExpansionTile ExpansionPanelList & ExpansionPanel

Flutter ExpansionTile

ExpansionTile: It is a simple and useful widget. This widget lets you create a collapse or expansion view with features similar to ListTile. It is like a ListTile which will expand on tapping the title.

ExpansionTile has the following attributes similar to List Tile:

Properties: backgroundColor: set the background color to the widget.

children: To add a child widget we will use this property

initiallyExpanded: if we set true, child will expands default

onExpansionChanged: To handle the expansion event

🤩 Our Amazing Sponsors 👇
DigitalOcean View Website
DigitalOcean offers a simple and reliable cloud hosting solution that enables developers to get their website or application up and running quickly.
Laravel News View Website
Laravel News keeps you up to date with everything Laravel. Everything from framework news to new community packages, Laravel tutorials, and more.
Genesis View Website
A Laravel Starter Kit that includes Authentication, User Dashboard, Edit Profile, and a set of UI Components.

title: set the header of the item

How to use ExpansionTile widget inside Flutter Application Below code will show you

ExpansionTile(
          key: PageStorageKey(this.widget.headerTitle),
          title: Container(
              width: double.infinity,

              child: Text("Header",style: TextStyle(fontSize: 18),),
          trailing: Icon(Icons.arrow_drop_down,size: 32,color: Colors.pink,),
          onExpansionChanged: (value){
            setState(() {
              isExpand=value;
            });
          },
          children: [
           Text("Child 1",style: TextStyle(fontSize: 18),),
            Text("Child 2",style: TextStyle(fontSize: 18),),
          ]
          )
          ),

Expandable Listview Examples

Comments (0)