SingleChildScrollView overflows instead of scrolls-CodePudding

Why does this SingleChildScrollView overflow instead of scroll when the screen height is resized too small? I've used this design because the bottom widget needs to be pushed to the bottom.

return NavigationListener(builder: (context, child) {
  return SingleChildScrollView(
      child: SizedBox(
    height: MediaQuery.of(context).size.height,
    width: maxSideMenuWidth,
    child: Column(
      children: [
        Container(
            height: 155, color: Colors.purple, child: const MenuHeader()),
        Container(
            color: Colors.red,
            height: 327,
            child: MainMenu(
              primaryDestinations: primaryDestinations,
              secondaryDestinations: secondaryDestinations,
              onNavigate: onNavigate,
              isSelected: isSelected,
            )),
        Spacer(),
        Container(
            color: Colors.green,
            height: 135,
            child: LoginContextWidget(user, userDetails, logOut)),
      ],
    ),
  ));
});

CodePudding user response：

Try This code

return NavigationListener(builder: (context, child) {
  return SizedBox(
    height: MediaQuery.of(context).size.height,
    width: maxSideMenuWidth,
    child: SingleChildScrollView(
      child: Column(
      children: [
        Container(
            height: 155, color: Colors.purple, child: const MenuHeader()),
        Container(
            color: Colors.red,
            height: 327,
            child: MainMenu(
              primaryDestinations: primaryDestinations,
              secondaryDestinations: secondaryDestinations,
              onNavigate: onNavigate,
              isSelected: isSelected,
            )),
        Spacer(),
        Container(
            color: Colors.green,
            height: 135,
            child: LoginContextWidget(user, userDetails, logOut)),
      ],
    ),
    ),
  );
});

CodePudding user response：

wrap singlechildscrollview in expanded

return NavigationListener(builder: (context, child) {
 return Expanded(
   child:SingleChildScrollView(
   child: SizedBox(
   height: MediaQuery.of(context).size.height,
   width: maxSideMenuWidth,

child: Column(
  children: [
    Container(
        height: 155, color: Colors.purple, child: const MenuHeader()),
    Container(
        color: Colors.red,
        height: 327,
        child: MainMenu(
          primaryDestinations: primaryDestinations,
          secondaryDestinations: secondaryDestinations,
          onNavigate: onNavigate,
          isSelected: isSelected,
        )),
    Spacer(),
    Container(
        color: Colors.green,
        height: 135,
        child: LoginContextWidget(user, userDetails, logOut)),
      ],
    ),
  ));
  };
});