Apache flex 为什么不'；t水平中心和垂直中心是否在Spark（Flex 4）中工作？

下面的代码将屏幕分为两列，左侧和右侧。然后，它在每列中放置一个框，并尝试将它们居中。将忽略“水平中心”和“垂直中心”特性：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx"
               backgroundColor="blue">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:SkinnableContainer id="mainContentArea"
             top="100" bottom="100"
             backgroundColor="red">
        <s:layout>
            <s:ConstraintLayout>
                <s:constraintColumns>
                    <s:ConstraintColumn id="col1" width="{width/2}" />
                    <s:ConstraintColumn id="col2" width="{width/2}" />              
                </s:constraintColumns>                  
            </s:ConstraintLayout>
        </s:layout>
        <s:BorderContainer id="greenContainer"
                           backgroundColor="green"
                           width="400" height="300"
                           horizontalCenter="col1:0"
                           verticalCenter="0">
        </s:BorderContainer>    
        <s:BorderContainer id="yellowContainer"
                           backgroundColor="yellow"
                           width="200" height="150"
                           horizontalCenter="col2:0"
                           verticalCenter="0">
        </s:BorderContainer>        
    </s:SkinnableContainer>
</s:Application>

来自：

每个元素支持的约束为

左

，

右

，

顶部

，

底部

，

基线

，

百分比宽度

和

百分比高度

。元素的最小值和 将始终遵守最大尺寸

因此

水平中心

和

垂直中心

不在支持的约束列表中

我建议您使用以下代码：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"
    backgroundColor="blue">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:SkinnableContainer id="mainContentArea"
        top="100" bottom="100"
        backgroundColor="red" left="0" right="0">
        <s:layout>
            <s:ConstraintLayout>
                <s:constraintColumns>
                    <s:ConstraintColumn id="col1" width="50%" />
                    <s:ConstraintColumn id="col2" width="50%" />              
                </s:constraintColumns>                  
            </s:ConstraintLayout>
        </s:layout>
        <s:Group left="col1:0" right="col1:0" top="0" bottom="0">
            <s:BorderContainer id="greenContainer"
                backgroundColor="green"
                width="400" height="300"
                horizontalCenter="0"
                verticalCenter="0">
            </s:BorderContainer>    
        </s:Group>
        <s:Group left="col2:0" right="col2:0" top="0" bottom="0">
            <s:BorderContainer id="yellowContainer"
                backgroundColor="yellow"
                width="200" height="150"
                horizontalCenter="0"
                verticalCenter="0">
            </s:BorderContainer>        
        </s:Group>
    </s:SkinnableContainer>
</s:Application>

那么如何在Spark中实现相同的功能呢？为什么要改变？MX中的相同代码也可以工作（使用画布）。我想您应该使用

left=right=top=bottom=“0”

放置一个

组，并使用
verticalCenter
和
horizontalCenter
将控件放在其中。我没有回答问题的第二部分，因为我对Adobe的动机没有任何想法。感谢您对这一点的关注。不知道我是否明白你的意思。你能发布有效的编辑代码吗？不幸的是，无法将控件放置在不同的组中。必须在同一个容器中，因为我正在交换它们，调整它们的大小，通过不同的状态转换它们。这两个框必须通过ConstraintColumns居中。同样，这在MX中有效。我正试图发布MX代码。再次感谢您的关注。我走的是那条路。不幸的是，正如我所说，这些组件必须存在于同一组中。由于需要交换箱子，不同的组无法工作。图片右上角有一个“反转”按钮，单击该按钮可反转框的位置。当盒子反转时，它们会平滑地过渡到新的反转位置。如果组件位于不同的组中，这些转换将不起作用。它们必须水平居中于ColumnConstraint上，而不是组容器上。我被难住了。同样，我在MX中也有这样的功能。为什么不使用转换来移动组呢？我理解你关于MX的观点。但这是斯巴达，对不起，斯帕克。它是具有其他功能的其他组件集。