[英]Flutter: GroupedListView not working as it should
Why are my first date and first 2 items correctly built but not the rest?为什么我的第一次约会和前 2 个项目正确构建,但其余的却没有? The first
date header
wrap my text correctly but the padding is incorrect and the rest has the correct padding but does not wrap my text.第一个
date header
正确地包裹了我的文本,但填充不正确,其余的有正确的填充但不包裹我的文本。 This is how it looks like right now .这就是它现在的样子。
GroupedListView<dynamic, String>(
shrinkWrap: true,
elements: activityList,
groupBy: (element) => element['date'].substring(0, 10),
groupSeparatorBuilder: (String groupByValue) =>
child: Container(
height: 35,
width: 125,
decoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(25),
color: themeProvider.isDarkMode
? Color(0xFF64B6F7)
: Color(0xFFFFCC00),
),
child: Center(child: Text(...))
),
itemComparator: (item1, item2) =>
item1['date'].compareTo(item2['date']),
itemBuilder: (context, element) {
return Card(
elevation: 5,
margin: EdgeInsets.symmetric(vertical: 15),
child: ListTile(
//listtile
),
);},
useStickyGroupSeparators: true,
floatingHeader: true,
)
The problem is caused by useStickyGroupSeparators
but I would want to use that.问题是由
useStickyGroupSeparators
引起的,但我想使用它。
Based on your code, I tried to reproduce the effect.根据您的代码,我尝试重现该效果。 Is this what you want to achieve?
这是你想要达到的目标吗?
The code:编码:
class TestPage extends StatelessWidget {
const TestPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: GroupedListView<dynamic, String>(
shrinkWrap: true,
elements: items,
groupBy: (element) => element['date'].substring(0, 10),
groupSeparatorBuilder: (String groupByValue) => Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
height: 35,
width: 125,
decoration: BoxDecoration(
shape: BoxShape.rectangle,
borderRadius: BorderRadius.circular(25),
color: const Color(0xFFFFCC00),
),
child: Center(child: Text(groupByValue))),
],
),
itemComparator: (item1, item2) =>
item1['date'].compareTo(item2['date']),
itemBuilder: (context, element) {
return Card(
elevation: 5,
margin: const EdgeInsets.symmetric(vertical: 15),
child: ListTile(
title: Text(element['activity']),
),
);
},
useStickyGroupSeparators: true,
floatingHeader: true,
),
),
);
}
}
Mock data:模拟数据:
final items = [
{"date": "2022-07-08", "activity": "Activity 1"},
{"date": "2022-07-08", "activity": "Activity 2"},
{"date": "2022-07-09", "activity": "Activity 3"},
{"date": "2022-07-09", "activity": "Activity 4"},
{"date": "2022-07-10", "activity": "Activity 5"},
{"date": "2022-07-11", "activity": "Activity 6"},
{"date": "2022-07-11", "activity": "Activity 7"},
{"date": "2022-07-11", "activity": "Activity 8"},
{"date": "2022-07-11", "activity": "Activity 10"},
{"date": "2022-07-11", "activity": "Activity 11"},
{"date": "2022-07-11", "activity": "Activity 12"},
{"date": "2022-07-11", "activity": "Activity 13"},
{"date": "2022-07-11", "activity": "Activity 14"},
{"date": "2022-07-11", "activity": "Activity 15"},
{"date": "2022-07-12", "activity": "Activity 9"},
];
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.