Flutter ContinuousRectangleBorder Tutorial
View more Tutorials:
ContinuousRectangleBorder creates a rectangular border with smooth continuous transitions between the straight sides and the rounded corners.

- TODO Link!
- TODO Link!
ContinuousRectangleBorder constructor
const ContinuousRectangleBorder( {BorderSide side: BorderSide.none, BorderRadiusGeometry borderRadius: BorderRadius.zero} )

Basically, ContinuousRectangleBorder's usage is the same as RoundedRectangleBorder. They all create a rectangular border with rounded corners. However, the rounded corners created by ContinuousRectangleBorder are smoother.
For example: Use ContinuousRectangleBorder for a Container:

(ex1)
Container( width: 300, height: 150, decoration: ShapeDecoration( color: Colors.white, shape: ContinuousRectangleBorder ( borderRadius: BorderRadius.circular(32.0), side: BorderSide( width: 10, color: Colors.blue ) ) ), child: Center( child: Text( "Flutter", style: TextStyle(fontSize: 50) ) ), )
Use addition operator (+) to add 2 ShapeBorder in order to create an associative border:

(ex2)
Container( width: 300, height: 150, decoration: ShapeDecoration( color: Colors.white, shape: ContinuousRectangleBorder ( borderRadius: BorderRadius.circular(16.0), side: BorderSide( width: 10, color: Colors.blue ) ) + ContinuousRectangleBorder ( borderRadius: BorderRadius.circular(32.0), side: BorderSide( width: 20, color: Colors.green ) ) ), child: Center( child: Text( "Flutter", style: TextStyle(fontSize: 50) ) ), )
side - Provides parameters related to border such as color, width, style.
BorderSide side: BorderSide.none
BorderSide constructor
const BorderSide ( {Color color: const Color(0xFF000000), double width: 1.0, BorderStyle style: BorderStyle.solid} )
- TODO Link!
Note: ContinuousRectangleBorder.side property does not work with ElevatedButton, TextButton and OutlinedButton. It is overridden by ButtonStyle.side.
borderRadius - Provides 4 corner radius value of the rectangle.
BorderRadiusGeometry borderRadius: BorderRadius.zero
- TODO Link!

Container( width: 300, height: 150, decoration: ShapeDecoration( color: Colors.white, shape: ContinuousRectangleBorder ( borderRadius: BorderRadius.only( bottomLeft: Radius.zero, topLeft: Radius.zero, bottomRight: Radius.circular(20), topRight: Radius.circular(45) ), side: BorderSide( width: 10, color: Colors.blue ) ) ), child: Center( child: Text( "Flutter", style: TextStyle(fontSize: 50) ) ), )