Flutter笔记17：Card组件+ButtonBar实现购物车效果

Flutter笔记17：Card组件+ButtonBar实现购物车效果

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Card组件',
        home: Scaffold(
          appBar: AppBar(
            title: Text('Card组件'),
          ),
          body: Column(children: [
            Card(
              //背景色
              color: Colors.green,
              //阴影
              elevation: 10.0,
              //外间距
              margin: EdgeInsets.all(20.0),
              //卡片边框样式
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20.0)),
              //卡片内容
              child: Column(
                mainAxisSize: MainAxisSize.max,
                children: [
                  ListTile(
                    leading: Icon(Icons.shopping_cart),
                    title: Text(
                      '苹果电脑',
                      style: TextStyle(color: Colors.white, fontSize: 30.0),
                    ),
                    subtitle: Text(
                      '16核 8G内存',
                      style: TextStyle(color: Colors.white, fontSize: 16.0),
                    ),
                    contentPadding: EdgeInsets.all(10.0),
                  ),
                  ButtonTheme.bar(
                    child: ButtonBar(
                      children: [
                        FlatButton(
                            onPressed: () {},
                            child: Text(
                              '购买',
                              style: TextStyle(
                                  color: Colors.white, fontSize: 14.0),
                            )),
                        FlatButton(
                            onPressed: () {},
                            child: Text(
                              '取消',
                              style:
                                  TextStyle(color: Colors.red, fontSize: 14.0),
                            ))
                      ],
                    ),
                  )
                ],
              ),
            ),
          ]),
        ));
  }
}

部分素材资源来源网站，本站提供免费下载，如有侵权请联系站长马上删除！