如何使用 Appcelerator 在水平布局中对齐从右到左的元素？

Question

使用layout = horizontal，其中的元素从左边开始堆叠。我想从右到左堆叠元素。我该怎么做？

Answer 1

没有属性可以执行此操作。但是你可以通过镜像技巧来做到这一点。

index.xml

<Alloy>
    <Window class="container" title="Test">
        <View id="holder">
            <View class="item" />
            <View class="item" />
            <View class="item" />
        </View>
    </Window>
</Alloy>

index.tss

"#holder": {
    top:"50dp",
    layout:"horizontal",
    width:Ti.UI.FILL,
    transform:Alloy.Globals.mirror
}
".item":{
    left:0,
    width:"20dp",
    height:"20dp",
    backgroundColor:"red",
    borderColor:"blue",
    borderWidth:"1dp"
}

alloy.js

Alloy.Globals.mirror = Ti.UI.create2DMatrix().scale(-1,1);

Answer 2

根据您的用例，您还可以这样做：

<Alloy>
    <Window>
        <View layout="horizontal" width="Ti.UI.SIZE" right="0">
            <View backgroundColor="red" left="0" width="20" height="20" />
            <View backgroundColor="green" left="0" width="20" height="20" />
            <View backgroundColor="blue" left="0" width="20" height="20" />
        </View>
    </Window>
</Alloy>

请注意，视图本身不会从右堆叠，但通过将父级宽度设置为 Ti.UI.SIZE，整个组确实会右对齐。同样，如果您需要视图本身来堆叠 RTL 并且仍然希望 XML 中的顺序保持原样，这可能无法满足您的需求。

如何使用 Appcelerator 在水平布局中对齐从右到左的元素？

How do you align elements going from right to left in a horizontal layout using Appcelerator?

appcelerator

appcelerator-titanium