Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to add rounded solid shadow with border to card in flutter?

I have been trying to add a box shadow with solid color and border to a card which is inside a container but so far i am not able to get the desired result.

Desired Result

This is the widget that i am trying to re-create.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

What i am able to do till now

My implementation of the deign

I tried adding box shadow with offset but i am not getting the desired result.
So below is my implementation of the container

Container(
                        width: 120,
                        height: 40,
                        decoration:  BoxDecoration(
                          boxShadow: [

                            BoxShadow(

                              color: Colors.black.withOpacity(0.5),
                              blurRadius: 4.0,
                                offset: Offset(3.5, 3.5,),
                              blurStyle: BlurStyle.normal
                            ),
                          ],
                        ),
                        child: const Card(
                          child: Center(
                            child: Text("1-6 Months"),
                          ),
                        ),
                      ),

Any idea of how to do it or better yet the code itself would be much appreciated.

>Solution :

I think you should use a Stack widget and two Card widgets in the children field to get this result.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading