[英]How can I achieve this design with flutter?
您可以使用ClipRRect
小部件:
Scaffold(
body: Padding(
padding: EdgeInsets.all(8.0),
child: Row(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Container(
width: 100,
color: Colors.red,
child: Text(
'Healthy',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
),
),
SizedBox(
width: 10,
),
ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Container(
width: 100,
color: Colors.red,
child: Text(
'Healthy',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
),
),
],
),
),
);
結果:
Row(
children: [
//unselected Chip
ActionChip(
onPressed: (){
},
shape: StadiumBorder(side: BorderSide()),
label: Text("History"),
backgroundColor: Colors.white,
),
//selected Chip
ActionChip(
onPressed: (){
},
label: Text("Funny Stories"),
shape: StadiumBorder(side: BorderSide(color: Colors.orange)),
backgroundColor: Colors.orange,
)
],
),
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.