2

我有一些 HTML 是通过我的 Flex 应用程序外部的富文本编辑器生成的，但想在 Flex 中显示它。

HTML 是简单的 HTML 标签，例如样式、锚点和可能的图像标签，是否有控件可以让我在 flex 中呈现此 HTML，还是我必须卷起袖子自己动手？

任何想法表示赞赏...谢谢。

4

4 回答 4

3

如果 HTML真的很简单，你可以在普通的 label 或 textarea 组件中显示它，如果它更复杂，我会引用我在这个问题中回答的内容。那里的讨论也有更多信息。

如果它是复杂的 HTML 和 Javascript，一种可能的方法是HTMLComponent，一种在 Flash 上使用 iframe 的方法，使其看起来就像 HTML 在您的应用程序中一样。然而，这种方法也有一些缺点——其中大部分都在 Deitte.com上进行了详细描述。

如果它可以离线，你可以使用 Air（它有一个内置的 mx:HTML 组件）。Deitte.com也详细介绍了这种技术。

于 2008-09-09T01:18:21.670 回答
1

查看 and 上的文档mx.controls.Label（flash.text.TextField这是在 Flex中的 aText或控件中显示文本的内容）。Label该TextField文件指出

<img> 标签允许您在文本字段中嵌入外部图像文件（JPEG、GIF、PNG）、SWF 文件和影片剪辑。文本会自动围绕您嵌入文本字段的图像流动。要使用此标签，您必须将文本字段设置为多行并换行。

这意味着您可以通过将其属性设置为包含标签的某些 HTML 来Text在 Flex 中的组件中显示图像。您不能使用，因为它不是多行的。htmlText<img>Label

我注意到，如果文本字段中显示的图像与围绕它们的文本左对齐或右对齐（例如align="left"），则文本字段无法正确测量其高度。如果您打算使用对齐的图像，您可能需要在下面添加一些额外的间距来应对这种情况。

于 2008-09-09T06:40:52.550 回答
1

您将不得不使用 flex iFrame 控件。它不是一个 100% 的 flash 解决方案，它结合了一些 js 调用，但对我来说非常完美。

您可以从 github https://github.com/flex-users/flex-iframe获取最新的源代码

这是组件作者的一些示例代码。

<!---
    A basic example application showing how to embed a local html page in a Flex application.

    @author Alistair Rutherford
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
                xmlns:flexiframe="http://code.google.com/p/flex-iframe/"
                horizontalAlign="center"
                verticalAlign="middle"
                viewSourceURL="srcview/index.html">

    <!-- Example project presentation -->
    <mx:ApplicationControlBar dock="true">
        <mx:Text selectable="false">
            <mx:htmlText><![CDATA[<font color="#000000" size="12"><b>flex-iframe - Simple html example</b><br>This example shows how to embed a simple Html page in a Flex application.</font>]]></mx:htmlText>
        </mx:Text>
    </mx:ApplicationControlBar>

    <!-- HTML content stored in a String -->
    <mx:String id="iFrameHTMLContent">
        <![CDATA[
            <html>
                <head>
                    <title>About</title>
                </head>
                <body>
                    <div>About</div>
                    <p>Simple HTML Test application. This test app loads a page of html locally.</p>
                    <div>Credits</div>
                    <p> </p>
                    <p>IFrame.as is based on the work of</p>
                    <ul>
                      <li><a href="http://coenraets.org/" target="_top">Christophe Coenraets</a></li>
                      <li><a href="http://www.deitte.com/" target="_top">Brian Deitte</a></li>
                    </ul>
                </body>
            </html>
        ]]>
    </mx:String>

    <!-- Example using the 'source' property -->
    <mx:Panel title="A simple Html page embedded with the 'source' property"
              width="80%"
              height="80%">

        <flexiframe:IFrame id="iFrameBySource"
                           width="100%"
                           height="100%"
                           source="about.html"/>
    </mx:Panel>

    <!-- Example using the 'content' property -->
    <mx:Panel title="A simple Html page embedded with the 'content' property"
              width="80%"
              height="80%">

        <flexiframe:IFrame id="iFrameByContent"
                           width="100%"
                           height="100%"
                           content="{iFrameHTMLContent}"/>
    </mx:Panel>

</mx:Application>
于 2012-04-03T13:00:09.483 回答
0

@mmattax

Indeed you can display images in a TextArea component. The approach is not entirely without problems though...

于 2008-12-30T15:30:56.283 回答