Nativescript将元素移动50%,而不是100%?

我有一个简单的演示项目,其中:

<GridLayout>

    <StackLayout #myStack1 width="100" height="100" translateX="-50" backgroundColor="red" id="bbb">
    </StackLayout>

    <StackLayout #myStack2 width="100" height="100" translateX="50" backgroundColor="green" id="ccc">
    </StackLayout>
</GridLayout>

请注意 width 和 height 是 100 .

现在让我们添加 marginTop 到 green 布局:

@ViewChild("myStack2") private myStack2: ElementRef;
ngOnInit(): void {
    this.myStack2.nativeElement.marginTop =100;
  }

但看看发生了什么:

它被移动了 50% 属于 100 (盒子尺寸为100)。为什么?

问题:

为什么会发生这种情况?我如何将代码修复为marginTop 100 ?

我不是在追求translateY=100(这确实如预期所示-我在追求marginTop的原因和解决方案)。