我有一个带有标题String
和正文Widget
的ExpansionList.radio
。Widget
是一个listView.separated
,具有四个不同的项目。
现在,我希望ExpansionList.radio
的主体显示ListView.separated
中的四个不同项。
但它只显示第一项。
像这样:
如何显示四个不同的项目?
这是我的代码:
List<MyItems> _getMyItems(int index) {
return [
MyItems(
title: "First Plans",
body: MyOwnListView(
itemCount: _firstCodeTitles.length,
myCodeTitle: _firstCodeTitles[index],
),
),
MyItems(
title: "Second Plans",
body: MyOwnListView(
itemCount: _secondCodeTitles.length,
myCodeTitle: _secondCodeTitles[index],
),
),
];
}
final _firstCodeTitles = [
"Open Account",
"Activate USSD",
"Deactivate USSD",
"Activate Payment",
];
final _secondCodeTitles = [
"Customer Care 1",
"Customer Care 2",
"Customer Care 3",
"Customer Care 4",
];
class MyMainScreen extends StatefulWidget {
const MyMainScreen({
super.key,
});
@override
State<MyMainScreen> createState() => _MyMainScreenState();
}
class _MyMainScreenState extends State<MyMainScreen> {
int index = 0;
@override
Widget build(BuildContext context) {
final List<MyItems> items = _getMyItems(index);
return Scaffold(
appBar: AppBar(),
body: ListView(
children: [
Column(
children: [
ExpansionPanelList.radio(
elevation: 6,
expandedHeaderPadding: const EdgeInsets.all(8.0),
dividerColor: Colors.teal,
children: items.map<ExpansionPanelRadio>((MyItems myItems) {
return ExpansionPanelRadio(
value: myItems.title,
canTapOnHeader: true,
backgroundColor: const Color(0xffeeeeff),
headerBuilder: (context, isExpanded) {
return ListTile(
title: Text(myItems.title),
);
},
body: SizedBox(
height: MediaQuery.of(context).size.width,
child: myItems.body,
),
);
}).toList(),
),
],
),
],
),
);
}
}
class MyItems {
MyItems({
required this.title,
required this.body,
this.isExpanded = false,
});
String title;
Widget body;
bool isExpanded;
}
class MyOwnListView extends StatelessWidget {
const MyOwnListView({
super.key,
required this.itemCount,
required this.myCodeTitle,
});
final int itemCount;
final String myCodeTitle;
@override
Widget build(BuildContext context) {
return ListView.separated(
itemCount: itemCount,
itemBuilder: (context, index) {
return Card(
child: ListTile(
title: Text(myCodeTitle),
),
);
},
separatorBuilder: (context, index) => const Divider(),
);
}
}
1条答案
按热度按时间wz3gfoph1#
您需要将整个列表传递给
MyOwnListView
,构建器将遍历该列表。