@Entry
@Component
struct demo1 {
@State arr: Array<number> = [0,1,2,3,4,5]
build() {
Column() {
Row(){
Column() {
List({scroller: new Scroller()}) {
ForEach(this.arr, (item:number) => {
ListItem() {
Text(item.toString())
.padding(12)
.margin(2)
.backgroundColor(Color.Gray)
}
})
}.backgroundColor(Color.Green)
.listDirection(Axis.Horizontal)
}
.alignItems(HorizontalAlign.Start)
.height('auto')
.layoutWeight(1)
.backgroundColor(Color.Yellow)
Text("end").padding(12).backgroundColor(Color.Blue)
}.width('100%').backgroundColor(Color.Pink)
}
.width('100%')
.height(100)
}
}
上述代码,在column中嵌入横向List之后,整个Row的宽度会显示为父容器的高度,期望是为内容的高度运行效果中,每个list item的高度为灰色,符合预期,但是List的高度为撑满,不符合预期
请参考以下示例:
确认规格, list交叉轴方向上的宽度继承关系, 当父组件无穷大的时候, 继承子组件的宽度, 否则继承父组件的宽度
当前问题, list组件外部用scroll组件设置相互垂直的主轴方向可以满足