《鸿蒙开发-答案之书》 Flex可以设置最大行数嘛?
答案:是可以的,不过系统默认没有提供相应的api,得自己弄。
先看下效果图:
关键代码:
build() {
Stack() {
Flex({space:{main:LengthMetrics.vp(8),cross:LengthMetrics.vp(8)},justifyContent:FlexAlign.Start,wrap:FlexWrap.Wrap}){
ForEach(this.labelShowDataList,(item:ToInfoLabelListBean,index:number) =>{
Text(item.name)
.fontColor('#222222')
.fontSize(14)
.backgroundColor('#f6f6f6')
.borderRadius(4)
.padding({
left:10,
top:4,
right:10,
bottom:4
})
.onAreaChange((oldValue: Area, newValue: Area) => {
if (!this.labelIsInit && newValue.width != 0) {
this.labelItemWidthList[index] = Number(newValue.width) // item宽度
this.labelIsDrawFinish()
}
})
})
Row(){
Text(this.labelIsShowAll?'收起':'更多')
.fontColor($r('app.color.color_main'))
.fontSize(14)
Image($r('app.media.ic_blue_right'))
.width(5.5)
.height(10)
.margin({ left: 6 })
}
.backgroundColor('#eaf8f9')
.borderRadius(4)
.width(60) // 写定值,否则宽度不好控制
.padding({
top:4,
bottom:4
})
.justifyContent(FlexAlign.Center)
.onClick(()=>{
this.labelTransformExpendList(!this.labelIsShowAll)
})
}
.width('100%')
.onAreaChange((oldValue: Area, newValue: Area) => {
if (!this.labelIsInit && newValue.width != 0) {
this.labelFlexWidth = Number(newValue.width)
this.labelIsDrawFinish()
}
})
}
.height('100%')
.width('100%')
.padding(16)
}
有问题或者完整源码demo的可以看简介联系我,也可以私信我,我每天都看私信的