How to add border radius to a container in flutter?

Question

I'm trying to add border radius to my container but can't get it to work for me.

Container(
   color: ColorPallete.secondColor[50],
   height: 400.0,
   width: 500.0,
   padding: const EdgeInsets.all(10.0),
   decoration: BoxDecoration(
   borderRadius: BorderRadius.circular(10.0),
   ),
   child: SvgPicture.asset(
     'assets/images/svg/megacategory/art__grocery.svg',
   ),
),

Answer 1

the error that you are receiving is that whenever you have a decoration for a container you need to make sure that color parameter is in the decoration instead of just the container. Below I have changed your code to not produce that error message, if you are still having issues getting the border radius to work after this change let me know!

Container(
   height: 400.0,
   width: 500.0,
   padding: const EdgeInsets.all(10.0),
   decoration: BoxDecoration(
       borderRadius: BorderRadius.circular(10.0),
       color: ColorPallete.secondColor[50],
   ),
   child: SvgPicture.asset(
     'assets/images/svg/megacategory/art__grocery.svg',
   ),
),

Answer 2

If you have decoration property in the container, you are supposed to pass the color within the decoration and not the container directly.

Container(
//Not allowed color: ColorPallete.secondColor[50],
height: 400.0,
width: 500.0,
padding: const EdgeInsets.all(10.0),
decoration: BoxDecoration(
color: ColorPallete.secondColor[50], //place it here
borderRadius: BorderRadius.circular(10.0),
),
child: SvgPicture.asset(
 'assets/images/svg/megacategory/art__grocery.svg',
),
),