Skip to main content
C
cash0
Participating Frequently
June 17, 2009
Answered

Styling TextFlow elements with CSS

  • June 17, 2009
  • 1 reply
  • 1787 views

I'm just trying to get my head around how to style individual elements of the TextFlow as you would in HTML/CSS where your markup contains no styling information - just pure markup. And the CSS formats the elements when you output the text.

Specifically I want to put a BackgroundColor on my LinkElements.

I started off exploring the Configuration class with its linkNormalFormatDefault and linkHoverFormatDefault properties. That worked basically, except I couldn't get a background color to show, and it inserted a bunch of styling tags baked into the markup - so if I was to save that markup to a database those styles would still be there the next time I rendered it.

So in order to keep the markup clean and free of built in styling I've been exploring the SimpleEditorWithCSS example that comes with the framework as an example. It uses textFlow.formatResolver to covert css styles to their associated formats in the TextFlow. Seems cool and just what I want, except I can't seem to style the links (or the <flow:a href tags). I've altered the CSSFormatResolver.as to try to get it to style the LinkElements but can't seem to.

Is there some easier way to go about this?

This topic has been closed for replies.
Correct answer rdermer

The issue is that backgroundColor only applies when it is set on a LeafElement and backgroundColor doesn't inherit by default.

You could solve this with the formatResolver by checking each element's parent chain for a LinkElement and then returning a TextLayoutFormat with backgroundColor="inherit".

Then the LeafElement's will inherit the backgroundColor from the LinkElements.

I don't see that setting Configuration.linkNormalFormatDefault etc. effects the export.  It does effect the export if you set the property on a FlowElement.  Note that the Configuration must be created and initialized before passing it to the TextFlow constructor.  Any changes after that won't be seen by the new TextFlow.

Hope that helps,

Richard

1 reply

R
Adobe Employee
rdermerCorrect answer
Adobe Employee
June 18, 2009

The issue is that backgroundColor only applies when it is set on a LeafElement and backgroundColor doesn't inherit by default.

You could solve this with the formatResolver by checking each element's parent chain for a LinkElement and then returning a TextLayoutFormat with backgroundColor="inherit".

Then the LeafElement's will inherit the backgroundColor from the LinkElements.

I don't see that setting Configuration.linkNormalFormatDefault etc. effects the export.  It does effect the export if you set the property on a FlowElement.  Note that the Configuration must be created and initialized before passing it to the TextFlow constructor.  Any changes after that won't be seen by the new TextFlow.

Hope that helps,

Richard

C
cash0Author
Participating Frequently
June 19, 2009

Yep, setting the background color to inherit has done the trick. I did what you said about checking the element's parent to see if it's a LinkElement from within the formatResolver.

Thanks.

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