在Flex应用程序中显示HTML

我有一些HTML是通过我的Flex应用程序以外的Rich Text Editor生成的，但希望在Flex中显示它。在Flex应用程序中显示HTML

HTML是简单的HTML标签，像样式，锚点和可能的图像标签，有没有一个控件可以让我在flex中呈现这个HTML，或者我将不得不卷起袖子并自己滚动？

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

2008-09-09 mmattax

如果HTML 真的简单，你可以在一个正常的标签或文本区域组件显示它，如果它是比较复杂的，我会引用我的回答in this question。那里的讨论还有一些信息。

如果是复杂的HTML和Javascript，一种可能的方式是HTMLComponent，即使用iframe在你的闪光，使它看起来像HTML是在你的应用程序的方法。然而，这种方法有一些缺点 - 其中大多数详细描述为at Deitte.com。

如果这可以脱机，您可以使用Air（它内置了一个mx：HTML组件）。 Deitte.com也有这种技术的细节。

来源

2008-09-09 01:18:21

检查出mx.controls.Label和flash.text.TextField文档（这是显示在Flex中Text或Label控制文本）。该TextField文档指出

的<IMG>标签可以让你嵌入到文本字段外部图像文件（JPEG，GIF，PNG），SWF文件和影片剪辑。文本会自动在您嵌入文本字段中的图像周围流动。要使用此标签，您必须将文本字段设置为多行并包装文本。

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

我注意到，如果文本字段中显示的图像左右对齐（例如align="left"），文本字段在正确测量高度时会遇到问题。如果您打算使用对齐的图像，则可能需要在下面添加一些额外的间距以对抗该问题。

来源

2008-09-09 06:40:52 Theo

@mmattax

事实上，您可以在TextArea组件中显示图像。方法is not entirely without problems though ...

来源

2008-12-30 15:30:56

您将不得不使用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-03 13:00:09

在Flex应用程序中显示HTML

回答

相关问题