I have a drawer that have a listview that have a nested expansion tiles as its children.
1- I want to close all open expanded tiles exepet the one that just opened.(No more the 1 expanded tile that is open) What is the best way to do this?
2- i also want to keep the open one stay open when i close and reopen the drawer (I acheved this by using key:PageStorageKey but if there is a better way i would like to hear it).
I solved the problem by using this custom ExpansionTile widget from https://stackoverflow.com/a/58221096/19329222
It have errors (I think because the answer is 3 years old) but you can get rid of them by replacing the incorrect syntax with the correct one from the original ExpansionTile widget file.
This just work, but go through solution and adopt solution with your project design pattern and adopt it with your state management(Provider)
import 'package:flutter/material.dart';
import 'dart:math';
void main() {
runApp(new ExpansionTileSample());
}
class ExpansionTileSample extends StatefulWidget {
@override
ExpansionTileSampleState createState() => new ExpansionTileSampleState();
}
class ExpansionTileSampleState extends State {
String foos = 'One';
int _key;
_collapse() {
int newKey;
do {
_key = new Random().nextInt(10000);
} while(newKey == _key);
}
@override
void initState() {
super.initState();
_collapse();
}
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
appBar: new AppBar(
title: const Text('ExpansionTile'),
),
body: new ExpansionTile(
key: new Key(_key.toString()),
initiallyExpanded: false,
title: new Text(this.foos),
backgroundColor: Colors.gray,
children: [
new ListTile(
title: const Text('One'),
onTap: () {
setState(() {
this.foos = 'One';
_collapse();
});
},
),
new ListTile(
title: const Text('Two'),
onTap: () {
setState(() {
this.foos = 'Two';
_collapse();
});
},
),
new ListTile(
title: const Text('Three'),
onTap: () {
setState(() {
this.foos = 'Three';
_collapse();
});
},
),
]
),
),
);
}
}
