Flutter Card组件

Flutter Card组件_第1张图片

// Card组件
class CardDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Card(
        color: Colors.red,
        // 卡片的z坐标 阴影的大小
        elevation: 20.0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0)
        ),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            ListTile(
              leading: Icon(Icons.camera,),
              title: Text('这是一台苹果电脑', style: TextStyle(fontSize: 20),),
              subtitle: Text('配置为16G', style: TextStyle(fontSize: 15),),
            ),
            // 靠右边显示的按钮
            ButtonBar(
              children: [
                FlatButton(
                  child: Text('购买'),
                  onPressed: () {},
                ),
                FlatButton(
                  child: Text('取消'),
                  onPressed: () {},
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}

你可能感兴趣的:(flutter)