HarmonyOS 鸿蒙Next:设置list自适应内容撑起高度时出现的超出父视图问题

发布于 1周前 作者 gougou168 来自 鸿蒙OS

HarmonyOS 鸿蒙Next:设置list自适应内容撑起高度时出现的超出父视图问题

写了一个list,然后自适应内容撑起高度,最大高度为屏幕的百分之75。当内容撑起到最大高度的时候,滑动list,会发现底部有几个cell滑动不出来,看图层是因为list被撑出父视图。因为list会被撑的跟父视图相同的高度,但在list上面加了title组建,底部加了个安全区view组建,之后就改成了相对布局,但是相对布局list一直会爆警告,没有设置宽高。index是有问题版本,index1、2是尝试修改版本。所以是特意设计成list撑满的话一定会跟父控件高度一致吗,不管父控件上是否有别的子控件?list是否能自适应呢


更多关于HarmonyOS 鸿蒙Next:设置list自适应内容撑起高度时出现的超出父视图问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

list自适应内容可以通过设置LayoutWeight(1)属性来解决,经验证是可以实现的

@Entry
@Component
struct Index {
@State message: string = 'Hello World';
build() {
Column(){
Column () {
Text('12')
.fontSize(18)
.fontWeight(FontWeight.Regular)
.fontColor(Color.Black)
.textAlign(TextAlign.Center)
.backgroundColor(Color.Blue)
.width('100%')
.height(100)
List({ space: 10 }) {
ListItem() {
Row()
.backgroundColor(Color.Red)
.width('100%')
.height(100)
}
}
.padding({ top: 10, left: 10, bottom: 10, right: 10 })
.backgroundColor(Color.Pink)
.scrollBar(BarState.Off)
.onClick(() => {
})
.width('100%')
.constraintSize({
maxHeight: '75%'
})
}
.justifyContent(FlexAlign.End)
.layoutWeight(1)
}
.justifyContent(FlexAlign.End)
.backgroundColor('#000000')
.width('100%')
.height('100%')
}
}

更多关于HarmonyOS 鸿蒙Next:设置list自适应内容撑起高度时出现的超出父视图问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


针对HarmonyOS鸿蒙Next系统中,设置list自适应内容撑起高度时出现的超出父视图问题,这里提供可能的解决方案:

在HarmonyOS开发中,若list组件的内容高度超过其父视图设定的高度,通常是由于list的布局或样式设置不当导致的。首先,检查list组件的布局参数,确保没有设置固定高度或不当的填充方式。应使用如height: match_parentheight: wrap_content等属性,让list根据内容自动调整高度。

其次,检查list项(item)的布局,确保没有内部元素(如图片、文本等)溢出其容器。对于可滚动的list,考虑使用ScrollViewNestedScrollView作为父容器,并设置适当的滚动行为。

此外,确认是否有样式或脚本代码(如JavaScript)在运行时动态修改了list或其父视图的高度。如有,需调整这些代码,确保高度设置逻辑正确。

最后,检查父视图的布局约束,确保没有限制list的扩展。例如,在Flex布局中,确保父容器的flex-directionalign-items等属性不会压缩list的高度。

如果问题依旧没法解决请联系官网客服,官网地址是 https://www.itying.com/category-93-b0.html

回到顶部