Search code examples
fluttershadowflutter-container

flutter only bottom shadow to container

i have tried many solution but i couldn't get what i want.

https://stackoverflow.com/a/56744034/4862911 i applied in this answer but couldn't get correct response. There is still shadow top of container. How can i achieve it?

and also i have tried to surround my widget with Material . but still can't solve the problem.

 Material(
        elevation: 5,
        child: Container(
          height: 50,
          child: _buildEloAndLevel(),

        ),
      ),
Solution

  • I don't know if other examples are really setting a shadow for only bottom, but here is a know solution:

    Container(
          height: 50.0,
          decoration: BoxDecoration(
              boxShadow: <BoxShadow>[
                BoxShadow(
                  color: Colors.black54,
                  blurRadius: 20.0,
                  spreadRadius: -20.0,
                  offset: Offset(0.0, 25.0),
                )
              ],
            color: Colors.red,
          ),
        ),

    Set the blur of the shadow with blurRadius and then set the spreadRadius to negative the blurRadius then use the dy property of the Offset() constructor, you set it to positive values to control the shadow bottom.