A Flutter workaround for using spaced content in a scrollable Column

scrollable_column.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Demo",
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Demo Home Page"),
      ),
      body: const Center(
        child: Padding(
          padding: EdgeInsets.all(24.0),
          child: ScrollableColumn(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              TopText(),
              ImageWithCaption(),
              DummyButton(),
            ],
          ),
        ),
      ),
    );
  }
}

class TopText extends StatelessWidget {
  const TopText({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const Text(
      "Welcome to this demo. This is some useless text to fill some space. "
      "And it needs to be a bit longer, so here is another sentence.",
    );
  }
}

class ImageWithCaption extends StatelessWidget {
  const ImageWithCaption({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 8.0),
        child: Column(
          children: const [
            Icon(
              Icons.handyman,
              size: 240,
            ),
            Text("I am an image caption, and yes, this is the handyman icon."),
          ],
        ),
      ),
    );
  }
}

class DummyButton extends StatelessWidget {
  const DummyButton({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: () {
          showDialog(
            context: context,
            builder: (_) => const Dialog(
                child: Padding(
              padding: EdgeInsets.all(16.0),
              child: Text("Hello, world!"),
            )),
          );
        },
        child: const Padding(
          padding: EdgeInsets.all(8.0),
          child: Text("Pretend to do something"),
        ),
      ),
    );
  }
}

class ScrollableColumn extends StatelessWidget {
  final MainAxisAlignment mainAxisAlignment;
  final CrossAxisAlignment crossAxisAlignment;
  final List<Widget> children;
  final ScrollController? controller;
  final EdgeInsets padding;

  const ScrollableColumn({
    this.mainAxisAlignment = MainAxisAlignment.start,
    this.crossAxisAlignment = CrossAxisAlignment.start,
    required this.children,
    this.controller,
    this.padding = const EdgeInsets.all(0.0),
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, constraints) {
      return SingleChildScrollView(
        controller: controller,
        physics: const BouncingScrollPhysics(),
        child: ConstrainedBox(
          constraints: BoxConstraints(minHeight: constraints.maxHeight),
          child: Padding(
            padding: padding,
            child: Column(
              mainAxisAlignment: mainAxisAlignment,
              crossAxisAlignment: crossAxisAlignment,
              children: children,
            ),
          ),
        ),
      );
    });
  }
}