can't figure out where pixels are overlflow even thought I use MediaQuery height-CodePudding

As a demo, I have taken two container inside Column and I have used MediaQuery height for both container and deducting size of appear..eventhought it is showing 24 pixel overflow...and if I wrap column with SingleChildScrollView..it scrolls which should be not scrolled as both container's height sum is 1.

here is my demo code


import 'package:flutter/material.dart';

class HomeScreen extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    final appbar=AppBar();

    return Scaffold(
        appBar: appbar,
        body: SingleChildScrollView(
          child: Column(
            children: [
              Container(
                height: (MediaQuery.of(context).size.height-appbar.preferredSize.height)*0.40 ,
                color: Colors.green,
              ),
              Container(
                height: (MediaQuery.of(context).size.height-appbar.preferredSize.height)*0.60 ,
                color: Colors.red,
              ),
            ],
          ),
        )
    );
  }
}

CodePudding user response：

Column has property 'mainAxisSize', setting that to MainAxisSize.min will solve the problem.

Column(
  mainAxisSize: MainAxisSize.min,
  children: [
    Container(
      height: (MediaQuery.of(context).size.height-appbar.preferredSize.height)*0.40 ,
      color: Colors.green,
    ),

In this case Column just stretches to infinity as ScrollView above allows it.

CodePudding user response：

I got my answer from stack overflows history ....

here what I missed to deduct status bar height

height: (MediaQuery.of(context).size.height-appbar.preferredSize.height-MediaQuery.of(context).viewPadding.top)*0.60 ,