HarmonyOS鸿蒙Next中button设置borderRadius无效

HarmonyOS鸿蒙Next中button设置borderRadius无效

Button('删除')
  .onClick((event: ClickEvent) => {
    let selectIndex = -1;
    this.addressList.forEach((address: AddressClass, index) => {
      if (address.id === item.id) {
        selectIndex = index
      }
    })

    this.addressList.splice(selectIndex, 1)
  })
  .type(ButtonType.Normal)
  .borderRadius(8)// 设置 borderRadius 不生效 ？？？？
  .backgroundColor('#FF4D6A')
  .fontColor('white')
  .width(54)
  .height(30)
  .fontSize(14)
  .border({ color: '#E5E7EB', width: 1 })
  .margin({ right: 12 })
  .padding(0) // 注意这里的坑

更多关于HarmonyOS鸿蒙Next中button设置borderRadius无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

.border 不能后于 .borderRadius 设置，前者会覆盖后者。

可以写成下面这样：

// 写法 1，全用 .borderXXX
Button('删除')
  .type(ButtonType.Normal)
  .borderRadius(8)
  .borderColor('#E5E7EB')
  .borderWidth(1)
...

// 写法 2，只用 .border
Button('删除')
  .type(ButtonType.Normal)
  .border({ color: '#E5E7EB', radius: 8, width: 1 })
...

// 写法 3，混合写法
Button('删除')
  .type(ButtonType.Normal)
  .border({ color: '#E5E7EB', width: 1 })
  .borderRadius(8) // 必须放在 .border 的后面
...

更多关于HarmonyOS鸿蒙Next中button设置borderRadius无效的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


感谢， 可以，

找HarmonyOS工作还需要会Flutter的哦，有需要Flutter教程的可以学学大地老师的教程，很不错，B站免费学的哦：BV1S4411E7LY/?p=17

先设置border再设置borderRadius就可以解决

感谢，

在HarmonyOS鸿蒙Next中，button组件的borderRadius属性无效，可能是由于以下原因：

  1. 样式优先级问题：检查是否有其他样式覆盖了borderRadius属性。确保borderRadius在样式中具有足够高的优先级。

  2. 组件版本问题：确认使用的button组件版本是否支持borderRadius属性。某些旧版本可能不支持该属性。

  3. 平台限制：某些平台或设备可能对borderRadius属性的支持有限，导致属性无效。

  4. 代码实现问题：检查代码中是否正确设置了borderRadius属性。确保属性值格式正确，如borderRadius: '10px'。

  5. 框架或库冲突：如果使用了第三方框架或库，可能存在冲突，导致borderRadius属性无法生效。

  6. 系统主题或样式影响：系统主题或全局样式可能影响button组件的显示效果，导致borderRadius属性无效。

  7. 组件嵌套问题：如果button组件嵌套在其他组件中，父组件的样式可能影响button的显示效果。

  8. 渲染引擎问题：某些情况下，渲染引擎可能无法正确解析borderRadius属性，导致属性无效。

  9. 属性拼写错误：检查borderRadius属性是否拼写正确，确保没有拼写错误。

  10. 样式作用域问题：确保borderRadius属性在正确的作用域内生效，避免作用域冲突。

以上是可能导致button组件的borderRadius属性无效的原因。

在HarmonyOS鸿蒙Next中，如果设置borderRadius无效，可能是由于以下原因：

  1. 样式冲突：检查是否有其他样式覆盖了borderRadius，如border或background属性。
  2. 组件类型：确保使用的是支持borderRadius的组件，如Button或Text。
  3. 版本问题：确认使用的鸿蒙版本是否支持该属性，某些旧版本可能不支持。
  4. 代码错误：检查代码语法是否正确，如borderRadius的值是否合法。

建议使用以下代码示例进行测试：

Button('Click Me')
  .borderRadius(20)
  .backgroundColor(Color.Blue)

如果问题依旧，建议查阅官方文档或更新SDK版本。

回到顶部