How to add bottom elevation to a container in Flutter?

Issue

I've already seen this and this and this but they don't answer my question. I need elevation on my Container just below it, not all around it.

Here's what I have as of now:

My goal at the end is to eliminate the shadow at the top of the days of the week.

I use the code from this answer to achieve that shadow effect on my Container but I don't want it all the way around, just on the bottom with the rounded corners and not on the top. Any help would be appreciated.

Solution

Use ClipRRect to remove shadow effects and add bottom margin to Container to overcome ClipRRect at bottom only to show shadow effect.

Example:

import "package:flutter/material.dart";

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(30.0),
          child: ClipRRect(
            borderRadius: BorderRadius.circular(5.0),
            child: Container(
              height: 100.0,
              margin: const EdgeInsets.only(bottom: 6.0), //Same as `blurRadius` i guess
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(5.0),
                color: Colors.white,
                boxShadow: [
                  BoxShadow(
                    color: Colors.grey,
                    offset: Offset(0.0, 1.0), //(x,y)
                    blurRadius: 6.0,
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

Result:

Answered By - Crazy Lazy Cat