am trying to get this kind of half border with gradient color only top right and bottom left
CodePudding user response:
Refer below snippet
Container(
height: 200,
width: 200,
// change padding value to modify width of border
padding: EdgeInsets.all(2),
// space between content and outer border
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
),
padding: EdgeInsets.all(5),
// main content
child: Container(
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.black45),
borderRadius: BorderRadius.circular(10),
),
child: Center(
child: Text("Content"),
),
),
),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
gradient: LinearGradient(
colors: [Colors.blue, Colors.white, Colors.white, Colors.blue],
begin: Alignment.topRight,
end: Alignment.bottomLeft,
stops: [0.1, 0.2, 0.8, 0.9],
),
),
)