• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Graphics scaling issues in Flash Builder 4.5.1

Guide ,
Aug 20, 2011 Aug 20, 2011

Copy link to clipboard

Copied

Please review this screen shot. Details follow the image.


scaling.jpg

FB 4.5.1

applicationDPI = "160"

Graphics using MultiDPIBitmapSource scale fairly well.

Graphics used for these properties do not scale well at all:

1) ViewMenuItem's "icon" property.

2) List itemRenderer IconItemRenderer "decorator" property.

3) TabbedViewNavigatorApplication's "splashScreenImage" property.

These graphics assets end up with horrible scaling artifacts, making them unusable. So, I cannot use icons with Menus or Lists or a splash image.

I've reviewed all of Adobe's documentation and followed all of their recommendations for creating graphics assets for use in a mobile applications. Simple graphics with no curved lines or angles less than 90 degrees scale well. Anything else does not.

Attached is a screen shot comparing the scaling issues at 160, 240 and 320 dpi with applicationDPI = "160". It is using an FXG graphic created in Illustrator CS5.5.

The FXG graphic was embedded in the s:IconItemRenderer  like this: decorator = "{images.arrow_list_icon}".

For testing purposes, I also tried switching the decorator at runtime based on the applicationDPI, but of course this fails as the application still scales the graphic whenever the application's applicationDPI property is specified.

<s:List>
<s:itemRenderer>
<fx:Component>
<s:IconItemRenderer
decorator = "{chooseDecorator()}"

<fx:Script>
//This code selects a different FXG asset based on the DPI reported at runtime.

import images.arrow_list_icon160;
import images.arrow_list_icon240;
import images.arrow_list_icon320;
import mx.core.FlexGlobals;

protected function chooseDecorator():Class {
    var rtnVal:Class;
    switch (FlexGlobals.topLevelApplication.runtimeDPI) {
        case mx.core.DPIClassification.DPI_160:
            rtnVal=images.arrow_list_icon160;
            break;
        case mx.core.DPIClassification.DPI_240:
            rtnVal=images.arrow_list_icon240;
            break;
        case mx.core.DPIClassification.DPI_320:
            rtnVal=images.arrow_list_icon320;
            break;
    }
    return rtnVal;
}
</fx:Script>
...

Has anyone come up with methods which can be used to avoid scaling issues with these items when setting the applicationDPI property?

Views

812

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Aug 22, 2011 Aug 22, 2011

Copy link to clipboard

Copied

LATEST

Chances are that you'll get better answers for this question on the Flex general discussion forum. This forum is visited more by engineers on the tooling team while the latter has people from the Flex SDK team.

-Anirudh

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines