border语法格式如下:
要实现如下效果:
代码如下:
@Entry
@Component
struct IndexTest {
@State message: string = 'IndexTest';
build() {
Column(){
Text('border实现')
.fontSize(30)
.border({
width:4,
color:Color.Red,
style:BorderStyle.Solid,
radius:10
})
.padding(15)
}.width('100%')
}
}
鸿蒙的强大远不止于此处,还可以实现单边框,就是说变宽的四个角、四个边都可以随意改成想要的颜色样式,改四个变宽语法width:{left:6,right:8,top:8,bottom:8},同理改颜色color:{left:Color.Black,right:Color.Red,top:Color.Pink,bottom:Color.Green},如图效果:
代码如下:
Text('单边框')
.fontColor(Color.Red)
.fontSize(50)
.padding(8)
.border({
width:{
left:6,
right:8,
top:8,
bottom:8
},
color:{
left:Color.Black,
right:Color.Red,
top:Color.Pink,
bottom:Color.Green
},
style:{
left:BorderStyle.Dotted,
right:BorderStyle.Solid,
top:BorderStyle.Dashed,
bottom:BorderStyle.Dotted
}



















