Skip to main content
P
poloop
Participant
February 8, 2010
Question

FontFamily Problem width dynamic textFlow

  • February 8, 2010
  • 1 reply
  • 2829 views

Hy,

When I create a TextFlow without use any component of the flex SDK (4.0.13827) and then I try to change or apply a FontFamily, it doesn't work. Whereas when I use a component like RichEditableText or Label, it works.

Bellow the code I wrote for my test : 

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
                            xmlns:s="library://ns.adobe.com/flex/spark"
                            xmlns:mx="library://ns.adobe.com/flex/mx"
                            creationComplete="creationCompleteHandler(event)"
                            width="800" height="600"
                            >
     <fx:Style>
          @11909012 s "library://ns.adobe.com/flex/spark";
          @11909012 mx "library://ns.adobe.com/flex/mx";
          @11909012 local "*";
          
          @11220649-face { 
               src:                         url("assets/Fonts/arial.ttf");
               fontFamily:                  ArialEmbedded;
               advandedAntiAliasing:      true;
               cff:                              true;
               unicodeRange:                U+0020-U+002F,U+0030-U+0039,U+003A-U+0040,U+0041-U+005A,U+005B-U+0060,U+0061-U+007A,U+007B-U+007E,U+00A1-U+00FF,U+2000-U+206F,U+20A0-U+20CF,U+2100-U+2183;
          }
          
          
          
          @11220649-face { 
               src:                         url("assets/Fonts/cour.ttf");
               fontFamily:                  CourierEmbedded;
               advandedAntiAliasing:      true;
               cff:                              true;
               unicodeRange:                U+0020-U+002F,U+0030-U+0039,U+003A-U+0040,U+0041-U+005A,U+005B-U+0060,U+0061-U+007A,U+007B-U+007E,U+00A1-U+00FF,U+2000-U+206F,U+20A0-U+20CF,U+2100-U+2183;
          }
          
          
          
          s|WindowedApplication
          {
               
          }
     </fx:Style>
     <fx:Script>
          <![CDATA[
               import flash.text.Font;
               import flash.text.engine.FontLookup;
               
               import flashx.textLayout.container.ContainerController;
               import flashx.textLayout.conversion.TextConverter;
               import flashx.textLayout.edit.EditManager;
               import flashx.textLayout.edit.IEditManager;
               import flashx.textLayout.elements.TextFlow;
               import flashx.textLayout.events.SelectionEvent;
               import flashx.textLayout.formats.TextLayoutFormat;
               import flashx.undo.UndoManager;
               
               import mx.collections.ArrayCollection;
               import mx.events.FlexEvent;
               
               import spark.core.SpriteVisualElement;
               import spark.events.IndexChangeEvent;
               
               private var dynTextFlow : TextFlow;
               private var ctTextFlow : TextFlow;

               protected function creationCompleteHandler(event:FlexEvent):void
               {
                    controlBarVisible=false;
                    
                    dynTextFlow = TextConverter.importToFlow("Hello World", TextConverter.PLAIN_TEXT_FORMAT);
                    drawTextBloc(dynTextFlow);
                    dynTextFlow.addEventListener(SelectionEvent.SELECTION_CHANGE, selectionChangeListener);
                    dynTextFlow.fontFamily = "ArialEmbedded";
                    dynTextFlow.fontLookup = FontLookup.EMBEDDED_CFF;
                    dynTextFlow.fontSize = 24;
                    dynTextFlow.interactionManager = new EditManager(new UndoManager());
                    dynTextFlow.flowComposer.updateAllControllers();
                    dynTextFlow.invalidateAllFormats();
                    dynTextFlow.flowComposer.updateAllControllers();
               }


               protected function cbFont_creationCompleteHandler(event:FlexEvent):void
               {
                    var fonts:ArrayCollection=new ArrayCollection(Font.enumerateFonts());
                    
                    cbFont.dataProvider=fonts;
               }

               protected function cbFont_changeHandler(event:IndexChangeEvent):void
               {
                    var cf : TextLayoutFormat = new TextLayoutFormat();
                    cf.fontLookup = FontLookup.EMBEDDED_CFF;
                    cf.fontFamily = ComboBox(event.currentTarget).selectedItem.fontName;
                    
                    IEditManager(ctTextFlow.interactionManager).applyLeafFormat(cf);
                    ctTextFlow.interactionManager.setFocus();
                    
               }
               
               private function drawTextBloc(txt : TextFlow) : void
               {
                    var container : SpriteVisualElement = new SpriteVisualElement();
                    var controller : ContainerController = new ContainerController(container, 300, 200);
                    addElement(container);
                    txt.fontLookup = FontLookup.EMBEDDED_CFF;
                    txt.fontFamily = "ArialEmbedded";
                    
                    txt.flowComposer.addController(controller);
               }
               
               private function selectionChangeListener(event : SelectionEvent) : void
               {
                    ctTextFlow = event.currentTarget as TextFlow;
               }


               protected function txt_selectionChangeHandler(event:FlexEvent):void
               {
                    ctTextFlow = (event.currentTarget as RichEditableText).textFlow;
               }

          ]]>
     </fx:Script>
     <fx:Declarations>
          <!-- Place non-visual elements (e.g., services, value objects) here -->
     </fx:Declarations>
     <s:layout>
          <s:VerticalLayout paddingLeft="10" paddingTop="10"/>
     </s:layout>
     <s:RichEditableText x="10"
                              y="10"
                              selectionChange="txt_selectionChangeHandler(event)"
                              paddingTop="5" paddingLeft="5" paddingRight="5" paddingBottom="5"
                              id="txt"
                              fontFamily="CourierEmbedded" 
                              text="RichEditableText"
                              height="200"
                              width="350"/>
     <s:ComboBox id="cbFont"
                    labelField="fontName"
                    creationComplete="cbFont_creationCompleteHandler(event)"
                    change="cbFont_changeHandler(event)"
                    />
     <s:Label text="TEST" fontFamily="CourierEmbedded" fontSize="22" rotation="45"/>

</s:WindowedApplication>

 
This problem appears when I update my flex sdk version.
Please, help me...
Thank you very much...
This topic has been closed for replies.
1 reply
R
Adobe Employee
robin_briggs
Adobe Employee
February 9, 2010
In your version that does not use Flex components, are you still using an embedded font? If so, can you tell me how you set it up?
Thanks,
- robin
P
poloopAuthor
Participant
February 9, 2010
Yes, I'm using an embedded font defined in the style section of the mxml : 
<fx:Style>
          @namespace s "library://ns.adobe.com/flex/spark";
          @namespace mx "library://ns.adobe.com/flex/mx";
          @namespace local "*";
          
          @font-face { 
               src:                         url("assets/Fonts/arial.ttf");
               fontFamily:                  ArialEmbedded;
               advandedAntiAliasing:      true;
               cff:                              true;
               unicodeRange:                U+0020-U+002F,U+0030-U+0039,U+003A-U+0040,U+0041-U+005A,U+005B-U+0060,U+0061-U+007A,U+007B-U+007E,U+00A1-U+00FF,U+2000-U+206F,U+20A0-U+20CF,U+2100-U+2183;
          }
          
          
          
          @font-face { 
               src:                         url("assets/Fonts/cour.ttf");
               fontFamily:                  CourierEmbedded;
               advandedAntiAliasing:      true;
               cff:                              true;
               unicodeRange:                U+0020-U+002F,U+0030-U+0039,U+003A-U+0040,U+0041-U+005A,U+005B-U+0060,U+0061-U+007A,U+007B-U+007E,U+00A1-U+00FF,U+2000-U+206F,U+20A0-U+20CF,U+2100-U+2183;
          }
          
          
          
          s|WindowedApplication
          {
               
          }
   </fx:Style>
 then in the creationComplete function of the application, I create a textFlow object :
 protected function creationCompleteHandler(event:FlexEvent):void
 {
     controlBarVisible=false;
                    
     dynTextFlow = TextConverter.importToFlow("Hello World", TextConverter.PLAIN_TEXT_FORMAT);
     drawTextBloc(dynTextFlow);
     dynTextFlow.addEventListener(SelectionEvent.SELECTION_CHANGE, selectionChangeListener);
     dynTextFlow.fontFamily = "ArialEmbedded";
     dynTextFlow.fontLookup = FontLookup.EMBEDDED_CFF;
     dynTextFlow.fontSize = 24;
     dynTextFlow.interactionManager = new EditManager(new UndoManager());
     dynTextFlow.flowComposer.updateAllControllers();
     dynTextFlow.invalidateAllFormats();
     dynTextFlow.flowComposer.updateAllControllers();
 }
private function drawTextBloc(txt : TextFlow) : void
{
    var container : SpriteVisualElement = new SpriteVisualElement();
    var controller : ContainerController = new ContainerController(container, 300, 200);
    addElement(container);
    txt.fontLookup = FontLookup.EMBEDDED_CFF;
    txt.fontFamily = "ArialEmbedded";
                    
    txt.flowComposer.addController(controller);
}


I can change the fontSize, color but not assign is fontFamily to one of my embedded font....
I don't understand why... It's so wired...
R
Adobe Employee
robin_briggs
Adobe Employee
February 11, 2010
What if you were to use the Embed metadata instead of @font-face to embed the font? I'm wondering if the compiler is optimizing out the embedded font because the CSS style isn't applied anywhere.
Can you try instead something like this?
[Embed(mimeType="application/x-font", exportSymbol="myArial_normal", embedAsCFF="true", source="arial.ttf", fontName="arialEmbedded")]
 
 
- robin

        
                                                

        

    


            

                                        

            
                        

                                                                                                            
            







        

                    

    
    





    


                                        

                                                        

            
        
    






                                    
Terms & ConditionsAccessibility statement

            
        



        
            
    
        
    
        



        
        
        


        


        
        
        
        
                                                        

                            
    

                    

  

    

      
        
      
    

    

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