我正在尝试创建一个类似于下图所示的形状。
我打算使用Chips来实现相同的目标。但是,筹码的所有 4 边都有圆形边框。有什么方法可以覆盖它并在左侧有一个矩形角,在右侧有一个圆角。
小智 17
您可以使用 Chip 小部件的 shape 属性。在该属性中,您可以传递 RoundedRectangleBorder() 并在 RoundedRectangleBorder() 中提及 borderRadius。还有其他形状边框,如 BeveledRectangleBorder()、StadiumBorder()、OutlineInputBorder()、ContinuousRectangleBorder() 等。
下面给出了使用 RoundedRectangleBorder() 的代码:
Chip(
backgroundColor: Color(0xFFE1E4F3),
padding: const EdgeInsets.symmetric(vertical: 15,horizontal: 5),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.only(topRight: Radius.circular(20),bottomRight: Radius.circular(20))),
label: Text("Custom Chip Shape",
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Color(0xFF3649AE)
),
)
);
Run Code Online (Sandbox Code Playgroud)
希望这可以帮助你!!
归档时间: |
|
查看次数: |
7345 次 |
最近记录: |