flutter problem: My FAQs ui is not what I want - flutter

Question

I have this problem that I want to make my FAQs UI like Original UI but i cant making like that.
I have this problem that I want to make my FAQs UI like Original UI but i cant making like that.
I want like this UI.
But its creating like this.
My UI is not matching please help me How to make it like original.
This is my code.
import 'package:cwc/constants/constants.dart';
import 'package:flutter/material.dart';
import '../skeleton.dart';
class FAQPage extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return FAQPageState();
}
}
class FAQPageState extends State<FAQPage> {
bool isExpand = false;
var selected;
#override
void initState() {
// TODO: implement initState
super.initState();
isExpand = false;
}
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xffffffff),
appBar: AppBar(
elevation: 0.5,
leading: InkWell(
onTap: () {
Navigator.pop(context);
},
child: Icon(
Icons.arrow_back,
color: Colors.black,
size: tSize24,
)),
centerTitle: true,
backgroundColor: Colors.white,
),
body: isFAQLoading == true
? ButtonSkeleton()
: ListView.builder(
itemCount: faqListData.length,
itemBuilder: (context, index) {
return Column(children: <Widget>[
Container(
decoration: BoxDecoration(boxShadow: [
BoxShadow(
color: Colors.grey.shade200,
offset: Offset(1.0, 1.0),
spreadRadius: 0.2)
]),
child: Card(
elevation: 0,
shadowColor: Colors.grey,
margin: EdgeInsets.only(
bottom: 3,
),
child: ExpansionTile(
key: Key(index.toString()),
backgroundColor: Color(0xfff6f7f9),
initiallyExpanded: index == selected,
iconColor: Colors.grey,
title: Text(
'${faqListData[index]['question']}',
style: TextStyle(
color: Color(0xFF444444),
fontSize: tSize14,
fontWeight: FontWeight.w500),
),
children: <Widget>[
Padding(
padding: EdgeInsets.only(
top: 10.0, bottom: 10, left: 17, right: 17),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
child: Text(
"${faqListData[index]['answer']}",
style: TextStyle(
color: Color(0xFF444444),
fontSize: 13,
),
textAlign: TextAlign.start,
),
),
],
))
],
onExpansionChanged: ((newState) {
isExpand = newState;
print(newState);
if (newState)
setState(() {
Duration(seconds: 20000);
selected = index;
// isExpand=newState;
});
else
setState(() {
selected = -1;
// isExpand=newState;
});
print(selected);
})),
),
),
]);
}),
);
}
}

Answer 1

Hi I checked your code and looks just small thing is missing. When you are passing key to the Exapnsion tile you need to pass same key to ListView.builder then it works fine.
ListView.builder(
key: Key('builder ${selected.toString()}'),
itemCount: faqListData.length,
...
...
);