Flutter how to make a lower border round with invisible other parties
-
Design needs to round down the bottom of the hat with invisible other parties.
As you can see from the image, the bottom of the hat is a thin round line. The problem I've encountered is if I ask the container to borderRadius and try to hide any of the parties to the border, there's a mistake,
boxDecoration
Only if all sides can round the lineborder'а
one colour, one thickness and one thicknessstyle solid
return Container( width: size.width, height: size.height * 0.3, decoration: BoxDecoration( color: theme.backgroundColor, border: Border( bottom: BorderSide(color: theme.primaryColor, width: 2), ), borderRadius: BorderRadius.only( bottomLeft: Radius.circular(25), bottomRight: Radius.circular(25), ), ), child: Center( child: Image.asset('assets/screens/a/images/header.png', fit: BoxFit.fill), ), );
Text of error:
======== Exception caught by rendering library ===================================================== The following assertion was thrown during paint(): A borderRadius can only be given for a uniform Border.
The following is not uniform:
BorderSide.color
BorderSide.width
BorderSide.style
Googled the subject, recommended the crutches from the extra view, but there was no normal answer.
-
I made the following decision. For
border
The container has a shadow.return Container( width: size.width, height: size.height * 0.3, decoration: BoxDecoration( color: theme.backgroundColor, boxShadow: <BoxShadow>[ new BoxShadow( color: theme.primaryColor, offset: Offset(0, 1), ), ], borderRadius: BorderRadius.circular(30), ), child: Center( child: Image.asset('assets/screens/a/images/header.png', fit: BoxFit.fill), ), );
The result was satisfactory.