cardview in flutter layout

Question

I want the code to design a cardview in flutter with all properties: like this

This is very simple. If you read the `documentation`, you will find everything in there. — Rob, Feb 08 '20 at 06:33

score 0 · Answer 1 · answered Feb 08 '20 at 05:43

0

See

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

Then post code for what you have attempted if you still have questions.

answered Feb 08 '20 at 05:43

Ted Henry

1,442
1
14
34

score 0 · Answer 2 · answered Feb 08 '20 at 09:32

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)),
                  )),
            )
          ])),
      )

score -1 · Answer 3 · answered Feb 08 '20 at 06:55

You can modify and add relevant fields as your requirement !

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)),
              ))
        ]));

cardview in flutter layout

3 Answers3