flutter怎么用ListView动态生成card
时间: 2024-05-05 07:21:34 浏览: 232
在 Flutter 中,您可以使用 ListView 和 Card 小部件来动态生成 Card。以下是一个简单的示例代码:
```dart
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
final title = 'ListView with Cards';
List<Card> _buildCards() {
List<Card> cards = List.generate(
10,
(int index) => Card(
child: Column(
children: <Widget>[
ListTile(
title: Text('Card $index'),
subtitle: Text('This is the subtitle'),
leading: Icon(Icons.album),
),
ButtonTheme.bar(
child: ButtonBar(
children: <Widget>[
FlatButton(
child: const Text('Details'),
onPressed: () {/* ...... */},
),
FlatButton(
child: const Text('Buy'),
onPressed: () {/* ...... */},
),
],
),
),
],
),
),
);
return cards;
}
final listView = ListView(
children: _buildCards(),
);
return MaterialApp(
title: title,
home: Scaffold(
appBar: AppBar(
title: Text(title),
),
body: listView,
),
);
}
}
```
在此示例中,`_buildCards()` 函数使用 `List.generate()` 函数生成 10 张卡片。每个卡片都包含一个 ListTile 和一个 ButtonBar。最后,使用 `ListView` 小部件将这些卡片显示在屏幕上。
阅读全文