HarmonyOS 容器组件RelativeContainer().height('无效')

容器组件RelativeContainer().height('无效')。代码如下：

//个人信息View

RelativeContainer() {  
  Text($r("app.string.login_and_register"))  
    .id("tvName")  
    .height('auto')  
    .alignRules({  
      top: { anchor: "__container__", align: VerticalAlign.Top },  
      right: { anchor: "__container__", align: HorizontalAlign.End }  
    })  
    .margin({ top: "13px", right: "205px" })  
    .fontSize("40px")  
    .fontWeight(FontWeight.Bold)  
  
}  
.id("userInfoContainer")  
.height('auto')  
.alignRules({  
  top: { anchor: "__container__", align: VerticalAlign.Top },  
  left: { anchor: "__container__", align: HorizontalAlign.Start }  
})  
.margin({  
  top: "230px",  
  left: $r("app.string.page_padding_left_right"),  
  right: $r("app.string.page_padding_left_right")  
})  
.backgroundColor($r("app.color.colorPrimary"))  
.borderRadius("15px")

HarmonyOS

Heiang

2024-10-28 11:13:53

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

RelativeContainer支持宽高自适应子组件，将其设置为auto即可，但限制是当width设置auto时，如果水平方向上子组件以容器作为锚点，则auto不生效，垂直方向上同理。

可参考如下代码（容器中设置两个子组件，第一个子组件不写以RelativeContainer为锚点，第二个子组件以第一个子组件为锚点，具体位置需要您手动调整）您测试下是否对您有帮助。

RelativeContainer() {  
  Row().width(20).height(20)  
    .backgroundColor(Color.Blue)  
    .id("row1")  
    .opacity(0)  
  
  Text('登录注册')  
    .id("tvName")  
      // .height('auto')  
    .alignRules({  
      top: { anchor: "row1", align: VerticalAlign.Top },  
      left: { anchor: "row1", align: HorizontalAlign.End }  
    })  
    .margin({ top: -5, left: 200 })  
    .fontSize("40px")  
    .fontWeight(FontWeight.Bold)  
  
}  
.id("userInfoContainer")  
.height('auto')  
.alignRules({  
  top: { anchor: "__container__", align: VerticalAlign.Top },  
  left: { anchor: "__container__", align: HorizontalAlign.Start }  
})  
.margin({  
  top: "230px",  
  left: 20,  
  right: 20  
})  
.backgroundColor(Color.Pink)  
.borderRadius("15px")

2024-10-28 16:17:22

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS 容器组件RelativeContainer().height('无效')

订阅鸿蒙技术特刊，精选内容抢先看