【Flutter】Cardの高さ・横幅を調整する

2022年12月26日

こんにちは、フラメルです。

今回はCardの高さまたは横幅を変更する方法を紹介します。

Cardの高さ・横幅を調整する方法

SizedBoxでCardをラップします。高さ・横幅をそれぞれheight・widthで指定できます。

SizedBox(
  width: 300,
  height: 250,
  child: Card(
    color: Colors.blue,
    elevation: 10,
  ),
),

サンプルコード

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter'),
        ),
        body: Center(
          child: SizedBox(
            width: 300,
            height: 250,
            child: Card(
              color: Colors.blue,
              elevation: 10,
            ),
          ),
        ),
      ),
    );
  }
}

以上です。