HarmonyOS 关于list横向滚动高度不会自适应子组件问题

创建了一个横向的list,item是一个text,只设置了宽度,但是展示出来的效果是,list会铺满全屏,在不设置高度的情况下,我就想问下,如何让list的高度自适应

HarmonyOS
2024-12-24 15:10:36
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
aquaa

可以参考以下demo:

@Entry
@Component
struct listDemoFirst {
  private arr: string[] = ['0zkjsajlkhzfdjlaskhfiu', '1', '2hsaifuhshjflknsddukfhkushvkushiahfuisyujag', '3', '4', '5slkhfvuisdhvlansdkufyslfnsd', '6', '7', '8', '9isuidbhnakgcuahkucgyauis'];
  @State sizeValue: string = '';
  build() {
    Row() {
      List() {
        ForEach(this.arr, (item: string) => {
          ListItem() {
            Text(item)
              .width('30%')
              .height('auto')
              .fontSize(16)
              .border({ width: 1 })
              .textAlign(TextAlign.Center)
              .borderRadius(10)
              .backgroundColor(0xFFFFFF)
              .onAreaChange((oldValue: Area, newValue: Area) => {
                console.log(newValue.height.toString())
                if (Number(newValue.height) > Number(this.sizeValue)) {
                  this.sizeValue = newValue.height.toString()
                }
              })
          }
        },
          (item: string) => item)
      }
      .listDirection(Axis.Horizontal)
      .scrollBar(BarState.Auto)
      .backgroundColor(Color.Gray)
      .width('100%')
      .height(this.sizeValue)
    }
    .width('100%')
    .padding({ top: 5 })
  }

}
分享
微博
QQ
微信
回复
2024-12-24 17:55:58
相关问题
HarmonyOS List高度根据内容自适应
365浏览 • 1回复 待解决
HarmonyOS web组件自适应高度问题
1241浏览 • 1回复 待解决
HarmonyOS 自适应组件高度问题
1333浏览 • 1回复 待解决
HarmonyOS Web高度自适应问题
990浏览 • 1回复 待解决
HarmonyOS GridItem自适应高度问题
569浏览 • 1回复 待解决
HarmonyOS 高度自适应问题
536浏览 • 1回复 待解决
HarmonyOS Grid组件能否高度自适应
205浏览 • 1回复 待解决
HarmonyOS web组件怎么自适应高度
240浏览 • 1回复 待解决
HarmonyOS 高度自适应
438浏览 • 1回复 待解决
HarmonyOS Grid自适应高度和拖拽问题
780浏览 • 1回复 待解决
HarmonyOS 自动横向滚动List
285浏览 • 1回复 待解决
HarmonyOS RichText自适应高度
188浏览 • 1回复 待解决
Web组件如何实现高度自适应
1255浏览 • 1回复 待解决
Grid组件如何实现高度自适应
3475浏览 • 1回复 待解决
HarmonyOS Grid组件能否自适应内容高度?
223浏览 • 1回复 待解决