Skip to main content
B
buabco
Known Participant
June 28, 2010
Question

Wierd Errores When Adding TFL Elements

  • June 28, 2010
  • 1 reply
  • 1715 views

I've been trying to hack my way into TFL since I need some elements with special functionality. The two elements I would like to create are:

1.- A special button (NOTE: Not a flex button but a DisplayObject) that I can add with customized parameters into the textflow.

2.- A special kind of link that has an icon in the end (Like the external links of wikipedia).

I've been playing with 2 approaches but I have been facing this problems with both, I hope someone how knows the inner workings of TFL will be able to help me.

My first approach is to extend the leaf element in order to create my special elements, I started with a simple circle element, to see what this will mean in terms of things I'll have to program or extend. I used the InlineImageElement as a reference. It wasn't that hard to create a circle element once I solved how the exporter worked... in fact once I created the right importers and exporter functions and added them to the TextLayoutImporter I was able even to copy/paste my circle.

Quite cool until I found 2 mayor problems:

1.- Strangely, if I add a Sprite or whatever thing to a GraphicElement before it's added to the TextFlow, and this is in a RichTextEditor, it tends to disappear when you first click on the editor. If you add stuff after the first click there is no problem... if you change just 1 GraphicElement’s graphic property, this doesn't happen with all the graphicElements in the flow.

2.- Even more strange, if you create a different element from the ones in TFL and even if you add all the measuring functions, the first line of the RichTextEditor will not resize properly and the Sprite/Image/graphic will just go out of the top of the RichTextEditors , just as if there is no mask for it, this doesn't happen when is in another line rather than the first, also the whole thing scrolls properly (The circle out of the top will actually disappear from view once scrolled). Just to be sure of this, I just copied all the code of the InlineImageGraphic into another class and tried to use it, got the same error.

I'm not a 100% sure the first one is a bug, since there is not much documentation to extend TFL this can easily just be a simple problem of me not knowing when to update the GraphicElement. Still I got the same situation if I just set the GraphicElement’s graphic property with the same object it already has (Maybe that’s what RichTextEditor is doing’).

The second one clearly is a bug since there is something the Flow object does only if there is a InlineGraphicElement and it doesn’t check for other FlowElement’s with GraphicsElements in them to adjust sizes.

My second approach was tried after reading this forum and looking to some of the solutions, I just added some exporter and importer functions into the TextLayoutImporter that matched with some special tag. This functions turned the tag into a InlineGraphicElement with a Shape object that drew a circle inside.

This faced the first problem as before (Not the second though), but more so, I couldn’t turn the InlineGraphicElement back into my special tag since the exporter will map it as a img tag killing the copy paste functionality.

From what I've read I'm not the first one to try to extend the TFL objects, so I hope some of you can add to this discussion and let me know if I’m doing things right or if there are other solutions to the problem.

This topic has been closed for replies.

1 reply

B
buabcoAuthor
Known Participant
July 12, 2010

OK this is an update; on the second alternative I discovered a function to override the default behavior on the textLayoutImporter, this might allow me to solve the problem of turning back a InlineGraphicElement into a different tag from <img/>.

This is what I did:

TextLayoutImporter.defaultConfiguration.overrideIEInfo(....)

It should have worked, except there is a bug. The FlowElementInfo object does not have setter functions to its properties, so the use of this method gives back an error. Just to make things more dificult the TextLayoutExporter witch has all the exporting and importing functions of leafElements is marked private... how I'm supose to call them?

Also, I discovered that my personalized object disappears because its removed from stage during a cleanup process on the textFlow... strangely its not put back after removal (And this only happens the first time), anyone knows how the TextLineRecivcler and TextFlow treat the different leaf elements in this process? it's been really hard to follow this with the debugger.

R
Adobe Employee
rdermer
Adobe Employee
July 12, 2010

I don't think you are going to be successful with this approach.  Better would be to use existing TLF classes.  The things you want can be done with current available APIs.

For the button element you can do two things.

1) set userStyles using FlowElement.setStyle on the ILG to specify the various properties.

2) to draw the graphic use the inlineGrapihcResolverFunction API.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flashx/textLayout/elements/Configuration.html#inlineGraphicResolverFunction

Return the DisplayObject that you build.  Note: the Configuration of a TextFlow must be set when the TextFlow is constructed.  A Configuration can be passed to the TextFlow constructor or the importer.

The special link can be created by walking the XML before you import it and adding ILGs where they are needed.

Hope that helps,

Richard

B
buabcoAuthor
Known Participant
July 18, 2010

Richard,

Thanks for your answer, but the userStyles are general for the hole textFlow su I can't set properties especifically for a specified element, also can't be explicitly defined on the XML (Or am I wrong) how will this solution work with copy / paste?

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices