Stack Widget Not Scrolling in SCSV, Flutter

Question

I'm using a Stack to Positioned one widget on top of an Image.asset widget, but the problem I have is that my whole Stack widget is not scrollable to see the whole content. I wrapped the Stack widget with a SingleChildScrollView but the problem still persists. If I wrap the Stack widget with a Containter and give the height: MediaQuery.of(context).size.height, it's scrollable but I can't still see the whole content of the page. Where is my mistake, that's what I'm wondering? With what widget should I wrap Stack or is there a better way for my problem? In short, I'm stacking a Column on top of an Image and I need the whole Stack widget to be scrollable so I can see the whole content of the Stack widget. Here is the code:

Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey,
      body: SafeArea(
        child: SingleChildScrollView(
          child: Stack(
            overflow: Overflow.visible,
            children: [
              Image.asset(
                'lib/modules/common/images/logo.png',
                width: double.infinity,
                height: 196.0,
              ),
              Positioned(
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height,
                top: 136.0,
                child: Column(
                  children: [
                    Container(), // some content inside the container
                    Container(), // // some content inside the container
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

Thanks in advance for the help!

Answer 1

if you mean to have a image on back and scrollable content at fron check this answer, if not let me know and share a prototype/image that you want.

  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey,
      body: SafeArea(
        child: SingleChildScrollView(
          child: SizedBox(
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height * 3,
            child: Stack(
              fit: StackFit.loose,
              children: [
                Align(
                  alignment: Alignment.topCenter,
                  child: Image.asset(
                    'assets/image.jpg',
                    width: double.infinity,
                    height: 196.0,
                  ),
                ),
                Positioned(
                  top: 136.0,
                  child: SizedBox(
                    width: MediaQuery.of(context).size.width,
                    height: MediaQuery.of(context).size.height,
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: List.generate(
                        2,
                        (index) => Container(
                          height: 100,
                          width: double.infinity,
                          color: index % 2 == 0
                              ? Colors.amberAccent
                              : Colors.cyanAccent,
                        ), // some content inside the container
                        // some content inside the container
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }