以下是一个示例代码,演示如何按类别列出的Flutter数值列表小计:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State {
List- itemList = [
Item('Category A', 10),
Item('Category B', 20),
Item('Category A', 5),
Item('Category C', 15),
Item('Category B', 8),
];
@override
Widget build(BuildContext context) {
Map
categoryTotals = {};
// 计算每个类别的总和
for (var item in itemList) {
if (categoryTotals.containsKey(item.category)) {
categoryTotals[item.category] += item.value;
} else {
categoryTotals[item.category] = item.value;
}
}
return Scaffold(
appBar: AppBar(
title: Text('Flutter数值列表小计'),
),
body: ListView.builder(
itemCount: itemList.length,
itemBuilder: (BuildContext context, int index) {
Item item = itemList[index];
return ListTile(
title: Text(item.category),
subtitle: Text(item.value.toString()),
);
},
),
bottomNavigationBar: BottomAppBar(
child: Container(
height: 50,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: categoryTotals.length,
itemBuilder: (BuildContext context, int index) {
String category = categoryTotals.keys.elementAt(index);
int total = categoryTotals[category];
return Container(
margin: EdgeInsets.all(8),
child: Chip(
label: Text('$category: $total'),
),
);
},
),
),
),
);
}
}
class Item {
String category;
int value;
Item(this.category, this.value);
}
在这个示例中,我们使用了一个Item
类来表示每个列表项,其中包含category
和value
两个属性。在MyHomePage
的状态中,我们定义了一个itemList
,包含了一些Item
对象。
在build
方法中,我们首先创建了一个categoryTotals
的Map
,用于存储每个类别的总和。然后,我们遍历itemList
,对每个Item
对象进行累加,计算每个类别的总和。
接下来,我们使用ListView.builder
来构建列表视图,展示每个列表项的类别和数值。
最后,我们使用BottomAppBar
和ListView.builder
来展示按类别列出的小计。我们遍历categoryTotals
,创建一个Chip
来展示每个类别的总和。
这样,我们就实现了按类别列出的Flutter数值列表小计。