2 Replies Latest reply on Jan 19, 2011 4:55 PM by drkstr_1

    Beautiful Text in Flex: Illustrator outlines or embedded fonts?

    William Spence Level 1

      I am making a flex application where there is a lot of 12pt text.  Right now, we are making the graphics with text in Illustrator and converting the text to outlines before importing into Flex.  Unfortunately, the text is looking a little fuzzy at the highest quality SWFs.  It is not horrible, but does not look 100% professional.  I am wondering if text would look any better if the font was embedded in our application and we used the advanced anti-aliasing feature.  Does anyone have any experience with the look of small text in Flex when imported as outlines vs. being embedded in the application?

       

      Thanks

        • 2. Re: Beautiful Text in Flex: Illustrator outlines or embedded fonts?
          drkstr_1 Level 4
          I am wondering if text would look any better if the font was embedded in our application and we used the advanced anti-aliasing feature.

           

          Yes, absolutely. Embeded fonts look very clean.

           

          It should take all of 5 mins to test it yourself.

           

          Slap the following into a css file and copy the font files from your system fonts (font path is relative to the CSS file location, unless it's in a library project).

           

           

          @font-face {
               src: url("assets/fonts/CALIBRI.TTF");
               fontFamily: "Calibri";
               embedAsCFF: true;
          }
          
          @font-face {
               src: url("assets/fonts/CALIBRIB.TTF");
               fontFamily: "Calibri";
               embedAsCFF: true;
               fontWeight: bold;
          }
          
          @font-face {
               src: url("assets/fonts/CALIBRII.TTF");
               fontFamily: "Calibri";
               embedAsCFF: true;
               fontStyle: italic;
          }
          
          @font-face {
               src: url("assets/fonts/CALIBRIZ.TTF");
               fontFamily: "Calibri";
               embedAsCFF: true;
               fontWeight: bold;
               fontStyle: italic;
          }
          

           

           

          Just assign Calibri to the fontFamily of any text and it will use the embeded version. If the text does not look crystal clear, then something got messed up.