Differences from fonts from 4.1 to 4.5

Question

I am currently updating the application from Flex 4.1 to 4.5

We noticed that the Arial font renders differently between the two versions when used on small sizes.

Here is a simple application example:

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx"; @font-face { src: url("/assets/fonts/ARIAL.ttf"); fontFamily: arial; embedAsCFF: true; } @font-face { src: url("/assets/fonts/ARIALBD.ttf"); fontFamily: arial; embedAsCFF: true; font-weight: bold; } global { font-family: arial; } </fx:Style> <s:Label text="Hello world" fontWeight="bold" x="20" y="20" /> </s:Application> 

When starting up with two different sdks, here is the font rendering image we get:

Please note that in 4.5 the font looks slightly compressed.

What is the reason for this and how to solve it?

Answer 1

My best guess is that it is related to the changes that have been made to support fonts on portable devices. To fix this, you may have to play a little with your settings.

CSS Media Queries
Now you can use @media rules in your style sheets to filter CSS rules based on device DPI classification. There are two properties that you can currently filter by os-platform and Application-inch. Here is an example of filtering on them to set the button font for example (from the Adobes prerelease documents):

 @media (os-platform: "Android") and (application-dpi: 240) { s|Button { fontSize: 10; } 

Answer 2

To fix this temporarily, simply specify SWF version 10 on flex-config.xml

 look for <swf-version>11</swf-version> and make that a 10 (the "target-player" tag remains as 10.2.0) 

This configuration will allow you to use the new API 10.2, but I think it will skip hardware optimization (maybe not StageVideo ... warning: I am not sure and have not tested yet. The only thing I did was check it, 10.2 specific methods were there like "requestSoftKeyboard")

I guess this problem is related to Adobe's new “sub-pixel text rendering” promoted in version 10.2 OR , maybe the new player just renders the text differently.

By the way, this problem is really ugly, small fonts become blurry, and medium-sized fonts become noticeably crushed!

Any real fix that allows us to orient SWF 11, please let us know.