Skip to main content
M
Melzi94270
Known Participant
December 9, 2009
Question

[Novice] CSS Style and TLF (span flowElement)

  • December 9, 2009
  • 1 reply
  • 1397 views

Hi everybody !

I read the CSSFormatResolver and the SimpleEditorWithCSS / SimpleEditorPanel... and I am totally lost ! I need some explaination

.h1{
  
    background-color: #ffffff;
    font-family: CaptionFont;
    color: #999999;
    font-size: 16;
}

In my appliction :

First case: The user selects characters into the textflow, choose a style in a combobox

1)This userStyle is applyed to selected characters.

I saw function in the SimpleEditorPanel :

private function performStyleOperation(newData:String,operationClass:Class):void

Does it apply the css style h1 to my span element (and display it) ?

This function is a little difficult for me.. something more simple exists?


2)Then I convert my textLayoutFormat into an xml (and here I want my styleName property into the right span element)

To give a styleName to an flow element, I just have to do

myflowElement.stylename = "h1";

and it will appear into my xml ? <span styleName="myStyle"> (without other properties like fontFamily, fontSize etc, which are already in myStyle?)

Second case: My user open a saved document. I convert a string (which contains<TextFlow>...</TextFlow>) to a TextLayoutFormat

TextConverter.export(_textFlow, TextConverter.TEXT_LAYOUT_FORMAT, ConversionType.STRING_TYPE),

and  I want to applyied the styleName (so the equivalent css style) property to its owner (span element) and display it.

<span styleName="h1">Il était un petit navire</span>

I have to use also performStyleOperation after my export?

I don't understand how does it work really. Sorry for the disturbance and my english mistakes.

Thank you for your help, and have a good day


This topic has been closed for replies.

1 reply

M
Melzi94270Author
Known Participant
December 10, 2009

Nobody can explain me?

R
Adobe Employee
rdermer
Adobe Employee
December 10, 2009

Sorry for the delay.

1) performStyleOperation uses the current Level setting in the UI to decide where it will apply the passed in style or id.  The operationClass parameter tells it what it is doing.

2) styleNames roundtrip through the XML markup.  They don't get lost when XML is converted to a String.

Richard

M
Melzi94270Author
Known Participant
December 11, 2009

Thanks for your answer Richard.

So, performStyleOperation(newData:String,operationClass:Class):void apply the choosen style on characters . Is it applied thanks to styleName Property?

But how the <span styleName="MyStyle"> is created? When I will convert my text layout format to an xml format, it will be automatic? "newData" is it the name of the css style we want to apply?

I don't understand how it is working.

    Here we attach a nex format resolver :
                    editor.textFlow.formatResolver = new CSSFormatResolver();

And here we load the swf (css)

StyleManager.loadStyleDeclarations(styleSheetToLoad);

But what is the link between the two?


in CSSFormatResolver:

private function addStyleAttributes(attr:TextLayoutFormatValueHolder, styleSelector:String)

add a nexw property on the TextLayoutFormat.

I don't understand what is doing these functions:

  /** Calculate the TextLayoutFormat style for a particular element. */
         public function resolveFormat(elem:Object):ITextLayoutFormat
/** Calculate the user style for a particular element. */
         public function resolveUserFormat(elem:Object,userStyle:String):*

I saw on SimpleText exemple that :

<flow:TextFlow xmlns:flow="http://ns.adobe.com/textLayout/2008" fontSize="14" textIndent="15" marginBottom="15" paddingTop="4" paddingLeft="4">
    <flow:p><flow:span>There are many </flow:span><flow:span fontStyle="italic">such</flow:span><flow:span> lime-kilns in that tract of country, for the purpose of burning the white marble which composes a large part of tas burning.</flow:span></flow:p>
   </flow:TextFlow>

What is the element "flow:" before each FlowElement? Is it a style? Or the style is only in styleName?

Sorry for all these questions. But there isn't tutorial or complete explanations on the web (just the Editor code),  and mechanisms of this "Simple"Editor are very obscure for me.

I don't understand the global mechanism of formatResolver and CSS Style in TFL. :'(

I am totally lost :'(

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