Flutter:卡片上带有边框半径的单边框
Flutter : single border with border radius on Card
问题:无法设置 border-radius 以及 single border (右边框) 在卡片小部件上。
到目前为止我有:
//for single border
return Card(
shape: const Border(
right: BorderSide(color: Color.fromARGB(179, 232, 5, 5), width: 3),
),
child:...,
);
//for border-radius
return Card(
shape: const RoundedRectangleBorder(
side: BorderSide(color: Colors.red, width: 3),
borderRadius: BorderRadius.all(Radius.circular(10)),
),
child:...,
);
我需要两者的结合,才能拥有一张卡片:
- 四边的边界半径
- 边框仅在右侧
像这样 -
试试下面的代码
Card(
elevation: 2,
child: ClipPath(
child: Container(
height: 100,
decoration: BoxDecoration(
border: Border(
right: BorderSide(
color: Color.fromARGB(179, 232, 5, 5),
width: 5,
),
),
),
),
clipper: ShapeBorderClipper(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(3),
),
),
),
),
结果->
问题:无法设置 border-radius 以及 single border (右边框) 在卡片小部件上。
到目前为止我有:
//for single border
return Card(
shape: const Border(
right: BorderSide(color: Color.fromARGB(179, 232, 5, 5), width: 3),
),
child:...,
);
//for border-radius
return Card(
shape: const RoundedRectangleBorder(
side: BorderSide(color: Colors.red, width: 3),
borderRadius: BorderRadius.all(Radius.circular(10)),
),
child:...,
);
我需要两者的结合,才能拥有一张卡片:
- 四边的边界半径
- 边框仅在右侧
像这样 -
试试下面的代码
Card(
elevation: 2,
child: ClipPath(
child: Container(
height: 100,
decoration: BoxDecoration(
border: Border(
right: BorderSide(
color: Color.fromARGB(179, 232, 5, 5),
width: 5,
),
),
),
),
clipper: ShapeBorderClipper(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(3),
),
),
),
),
结果->