flutter card使用

最新推荐文章于 2025-10-16 14:44:55 发布

原创最新推荐文章于 2025-10-16 14:44:55 发布 · 1.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#card #flutter #组件

本文深入探讨了Flutter中Card组件的使用方法，包括如何设置阴影、圆角，以及如何嵌套其他Widget来丰富卡片内容，如标题、子标题、列表项等。

//关键代码

new Card(
elevation: 15.0, //设置阴影
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(14.0))), //设置圆角
child: new Column( // card只能有一个widget，但这个widget内容可以包含其他的widget
children: [
new ListTile(
title: new Text('标题',
style: new TextStyle(fontWeight: FontWeight.w500)),
subtitle: new Text('子标题'),
leading: new Icon(
Icons.restaurant_menu,
color: Colors.blue[500],
),
),
new Divider(),
new ListTile(
title: new Text('内容一',
style: new TextStyle(fontWeight: FontWeight.w500)),
leading: new Icon(
Icons.contact_phone,
color: Colors.blue[500],
),
),
new ListTile(
title: new Text('内容二'),
leading: new Icon(
Icons.contact_mail,
color: Colors.blue[500],
),
),
],
),
),