nativescript - 在 NativeScript 布局中居中和右/左对齐项目

Question

在 NativeScript 应用程序的上下文中，我一直在努力寻找一种有效的、非 hacky 的方法来完成看起来很简单的事情:将一个项目放在布局的中心，另一个项目一直放在右侧或左侧布局 - 类似于这个问题中的图像:Center and right align flexbox elements .这些项目应该都在一行中，因为它们在那里。 (我已经查看了这些解决方案，但我不想添加伪元素，而且很多 CSS 无法与 NativeScript 一起使用。)是否有某种干净、规范的方法可以使用默认布局？
如果这还不够“具体”，请说我有这样的场景:

<SomeLayout>
  <Label text="Center me"></Label>
  <Label text="Pull me to the right"></Label>
</SomeLayout>

标签的文本属性描述了我正在寻找的内容。请测试任何建议或确保它们有效。

Answer 1

您可以使用 horizontalAlignment与 GridLayout通过对两个标签应用相同的行号。

<GridLayout rows="auto" columns="*">
  <Label row="0" horizontalAlignment="center" text="Center me" class="center"></Label>
  <Label row="0" horizontalAlignment="right" text="Pull me to the right" class="right"></Label>
</GridLayout>

您也可以设置 horizontalAlignment使用 horizontal-align 来自 CSS 的属性属性。

.center{
    horizontal-align:center;
}
.right{
    horizontal-align:right;
}

主要技巧是您必须为标签提供相同的行号，以便它们相互重叠。