在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

回答

相關問題