动态调整 Flash/Flex 嵌入对象大小时的奇怪行为答案

【问题标题】：Strange behaviour when dynamically resizing Flash / Flex embed object动态调整 Flash/Flex 嵌入对象大小时的奇怪行为
【发布时间】：2008-10-29 20:36:00
【问题描述】：

我有一个简单的 Flex 应用程序，它是一个面板，里面有一个中继器；虽然有点简化，但是是这样的：


<mx:Panel id="pnl">
    <mx:Repeater id="rp">
        <mx:Label text = "foo" />
    &lt/mx:Repeater>
&lt/mx:Panel>

然后我将这个 Flex 应用程序嵌入到 HTML 包装器中。然后，我尝试在 Flex 面板更改大小时动态调整 HTML 中嵌入的 Flash 对象的大小（从而允许 Flex 应用程序根据需要使用尽可能多的 HTML 页面）。

我通过执行以下操作来做到这一点：


pnl.addEventListener(ResizeEvent.RESIZE,function(event:Event):void {
    ExternalInterface.call("resize",event.target.height);
});

依次调用这个javascript函数：


function resize(height) {
    // the embed or object that contains the flex app
    var e = document.getElementById('flex_object');
    if(e) e.height = height;
}

这似乎在 IE 中完美运行，但是我在 Firefox / Safari 中得到奇怪的结果，中继器工作了 n 次，然后文本似乎在中继器，见附图： alt text http://img528.imageshack.us/img528/9538/rpre0.jpg

谁能解释为什么会发生这种情况，以及是否有任何解决方法/方法可以做同样的事情？

【问题讨论】：

标签： apache-flex actionscript-3

【解决方案1】：

我目前正在做同样的事情（一个 swf，它会根据当前持有的内容动态改变其高度）。我在尝试制作多行按钮时也遇到了与您类似的问题。

我是 flex 新手，但我设法解决了手动调用容器的 updateDisplayList() 的问题...我认为它“强制”在某处渲染...它的参数是某个区域的宽度和高度发生变化的地方。很抱歉不知道细节......但它对我有用。

【讨论】：

【解决方案2】：

为什么不简单地在 HTML 页面上为 Flash 对象使用百分比宽度和高度？这样您就不必做任何事情来调整您的 SWF...

【讨论】：

【解决方案3】：

这很奇怪 - 看起来 Firefox/Safari 正在扩展嵌入的绘制区域，但不知何故 Flash 没有收到它需要渲染新像素的消息。

您可能可以通过强制 Flash 自我更新来解决此问题，但由于浏览器和嵌入之间的通信似乎很混乱，因此采用适合浏览器的不同方法可能会不那么骇人听闻' 没有错误的事件流。

例如，您可以尝试将 Flash 放在 DIV 中，将 Flash 的大小设置为 100%，然后调整 DIV 的大小，而不是调整嵌入的大小。这似乎不太可能行为不端。

【讨论】：

【解决方案4】：

我的经验是，Flex 的大小调整功能……很有趣。有时他们会按照人们期望的方式工作，有时则不然。您可以尝试几件事：首先，跟踪您期望在 Flex 中获得的高度值，甚至是 ExternalInterface.call("alert",event.target.height);这会让您确定是 JavaScript 还是 Flex 问题（但我怀疑是 Flex）。

您的问题可能与组件的缩放有关：

设置 [the height] 属性会导致调度 resize 事件。有关何时调度此事件的详细信息，请参阅调整大小事件。如果组件的 scaleY 属性不是 100，则组件与其内部坐标的高度将不匹配。因此，一个 100 像素高且 scaleY 为 200 的组件将在父级中占用 100 像素，但在内部会认为它是 50 像素高。

如果它是 Flex 并且没有帮助，我会尝试在 ExternalInterface 调用之前使用 callLater，这通常会让 Flex 有足够的时间来弄清楚它到底在做什么。有时需要 setTimeout，但我觉得这很尴尬。

【讨论】：