HarmonyOS 关于 margin 设置百分比的问题

设置了 margin top 40%,但是看距离不对(横竖屏都不对)

import { window } from '@kit.ArkUI';

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  onPageShow(): void {
    // window.getLastWindow(getContext(this)).then((lastWindow) => {
    //   // 横屏
    //   lastWindow.setPreferredOrientation(window.Orientation.LANDSCAPE_INVERTED);
    //   // 全屏
    //   lastWindow.setWindowLayoutFullScreen(true);
    //   // 设置状态栏和导航条隐藏
    //   lastWindow.setSpecificSystemBarEnabled('status', false);
    // })
  }

  build() {
    RelativeContainer() {
      Text(this.message)
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          top: { anchor: "__container__", align: VerticalAlign.Top },
          middle: { anchor: "__container__", align: HorizontalAlign.Center }
        })
        .margin({ top: '40%' })
        .backgroundColor(Color.Blue)
    }
    .width('100%')
    .height('100%')
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
HarmonyOS
2024-12-18 15:27:17
590浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
Excelsior_abit

RelativeContainer的margin起始点是锚点位置来计算的,margin设置百分比参考的是父容器的宽度而不是父容器的长宽。

RelativeContainer参考:https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-container-relativecontainer.md

margin参考:https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkui/arkui-ts/ts-universal-attributes-size.md#margin

分享
微博
QQ
微信
回复
2024-12-18 17:41:57
相关问题
HarmonyOS 关于组件height百分显示问题
1113浏览 • 1回复 待解决
HarmonyOS ArkTS百分变量设置
589浏览 • 1回复 待解决
HarmonyOS 设置margin无效
616浏览 • 1回复 待解决
HarmonyOS 关于alertDialog样式设置问题
629浏览 • 1回复 待解决
HarmonyOS 关于代理提醒设置问题
1432浏览 • 1回复 待解决
关于DES加密设置问题
876浏览 • 1回复 待解决
HarmonyOS margin不生效问题
1070浏览 • 1回复 待解决
HarmonyOS 关于动态设置组件宽度问题
1168浏览 • 1回复 待解决