Question

我有一个使用约束布局（左/右/上/下）将表单放在背景中的表单。当我在弹出的TitleWindow中使用该表单时，它会按照我的预期布局并调整组件的大小（并设置TitleWindow大小）。

当尝试在Scroller中使用相同的组件集时，布局不正确 - 背景调整大小以适应Scroller，而内部窗体的大小正确（但不应用右/底约束）

这个简化的程序演示了这个问题。如果没有Scroller，表单会正确布局，如果调整WindowedApplication的大小以显示整个表单，它看起来是正确的。

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                        xmlns:s="library://ns.adobe.com/flex/spark" 
                        xmlns:mx="library://ns.adobe.com/flex/mx"
                        width="400" height="400">

    <fx:Declarations>
        <s:SolidColor id="bgFill" color="#8080c0"/>
        <s:SolidColor id="whiteFill" color="#ffffff"/>
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            protected function checkSizes():void
            {
                trace('Base is ' + base.width + 'x' + base.height);
                trace('Background is ' + bg.width + 'x' + bg.height);
                trace('Border is ' + border.width + 'x' + border.height);
                trace('Form is ' + form.width + 'x' + form.height);
            }

        ]]>
    </fx:Script>

        <s:Group id="base">
            <s:Rect id="bg"
                    left="0" right="0" top="0" bottom="0"
                    fill="{bgFill}"/>
            <s:Rect id="border"
                    left="10" right="10" top="10" bottom="10"
                    fill="{whiteFill}"/>
            <s:VGroup id="form" left="20" right="20" top="20" bottom="20">
                <s:Button width="600" height="600" 
                          label="Push Me!"
                          click="checkSizes()"/>
            </s:VGroup>
        </s:Group>
</s:WindowedApplication>

单击按钮会显示我期望的组件大小：

基数为640x640 背景是640x640 边界是620x620 表格是600x600

如果我添加一个滚动条以适合父窗口，base，bg和border都适合滚动条，而不是大小适合作为{{1}的边框}：

form

基数为385x361 背景是385x361 边界是365x341 表格是600x600

奇怪的是，如果我在<s:Scroller width="100%" height="100%"> <s:Group id="base"> ...附近放一个额外的小组，那么每个人都会正确地展示......

base

在我开始深入研究Scroller和ScrollerSkin源代码之前，任何人都知道我是不是在摇滚歌手并且在第一个卷轴示例中做了些什么？我宁愿不创建我不需要的额外的组件层。

Answer 1

滚动条限制其第一个（也是唯一的）子项保持在其范围内，当您滚动时，它将移动该子项的视口。

由于您的主应用程序将卷轴的大小限制为400x400，因此基础也不会超过400x400。

如果添加虚拟对象，则可以根据需要随意扩展基础，但虚拟将限制为扩展。我希望这能解释一下。如果没有问我更多=）

AS3 Scroller，与约束布局的奇怪交互？

1 个答案: