【Flutter/Dart】表示位置について

MainAxisAlignment・CrossAxisAlignment・MainAxisSizeをいろいろ変えたときの表示の違いを確認した時のメモです。

参照したページ
github.com

import 'package:flutter/material.dart';

void main() {
  // カラム
  const col1 = Column(
    // mainAxisAlignment: MainAxisAlignment.center,
    // crossAxisAlignment: CrossAxisAlignment.start,
    mainAxisSize: MainAxisSize.min,
    children: [
      Text('レモン'),
      Text('グレープフルーツ'),
      Text('ブドウ'),
    ],
  );

  const col2 = Column(
    // mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.end,
    // mainAxisSize: MainAxisSize.min,
    children: [
      Text('マンゴー'),
      Text('ナシ'),
    ],
  );

  // ロー
  const row = Row(
    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
    crossAxisAlignment: CrossAxisAlignment.end,
    children: [col1, col2, col1],
  );

  // アプリ
  const app = MaterialApp(
    home: Scaffold(
      body: Center(
        child: row,
      ),
    ),
  );

  runApp(app);
}