【FAQ】HarmonyOS ETS如何给组件设置边框

【问题描述】

如何给Text组件设置左上 右上 为圆角，现在的boder方法 只能一起设置4个角

【解决方案】

我们可以使用boder设置圆角，或者在text组件添加一个矩形的遮罩层

1、参考资料

边框设置

形状裁剪

2、代码运行

代码如下

import featureAbility from '@ohos.ability.featureAbility';@[email protected] Index {  build() {    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {     Text("border").width("100%").height(100).fontSize(50).textAlign(TextAlign.Center)     Text("Z").width(100).height(100)       .border({color:Color.Blue,radius:10})//todo 设置边框       .fontSize(50)       .textAlign(TextAlign.Center)       .backgroundColor(Color.Red)     Text("设置两边圆角")       .width("100%")       .height(100)       .fontSize(50)       .textAlign(TextAlign.Center)      Text('Z')        .width(100)        .height(100)        .textAlign(TextAlign.Center)        .fontSize(50)        .backgroundColor(Color.Red)        //todo 从Text组件左上角开始     // todo 当Rect的width和height和Text组件的width和height大小相等时候 刚好覆盖text组件        .mask(new Rect({width: 100, height: 150}).fill(Color.White).radius(20))    }    .width('100%')    .height('100%')  }}

欲了解更多更全技术文章，欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh