【Flutter】画面レイアウト：Container使い方を3分で解説!（サンプルコードあり）

import 'package:flutter/material.dart';

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

class ContainerDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Containerデモ')),
        body: Center(
          child: Container(
            child: Center(
              child: Text('child:contents',
                style: TextStyle(
                fontSize: 40,
                    fontWeight: FontWeight.bold,
                    color: Colors.white,
                    backgroundColor: Colors.blueAccent
                ),
              ),
            ),
            margin: const EdgeInsets.all(10.0),//外枠の余白
            width: 500.0,
            height: 200.0,
            padding: EdgeInsets.all(50.0),//内側の余白
            decoration: BoxDecoration(
              // 外枠線
              border: Border.all(
                color: Colors.blue.shade50,
                width: 20,
              ),
              borderRadius: BorderRadius.circular(10),
              color: Colors.blue.shade100,
            ),
          ),
        ),
      ),
    );
  }
}