2

Flex アプリケーションの外部でリッチ テキスト エディターを介して生成された HTML があり、それを Flex 内で表示したいと考えています。

HTML は単純な HTML タグ、スタイル、アンカー、場合によってはイメージ タグなどです。この HTML を flex でレンダリングできるコントロールはありますか?

任意のアイデアをいただければ幸いです...ありがとう。

4

4 に答える 4

3

HTML が非常に単純な場合は、通常のラベルまたはテキストエリア コンポーネントで表示できます。より複雑な場合は、この質問で回答した内容を引用します。そこでの議論にももう少し情報があります。

複雑な HTML と Javascript の場合、可能な方法の 1 つはHTMLComponentです。これは、フラッシュ上で iframe を使用して、HTML がアプリ内にあるように見せるメソッドです。ただし、この方法にはいくつかの欠点があります。そのほとんどはDeitte.comで詳しく説明されています。

これがオフラインで移動できる場合は、Air を使用できます (mx:HTML コンポーネントが組み込まれています)。Deitte.comにも、この手法の詳細が掲載されています。

于 2008-09-09T01:18:21.670 に答える
1

flexiFrameコントロールを使用する必要があります。これは100％フラッシュソリューションではなく、少しのjs呼び出しを組み合わせていますが、私にとっては完璧に機能します。

githubhttps://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 に答える
1

mx.controls.Labelandのドキュメントを確認してください(これは、またはFlex のコントロールにflash.text.TextFieldテキストを表示するものです)。ドキュメントには、TextLabelTextField

<img> タグを使用すると、外部の画像ファイル (JPEG、GIF、PNG)、SWF ファイル、およびムービー クリップをテキスト フィールド内に埋め込むことができます。テキスト フィールドに埋め込んだ画像の周囲にテキストが自動的に流れます。このタグを使用するには、テキスト フィールドを複数行に設定し、テキストを折り返す必要があります。

つまり、そのプロパティをタグを含む HTML にText設定することで、Flex のコンポーネントに画像を表示できます。は複数行ではないため使用できません。htmlText<img>Label

テキスト フィールドに表示される画像が、その周囲に流れるテキストと左または右に揃えられている場合、テキスト フィールドの高さを適切に測定するのに問題があることに気付きました (例: align="left")。位置合わせされた画像を使用する予定がある場合は、それに対抗するために下に余分なスペースを追加する必要がある場合があります。

于 2008-09-09T06:40:52.550 に答える
0

@mmattax

実際、TextArea コンポーネントに画像を表示できます。アプローチは完全に問題がないわけではありませんが...

于 2008-12-30T15:30:56.283 に答える