HarmonyOS RelativeContainer子组件margin属性问题

子组件的margin含义解释参考规则说明：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-relativecontainer-V5#规则说明

相对布局容器内的子组件的margin含义不同于通用属性的margin，其含义为到该方向上的锚点的距离。若该方向上没有锚点，则该方向的margin不生效，参考示例如下：

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

  build() {
    RelativeContainer() {
      Image("")
        .id('sku_image')
        .width('96vp')
        .height('96vp')
        .borderRadius('4vp')
        .alignRules({
          left: { anchor: '__container__', align: HorizontalAlign.Start }
        })
        .margin({
          left: '12vp',
          right: '8vp',
          top: '28vp',
          bottom: '12vp'
        })
        .backgroundColor('#888888')
      Text('TextTextTextTextTextTextTextTextTextTextTextTextTextTextText')// .id('sku_name')
        .height('auto')
        .fontSize('14fp')
        .fontColor('#FFFFFFFF')
        .fontWeight(FontWeight.Bold)
        .maxLines(2)
        .textOverflow({ overflow: TextOverflow.Ellipsis })
        .ellipsisMode(EllipsisMode.END)
        .padding({
          left: '8vp',
          right: '12vp'
        })
        .alignRules({
          left: { anchor: 'sku_image', align: HorizontalAlign.End },
          top: { anchor: 'sku_image', align: VerticalAlign.Top },
          right: { anchor: "__container__", align: HorizontalAlign.End }
        })
    }
    .width('100%')
    .height('auto')
    .backgroundColor('#333333')
    .backgroundImagePosition({ x: '972', y: '324' })
    .backgroundImageSize({ width: '0.00px', height: '0.00px' })
  }
}
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.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.