Flutter - 卡片小工具

在Flutter中，卡片小工具可用于显示信息或操作，它们在移动应用程序中很常见。

创建卡片小工具

要创建卡片小部件，请使用Card类。以下是一个基本的例子：

Card(
  child: ListTile(
    leading: Icon(Icons.person),
    title: Text('John Doe'),
    subtitle: Text('john.doe@email.com'),
  ),
);

在上面的代码中，我们使用Card类创建了一个卡片小工具。它有一个子元素，即ListTile小部件。

ListTile小部件包含卡片的内容，其中leading属性设置卡片中图标的位置，title属性设置标题，subtitle属性设置子标题。

添加样式

卡片小工具可通过Card类的属性进行自定义样式。以下是一些常用的属性：

• color：设置卡片颜色。
• elevation：设置卡片的高度。
• shape：设置卡片形状。

以下代码示例演示如何使用这些属性：

Card(
  color: Colors.blue,
  elevation: 5.0,
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(10.0),
  ),
  child: ListTile(
    leading: Icon(Icons.person, color: Colors.white),
    title: Text('John Doe', style: TextStyle(color: Colors.white)),
    subtitle: Text('john.doe@email.com', style: TextStyle(color: Colors.white)),
  ),
);

在上面的代码中，我们使用了color属性来设置卡片的背景色，elevation属性来设置卡片的高度，shape属性来设置卡片的形状为圆角。

我们还通过在子元素中使用TextStyle类来设置了文本的颜色样式。

总结

卡片小部件是Flutter中常见的小部件之一。我们可以使用Card类来创建卡片小部件，并通过属性来自定义其样式。