526互联

14、Flutter Card组件

发布时间 2023-11-20 11:22:47作者: 鲤斌
Card是卡片组件块，内容可以由大多数类型的Widget构成，Card具有圆角和阴影，这让它看起来有立
体感。

Card实现一个通讯录的卡片

class MyApp2 extends StatelessWidget {
  const MyApp2({super.key});

  @override
  Widget build(BuildContext context) {
    return ListView(
      children:  const [
      Card(
        shadowColor: Colors.red,
        margin: EdgeInsets.all(10),
        elevation: 10, //阴影深度
        clipBehavior: Clip.none,  //内容溢出的剪切方式
        shape: RoundedRectangleBorder( //Card的阴影效果
                borderRadius: BorderRadius.all(Radius.circular(15))
                ),
        child: Column(
          //  Text("你好卡片"),
          children: [
            ListTile(
              title: Text("张三"),
              subtitle: Text("法外狂徒"),
            ),
            Divider(),
            ListTile(
              title: Text("电话：55555555555")
            ),            
          ],
        )
      )
      ],
    );
  }
}