Grid View elements are getting cropped on home Screen?

Question

I have a scrollable grid view on my home screen which consists of a few containers. This grid View is however getting cropped because of the height of the container it is wrapped in. The Container is a part of a Column which is a part of a Stack.

Answer 1

Use Expanded

Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: <Widget>[
      SizedBox(height: 20),
      Text(
        "Hello,",
        style: TextStyle(
            fontFamily: "Netflix",
            fontWeight: FontWeight.w600,
            fontSize: 32,
            letterSpacing: 0.27,
            color: Color(0xFFFF8C3B).withOpacity(0.7),
        ),
      ),
      SizedBox(height: 4),
      name(context),
      SizedBox(height: 40),
      Text(
        "Home",
        style: TextStyle(
          fontFamily: "Netflix",
          fontWeight: FontWeight.w600,
          fontSize: 35,
          letterSpacing: 0.27,
          color: Color(0xFFFF8C3B),
        ),
      ),
      SizedBox(height: 15),
      Expanded( //TODO: Use Expanded here
        child: GridView.builder(
          itemCount: homeList.length,
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2, mainAxisSpacing: 20,
          ),
          itemBuilder: (ctx, i) {
            return GestureDetector(
              onTap: () {
                if (i == 0) {
                  _interstitialAd.show();
                } else if (i == 1) {
                  FlutterPollfish.instance.show();
                } else if (i == 2) {
                  sendInvite();
                }