[flutter] aligned and positioned stack

gistfile1.txt

import 'package:flutter/material.dart';

final Color darkBlue = Color.fromARGB(255, 18, 32, 47);

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(children: [
      DefaultStack(),
      AlignedStack(),
      AlignedStack2(),
      PositionedStack()
    ]);
  }
}

class BigBox extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(width: 100.0, height: 100.0, color: Colors.red);
  }
}

class MiddleBox extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(width: 75.0, height: 75.0, color: Colors.green);
  }
}

class SmallBox extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(width: 50.0, height: 50.0, color: Colors.blue);
  }
}

class DefaultStack extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        width: 200,
        height: 200,
        color: Colors.grey,
        child: Stack(children: [
          BigBox(),
          MiddleBox(),
          SmallBox(),
        ]));
  }
}

class AlignedStack extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        width: 200,
        height: 200,
        color: Colors.grey,
        child: Stack(alignment: Alignment.center, children: [
          BigBox(),
          MiddleBox(),
          SmallBox(),
        ]));
  }
}

class AlignedStack2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        width: 200,
        height: 200,
        color: Colors.grey,
        child: Stack(children: [
          Align(alignment: Alignment.topCenter, child: BigBox()),
          Align(alignment: Alignment.bottomLeft, child: MiddleBox()),
          Align(alignment: Alignment.bottomRight, child: SmallBox()),
        ]));
  }
}

class PositionedStack extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        width: 200,
        height: 200,
        color: Colors.grey,
        child: Stack(children: [
          Positioned(left: 50, child: BigBox()),
          Positioned(left: 50, child: MiddleBox()),
          Positioned(left: 50, child: SmallBox()),
        ]));
  }
}