如何使孩子在Apache Royale的布局中居中？

Question

我正在寻找一种简单有效的方法，使用基本包装将所有孩子放在容器中。 （因为混合基本布局和珠宝布局会导致一些不良的副作用）

我必须使用CSS吗，珠子？如果两者都可用，那有什么区别，我可以分别获取每个示例的代码吗？

例如，您能告诉我如何将此代码修改为中心 文本标签：

<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:j="library://ns.apache.org/royale/jewel"
               xmlns:js="library://ns.apache.org/royale/basic" xmlns:local="*">


    <js:valuesImpl>
        <js:SimpleCSSValuesImpl />
    </js:valuesImpl>



    <js:initialView>
        <js:View>
            <js:beads>
                <js:VerticalLayout/>
            </js:beads>
            <js:Label text="How to center me on horizontal axis ?"/>
        </js:View>
    </js:initialView>

</js:Application>

感谢yishayw，由于我对如何添加CSS不熟悉，所以我找到了实现方法，并将完整的工作代码放在此处。我希望js | View会触发样式，但是用浏览器查看CSS时，我看到第一个“视图”的样式名称是“ royale”

<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:j="library://ns.apache.org/royale/jewel"
               xmlns:js="library://ns.apache.org/royale/basic" xmlns:local="*">

<fx:Style>
        @namespace j "library://ns.apache.org/royale/jewel";
        @namespace js "library://ns.apache.org/royale/basic";

    .royale {
        align-items :center;
    }

    js|Label {
        color: #ff0000;
    }
 </fx:Style>   

    <js:valuesImpl>
        <js:SimpleCSSValuesImpl />
    </js:valuesImpl>



    <js:initialView>
        <js:View >
            <js:beads>
                <js:VerticalFlexLayout />
            </js:beads>
            <js:Label text="How to center me on horizontal axis ?"/>
        </js:View>
    </js:initialView>

</js:Application>

问候

Answer 1