Skip to main content
Participant
April 28, 2011
Question

TLF rendering issue when viewed in browser

  • April 28, 2011
  • 2 replies
  • 1388 views

Hello,

I'm running into an issue, where publishing my project within the Flash IDE, the TextFlow seems to render as expected. However, when viewed in a browser, the TextFlow seems to render the later part of the string in what appears to be the bold font.

Here is my code::

            var _origStr:String=<p>Here is some bold text and some text following the bolded text. Here is an inline image <img src="images/myImage.png"                                              width="25" height="12" />. <br /><br />Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor                                              incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip                                              ex ea commodo consequat. <a href="http://google.com">Test Link</a></p>"

            //create format object
            var textLayoutFormat:TextLayoutFormat = new TextLayoutFormat();
            textLayoutFormat.color = 0xffffff;
            textLayoutFormat.fontSize = 12;
           
            var linkHoverFormat:TextLayoutFormat = new TextLayoutFormat();
            linkHoverFormat.color = 0x879637;
           
            var linkActiveFormat:TextLayoutFormat = new TextLayoutFormat();
            linkActiveFormat.color = 0x879637;
           
            var linkNormalFormat:TextLayoutFormat = new TextLayoutFormat();
            linkNormalFormat.color = 0x165788;
           
            // create a container and a controller for it
            var config:Configuration=new Configuration();
            config.textFlowInitialFormat=textLayoutFormat;  
            config.defaultLinkHoverFormat=linkHoverFormat;
            config.defaultLinkNormalFormat=linkNormalFormat;
            config.defaultLinkActiveFormat=linkActiveFormat;

            var textFlow:TextFlow = TextConverter.importToFlow(_origStr, TextConverter.HTML_FORMAT, config);           
            trace(TextConverter.export(textFlow, TextConverter.TEXT_LAYOUT_FORMAT, ConversionType.XML_TYPE));
            if(_origStr.indexOf("</a>")>-1){
                textFlow.addEventListener(FlowElementMouseEvent.CLICK, doHTMLLink);
            }
            textFlow.flowComposer.addController(new ContainerController(this,_targetWidth,_targetHeight));
            textFlow.flowComposer.updateAllControllers();

Am I missing something? Any ideas / suggestions is greatly appreciated!

Cheers!

- MB

This topic has been closed for replies.

2 replies

Adobe Employee
April 29, 2011

Through TextConverter.TEXT_FIELD_HTML_FORMAT, it looks all right on firefox and IE.

By the way, I am using FlashBuilder 4.5 premium, firefox4, and IE9 .

Participant
April 29, 2011

Hi Jin-Huang,

Thanks for the reply.

I will mention that I am not using Flex at all, as this is strictly a Flash project.

As for the "HTML_FORMAT", I came across this somewhere (can't recall where) so I tried it out. Using the proper "TextConverter.TEXT_FIELD_HTML_FORMAT" constant, Flash produces the following error:

----

1119: Access of possibly undefined property TEXT_FIELD_HTML_FORMAT through a reference with static type Class.

----

I will also note that I have placed my "textLayout.swc" in the "$(AppConfig)/ActionScript 3.0/libs" folder which is defined in the Publish Settings > Library Path option.

Participating Frequently
April 30, 2011

The following is the whole codes we used to reproduce your issue. Hope it will be helpful:

package

{

import flash.display.Sprite;

import flashx.textLayout.TextLayoutVersion;

import flashx.textLayout.container.ContainerController;

import flashx.textLayout.container.ScrollPolicy;

import flashx.textLayout.container.TextContainerManager;

import flashx.textLayout.edit.EditManager;

import flashx.textLayout.elements.FlowElement;

import flashx.textLayout.elements.LinkElement;

import flashx.textLayout.elements.ParagraphElement;

import flashx.textLayout.elements.SpanElement;

import flashx.textLayout.elements.TextFlow;

import flashx.textLayout.formats.TextLayoutFormat;

import flashx.textLayout.elements.Configuration;

import flashx.textLayout.conversion.*;

public class Testviewedbrowser extends Sprite

{

public function Testviewedbrowser()

{

super();

var _origStr:String="<p>Here is some bold text and some text following the bolded text. Here is an inline image <img src='images/myImage.png' width='25' height='12' />. <br /><br />Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <a href='http://google.com'>Test Link</a></p>";

            //create format object

            var textLayoutFormat:TextLayoutFormat = new TextLayoutFormat();

            //textLayoutFormat.color = 0xffffff;

            textLayoutFormat.fontSize = 12;

            var linkHoverFormat:TextLayoutFormat = new TextLayoutFormat();

            linkHoverFormat.color = 0x879637;

            var linkActiveFormat:TextLayoutFormat = new TextLayoutFormat();

            linkActiveFormat.color = 0x879637;

            var linkNormalFormat:TextLayoutFormat = new TextLayoutFormat();

            linkNormalFormat.color = 0x165788;

            // create a container and a controller for it

            var config:Configuration=new Configuration();

            config.textFlowInitialFormat=textLayoutFormat;  

            config.defaultLinkHoverFormat=linkHoverFormat;

            config.defaultLinkNormalFormat=linkNormalFormat;

            config.defaultLinkActiveFormat=linkActiveFormat;

            var textFlow:TextFlow = TextConverter.importToFlow(_origStr, TextConverter.TEXT_FIELD_HTML_FORMAT, config);           

            trace(TextConverter.export(textFlow, TextConverter.TEXT_LAYOUT_FORMAT, ConversionType.XML_TYPE));

/*

            if(_origStr.indexOf("</a>")>-1){

                //textFlow.addEventListener(FlowElementMouseEvent.CLICK, doHTMLLink);

            }

*/

            textFlow.flowComposer.addController(new ContainerController(this, 400, 200));

            textFlow.flowComposer.updateAllControllers();

}

}

}

Adobe Employee
April 29, 2011

Is TextConverter.HTML_FORMAT implemented by yourself?


In TLF, There are only  *TextConverter.TEXT_FIELD_HTML_FORMAT*, *TextConverter.PLAIN_TEXT_FORMAT*, *TextConverter.TEXT_LAYOUT_FORMAT*.