设置组件圆角

属性:.borderRadius(参数)

参数:数值或对象(四个角单独设置)

topLeft:左上角

topRight:右上角

bottomLeft:左下角

bottomRight:右下角

语法:

Text('圆角语法')
  .borderRadiut(5)    // 四个圆角相同
  .borderRadiut({
    topLeft: 5,
    topRight: 10,
    bottomRight: 15,
    bottomLeft: 20
})    // 四个方向圆角,单独设置

特殊形状的圆角设置

1.正圆

Text('正圆')
  .width(100)    // 宽度高度一样
  .height(100)
  .borderRadius(50)    // 圆角是宽或高的一半

2.胶囊按钮(左右半圆) 

Text('胶囊按钮')
  .width(150)    // 宽度大,高度小
  .height(50)
  .borderRadiut(25)    // 圆角是高的一半

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐