I am new to flutter and I am stuck on a problem. I am trying to make a expansion panel list. I am able to make the list but not able to make the expansion panels expand or collapse.I am attaching the code. Please have a look at it and let me know the problem.
ExpansionPanelList criteria;
criteria = new ExpansionPanelList(
children: <ExpansionPanel>[
new ExpansionPanel(
headerBuilder: schoolheaderBuilder,
body: new Text("school"),
isExpanded: false,
),
new ExpansionPanel(
headerBuilder: hospitalheaderBuilder,
body: new Text("hospital"),
),
new ExpansionPanel(
headerBuilder: vaheaderBuilder,
body: new Text("va facility"),
isExpanded: false),
new ExpansionPanel(
headerBuilder: restheaderBuilder,
body: new Text("Restaurants"),
isExpanded: false),
new ExpansionPanel(
headerBuilder: crimeheaderBuilder,
body: new Text("Crime"),
isExpanded: false),
new ExpansionPanel(
headerBuilder: commuteheaderBuilder,
body: new Text("Commute"),
isExpanded: false),
new ExpansionPanel(
headerBuilder: incomeBuilder,
body: new Text("Household Income"),
isExpanded: false),
new ExpansionPanel(
headerBuilder: househeaderBuilder,
body: new Text("House Value"),
isExpanded: false)
],
expansionCallback: (int index, bool isExpanded)
{
isExpanded = !criteria.children[index].isExpanded;
},
);
# Expansion panels. The v-expansion-panel component is useful for reducing vertical space with large amounts of information. The default functionality of the component is to only display one expansion-panel body at a time; however, with the multiple property, the expansion-panel can remain open until explicitly closed.
Expanded widget in flutter comes in handy when we want a child widget or children widgets to take all the available space along the main-axis (for Row the main axis is horizontal & vertical for Column). Expanded widget can be taken as the child of Row, Column, and Flex.
This is the code I used:
class Criterias extends StatefulWidget {
CriteriaState createState() => new CriteriaState();
}
class NewItem {
bool isExpanded;
final String header;
final Widget body;
final Icon iconpic;
NewItem(this.isExpanded, this.header, this.body, this.iconpic);
}
double discretevalue = 2.0;
double hospitaldiscretevalue = 25.0;
class CriteriaState extends State<Criterias> {
List<NewItem> items = <NewItem>[
new NewItem(
false,
'Schools',
new Padding(
padding: new EdgeInsets.all(20.0),
child: new Column(
children: <Widget>[
//put the children here
])
),new Icon(Icons.add)),
//give all your items here
];
ListView List_Criteria;
Widget build(BuildContext context) {
List_Criteria = new ListView(
children: [
new Padding(
padding: new EdgeInsets.all(10.0),
child: new ExpansionPanelList(
expansionCallback: (int index, bool isExpanded) {
setState(() {
items[index].isExpanded = !items[index].isExpanded;
});
},
children: items.map((NewItem item) {
return new ExpansionPanel(
headerBuilder: (BuildContext context, bool isExpanded) {
return new ListTile(
leading: item.iconpic,
title: new Text(
item.header,
textAlign: TextAlign.left,
style: new TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.w400,
),
));
},
isExpanded: item.isExpanded,
body: item.body,
);
}).toList(),
),
)
],
);
Scaffold scaffold = new Scaffold(
appBar: new AppBar(
title: new Text("Criteria Selection"),
),
body: List_Criteria,
persistentFooterButtons: <Widget>[
new ButtonBar(children: <Widget>[
new FlatButton(
color: Colors.blue,
onPressed: null,
child: new Text(
'Apply',
textAlign: TextAlign.left,
style: new TextStyle(fontWeight: FontWeight.bold),
),
)
])
],
);
return scaffold;
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With