This gist explains how can we stack items like image and decorated container on top at bottom center.

stack_example

import 'package:flutter/material.dart';

const 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: const Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}


class MyWidget extends StatefulWidget {
  const MyWidget({Key? key}) : super(key: key);

  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  Size get displayMetrics => MediaQuery.of(context).size;

  @override
  Widget build(BuildContext context) {
    return Stack(alignment: Alignment.bottomCenter, children: [
      Container(
        width: displayMetrics.width,
        height: displayMetrics.height,
        color: Colors.blue,
        child: Center(
          child: Text(
            'Image goes here',
            style: Theme.of(context).textTheme.headline4,
          ),
        ),
      ), // Add image.asset here to load image
      Container(
        width: displayMetrics.width,
        height: displayMetrics.height * 0.4,
        decoration: const BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(32), topRight: Radius.circular(32))),
        child: Center(
          child: Text(
            'Bottom widgets goes here',
            style: Theme.of(context).textTheme.headline4?.copyWith(color: Colors.black),
          ),
        ),
      )
    ]);
  }
}