K-Learn

Flutter Card Widget

Posted on Thursday, 02 March 2023 06:18 PM

The Card widget is used to create a material design card. It's a versatile widget that can be used to display a wide variety of content, such as images, text, and buttons. You can customise the appearance and behaviour of the Card widget by using various properties.

Here's an example of how to use the Card widget:

@override
  Widget build(BuildContext context) {
    return Center(
      child: Card(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const ListTile(
              leading: Icon(Icons.album),
              title: Text('The Enchanted Nightingale'),
              subtitle: Text('Music by Julie Gable. Lyrics by Sidney Stein.'),
            ),
          ],
        ),
      ),
    );
  }

Some common properties of the Card widget:

child: The widget that will be displayed inside the card.

color: The background color of the card.

elevation: The elevation of the card (i.e. how much it should appear to float above the surface).

shape: The shape of the card (e.g. RoundedRectangleBorder, CircleBorder).

margin: The amount of space to leave around the outside of the card.