Skip navigation
Currently Being Moderated

Text parse html <img> tag error when not set Text height

Mar 21, 2013 9:27 PM

Tags: #htmltext #flex4.5 #<img>

I use mx:Text parse html <img> tag :

 

<?xml version="1.0" encoding="utf-8"?>

<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009"

          xmlns:s="library://ns.adobe.com/flex/spark"

          xmlns:mx="library://ns.adobe.com/flex/mx"

          width="681" height="335"

          creationComplete="init();">

<fx:Script>

    <![CDATA[

    private function init():void {

        var t:Text = new Text();

        t.htmlText = "<img  src='http://www.oracle.com/ocom/groups/public/@otn/documents/digitalasset/1 906209.jpg' />";

        hg.addElement(t);

    }

    ]]>

</FX:Script>

<s:HGroup id="hg">

</s:HGroup>

</s:VGroup>

 

But Show only the part of image,please help

 
Replies
  • Currently Being Moderated
    Mar 26, 2013 7:44 AM   in reply to NoMan\'sLand

    Because you need to set the size of the Text field to something larger than the image.  And, since you are just adding text, you have to know what that size is, because you can't get it as part of the HTML container.

     

    i.e.  Set the Text item height and width

    protected function appl_creationCompleteHandler(event:FlexEvent):void
    {
     var t:Text = new Text();
     t.htmlText = "<img src='http://www.oracle.com/ocom/groups/public/@otn/documents/digitalasset/1906209.jpg' />";   
     t.height = 300;
     t.width = 200;
    
     hg.addElement(t);
    }
    
    

    And them make sure your HGroup is big enough to hold the Text item

     

    <s:HGroup id="hg" height="100%" width="100%" />
    

     

     

    An alternative would be to load the image and then after it is loaded, get the height and width of the loaded bitmap.  From there you can set the height and width of the Text contianer.

     

    protected function appl_creationCompleteHandler(event:FlexEvent):void
    {
     var imgLoader:Loader = new Loader();
     imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadProdComplete);
     imgLoader.load(new URLRequest("http://www.oracle.com/ocom/groups/public/@otn/documents/digitalasset/1906209.jpg"));
    }
    
     
    public function loadProdComplete(e:Event):void {
     var bit:Bitmap = e.target.content;
     if(bit != null) {
      bit.smoothing = true;
    
      var t:Text = new Text();
      t.htmlText = "<img src='http://www.oracle.com/ocom/groups/public/@otn/documents/digitalasset/1906209.jpg' />";   
      t.height = bit.height;
      t.width = bit.width;
      
      hg.addElement(t);
     } 
    }
    
     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points