Card

Card는 카드 처럼 보이도록 만든 위젯입니다.

아래 그림 처럼 보이려면

ListTile과 ButtonBar와 같이 사용해야합니다.

초록색이 ListTile 영역이고, 노란색이 ButtonBar 영역입니다.

[전체소스]

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

  // This widget is the root of your application.

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      title: 'Flutter Demo',

      theme: ThemeData(

        primarySwatch: Colors.blue,

      ),

      home: MyHomePage(title: 'Flutter Demo Home Page'),

    );

  }

}

class MyHomePage extends StatelessWidget {

  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      appBar: AppBar(

        title: Text(title),

      ),

      body: Center(

        child: Card(

          color: Colors.red,

          child: Column(

            mainAxisSize: MainAxisSize.min,

            children: <Widget>[

              Container(

                color: Colors.green,

                child: const ListTile(

                  leading: Icon(Icons.album),

                  title: Text("The enhanced.."),

                  subtitle: Text("Music by Julie Gable."),

                ),

              ),

              Container(

                color: Colors.yellow,

                child: ButtonBar(

                  children: <Widget>[

                    FlatButton(

                      child: const Text("BUY TICKETS"),

                      onPressed: () {},

                    ),

                    FlatButton(

                      child: const Text("LISTEN"),

                      onPressed: () {},

                    )

                  ],

                ),

              ),

            ],

          ),

        ),

      ), // This trailing comma makes auto-formatting nicer for build methods.

    );

  }

}