我正在从 Firebase 实时数据库中获取标题和描述(在一段中)到扩展面板列表中的 Flutter 扩展面板。
我已经使用可扩展功能成功获取了标题和描述。
但是,我正面临isExpanded扩展面板属性的问题。
每当我设置isExpanded: true时,点击 Oncapheader,所有扩展面板都会被扩展。我想实现,当一个扩展面板展开时,其他面板应该关闭。
下面是我的代码片段:
class Infos extends StatefulWidget {
@override
_FaqsState createState() => _FaqsState();
}
class _InfosState extends State<Faqs> {
Query _ref;
DatabaseReference reference =
FirebaseDatabase.instance.reference().child('infos');
@override
void initState() {
super.initState();
_ref = FirebaseDatabase.instance
.reference()
.child('infos')
.orderByChild('description');
listExpans.add(false);
}
Widget _buildInfosItem({Map infos}) {
return Container(
color: Color.fromRGBO(238, 238, 238, 1),
alignment: Alignment.center,
child: Column(children: <Widget>[
Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 0, 20),
child: ExpansionPanelList(
expandedHeaderPadding: EdgeInsets.all(0),
elevation: 0,
children: <ExpansionPanel>[
ExpansionPanel(
backgroundColor: Color.fromRGBO(238, 238, 238, 1),
headerBuilder: (context, isExpanded) {
return Padding(
padding: const EdgeInsets.only(top: 10),
child: ListTile(
title: Text(
infos['title'],
style: TextStyle(
fontSize: 18,
letterSpacing: 0.32,
fontWeight: FontWeight.bold,
color: Color.fromRGBO(0, 0, 0, 1)),
),
));
},
body: Padding(
padding: EdgeInsets.only(
top: 0, bottom: 10, left: 14, right: 14),
child: Text(infos['description'],
style: TextStyle(
fontSize: 16,
color: Color.fromRGBO(51, 51, 51, 1))),
),
isExpanded: true,
canTapOnHeader: true,
),
],
expansionCallback: (panelIndex, isExpanded) {
setState(() {
listExpans[panelIndex] = !isExpanded;
});
},
animationDuration: kThemeAnimationDuration,
),
)
]));
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color.fromRGBO(238, 238, 238, 1),
appBar: AppBar(
automaticallyImplyLeading: false,
backgroundColor: Color.fromRGBO(34, 34, 34, 1),
title: Text(
'Information',
style: TextStyle(
fontSize: 20,
color: Color.fromRGBO(255, 255, 255, 1),
fontWeight: FontWeight.bold,
),
),
leading: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => End(),
));
},
child: SizedBox(
width: 7.4,
height: 12,
child: Icon(Icons.chevron_left,
color: Color.fromRGBO(255, 255, 255, 1))),
),
leadingWidth: 40,
),
body: Container(
height: double.infinity,
child: FirebaseAnimatedList(
query: _ref,
itemBuilder: (BuildContext context, DataSnapshot snapshot,
Animation<double> animation, int index) {
Map faqs = snapshot.value;
faqs['key'] = snapshot.key;
return _buildInfosItem(infos: infos);
},
),
),
);
}
}