Question

初学者问题：我在Flex 4中使用IFrame Component for Flex。下面的代码在放在滚动区域的顶部时起作用。但是，如果我将它放在可视区域下方，它将无法呈现。我是Flex的初学者。有趣的是，当我在HBox视野中调整窗口大小时，Iframe将加载。但滚动到它不会。以下是我的代码。我确保一切都是可见的= true但似乎我需要添加一个监听器或以某种方式欺骗它认为窗口已经调整大小以使其呈现。任何有想法如何解决这个问题的人？谢谢！

<mx:HBox visible="true" backgroundColor="#cccccc" id="facebookhbox" width="100%" height="100" horizontalAlign="center" verticalAlign="middle" verticalGap="0" verticalScrollPolicy="off">
        <mx:Canvas id="facebookcanvas" visible="true" x="0" y="0" width="650" height="80">
            <flexiframe:IFrame visible="true" y="0" x="0" id="facebookIFrame" source="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.examplelink.com&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" width="450" height="80"/>
        </mx:Canvas>
    </mx:HBox>

Answer 1

此处没有使用Flex IFrame的经验，但是在通用术语中，您可以使组件的大小无效或使显示列表无效，然后立即调用validate以强制LayoutManager重新计算元素及其子元素的大小（或者只是在显示列表无效的情况下绘制）：

我在这里看到的困难部分是弄清楚你究竟想要什么时候发生这种情况（即从滚动条捕获某种事件）。出于测试目的，您只需创建一个按钮，然后在其单击处理程序中执行以下操作：

facebookIFrame.invalidateSize();
facebookIFrame.invalidateDisplayList();
facebookIFrame.validateNow();

如果这样做，那么你只需要从Scroller或Canvas中找到适当的事件，告诉你何时发生滚动（最坏的情况是你可以捕获鼠标，然后标记一个标志，然后捕获mouseMove，如果设置了标志，则运行无效/重新验证的代码）。基本上布局/绘图的工作原理是UIComponents有标志让它知道何时需要重新计算某些内容的大小或重绘它，这样一切并不总是只重绘那些需要它的组件。在这种情况下，似乎FacebookIFrame在某些时候没有失效。让我知道我是否可以提供帮助，或者这是否有效。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="vertical"
                height="100%"
                width="100%"
                xmlns:code="http://code.google.com/p/flex-iframe/"
                mouseDown="application1_mouseDownHandler(event)"
                mouseUp="application1_mouseUpHandler(event)"
                mouseMove="application1_mouseMoveHandler(event)">

    <mx:Script>
        <![CDATA[
            var isMouseDown:Boolean;
            protected function button1_clickHandler(event:MouseEvent):void
            {
                // TODO Auto-generated method stub
                facebookIFrame.invalidateSize();
                facebookIFrame.invalidateDisplayList();
                facebookIFrame.validateNow();
            }
            protected function application1_mouseDownHandler(event:MouseEvent):void
            {
                isMouseDown = true;
            }
            protected function application1_mouseUpHandler(event:MouseEvent):void
            {
                isMouseDown = false;
            }
            protected function application1_mouseMoveHandler(event:MouseEvent):void
            {
                if(isMouseDown)
                {
                    facebookIFrame.invalidateSize();
                    facebookIFrame.invalidateDisplayList();
                    facebookIFrame.validateNow();
                }
            }
        ]]>
    </mx:Script>

    <mx:Spacer height="1000"/>
    <mx:Button label="Test Invalidation"
               click="button1_clickHandler(event)"/>
    <mx:HBox visible="true" backgroundColor="#cccccc" id="facebookhbox" width="100%" height="80" horizontalAlign="center" verticalAlign="middle" verticalGap="0" verticalScrollPolicy="off">
        <mx:Canvas id="facebookcanvas" visible="true" x="0" y="0" width="650" height="80">
            <code:IFrame visible="true" y="0" x="0" id="facebookIFrame" source="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.examplelink.com&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" width="450" height="80"/>
        </mx:Canvas>
    </mx:HBox>
</mx:Application>

更新为包含显示示例工作的完整应用程序，这绝不是一种好的处理方式，这是由于IFrame代码中的错误应该修复（虽然我不知道如何或在哪里这个bug存在的东西应该导致它在不适当的地方失效。

肖恩

Flex IFrame组件无法呈现在可视区域之外

1 个答案: