除非在 Flex 3 中明确设置高度（以像素为单位），否则无法自动滚动 VBox

Question

我有一个以编程方式动态添加和删除子项的 VBox。 高度设置为 100%，verticalScrollPolicy=auto。

当用户想要向该 VBox 添加另一个子项时，我希望它自动滚动到 VBox 的底部，因为那是添加子项的位置。

我已经尝试了我可以在网上找到的所有解决方案，但无论如何，verticalScrollPosition和maxVerticalScrollPosition都始终等于0。即使我手动滚动到VBox的底部并按下一个警告这些数字的按钮。（即使在之后'validateNow()' 也是如此）。

我唯一能以编程方式更改这些数字的情况是当 VBox 高度以像素为单位设置时，我不希望这样做，因为孩子们都有不同的高度。

请告诉我，可以设置verticalScrollPosition，而无需对高度（以像素为单位）进行硬编码吗？ 我在这里错过了一些完全明显的东西吗？

Answer 1

实际上，您可能没有滚动 VBox； 如果您的 VBox 包含在另一个容器（例如 Canvas 等）中，并且您按照您所说的方式向 VBox 添加项目，则很有可能是 Canvas 进行滚动，而不是 VBox - 在在这种情况下，VBox 确实会为其滚动位置返回 0。

无论如何，你是对的——你必须设置组件的高度； 即使约束布局设置（例如，“bottom='10'”等）也不起作用。 但是，如果您可以设法设置 VBox 的高度，无论是通过将其尺寸以某种方式绑定到另一个控件，还是通过将它们显式设置为子级附加/创建过程的一部分，您应该能够完成您所追求的目标。

下面是我模拟的一个 AIR 应用程序示例，用于说明该示例。 基本上，它只是将随机大小的框添加到 VBox，并在创建每个子项后滚动到 VBox 的底部。

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" verticalScrollPolicy="off" horizontalScrollPolicy="off" width="250">

    <mx:Script>
        <![CDATA[

            import mx.core.Application;
            import mx.containers.Box;
            import mx.events.FlexEvent;

            private function addItem(h:Number):void
            {
                var b:Box = new Box();
                b.width = 200;
                b.setStyle("backgroundColor", 0xFFFFFF);
                b.height = h;

                // Wait for the component to complete its creation, so you can measure and scroll accordingly later
                b.addEventListener(FlexEvent.CREATION_COMPLETE, b_creationComplete);
                vb.addChild(b);
            }

            private function b_creationComplete(event:FlexEvent):void
            {
                event.currentTarget.removeEventListener(FlexEvent.CREATION_COMPLETE, b_creationComplete);
                vb.verticalScrollPosition = vb.getChildAt(vb.numChildren - 1).y;
            }

        ]]>
    </mx:Script>

    <mx:VBox id="vb" top="10" right="10" left="10" height="{Application.application.height - 80}" verticalScrollPolicy="on" />
    <mx:Button label="Add Item" click="addItem(Math.random() * 100)" bottom="10" left="10" />

</mx:WindowedApplication>

在本例中，VBox 的高度绑定到其包含组件（此处仅是应用程序）的高度。 其他一切都应该是不言自明的。

希望有帮助！ 如果您有任何疑问，请回帖。