颤振布局中的cardview

Question

我希望代码设计出具有所有属性的卡片视图：

Answer 1

请参见

https://api.flutter.dev/flutter/material/Card-class.html

https://api.flutter.dev/flutter/widgets/Row-class.html

https://api.flutter.dev/flutter/material/CircleAvatar-class.html

如果您还有疑问，请输入您尝试的邮政编码。

Answer 2

Padding(
        padding: EdgeInsets.all(20),
              child: Card(
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
          elevation: 5,
          color: Colors.white,
          child: Row(children: [

            Padding(
              padding: EdgeInsets.all(10),
                          child: Card(
                  shape: CircleBorder(),
                  elevation: 10,
                  color: Colors.white,
                  child: Icon(Icons.account_circle, color: Colors.black, size: 100)),
            ),

            Padding(
              padding: EdgeInsets.all(10),
                          child: Card(
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(20)),
                      elevation: 10,
                  color: Colors.green[400],
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Text('@anonymous',
                        style: TextStyle(
                            color: Colors.black, fontWeight: FontWeight.bold)),
                  )),
            )
          ])),
      )

Answer 3

您可以根据需要修改和添加相关字段！

return Card(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
        color: Colors.white,
        child: Row(children: [
          SizedBox(
            width: 30,
          ),
          Card(
              shape: CircleBorder(),
              color: Colors.white,
              child: Icon(Icons.account_circle, color: Colors.black, size: 50)),
          SizedBox(
            width: 30,
          ),
          Card(
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10)),
              color: Colors.green[800],
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text('@anonymous',
                    style: TextStyle(
                        color: Colors.black, fontWeight: FontWeight.bold)),
              ))
        ]));