Tag Archives: Flex

This article was originally written in English. Text in other languages is provided via machine translation.

When working with Flash based applications, there are issues with fonts since the specified fonts might not exist on the user machine. The problem is compounded when you have international users each of whom might be working on multiple operating systems (Windows, Mac), multiple versions (Win XP, Win7, Win8, Mac 10.6, and Mac 10.7), multiple locales (French, Italian, Spanish, Russian etc) and thus having different available system fonts. One option to streamline the experience would be to embed fonts – entire fonts or specific subset of characters from a font. The other option would be to use the operating system’s default fonts.

Adobe’ installer and licensing components (which goes out with Master Collection and almost all point products like Photoshop, InDesign, and Illustrator) uses the later approach. The component identifies user’s locale from OS locale and then picks up a font from a prioritized list of pre-defined list of fonts for that locale. The font specification file has been externalized so that any future changes around font names could be easily verified and accommodated without making a code change. Further the list has been segregated based on font fall-back for text appearing in software UI and for text fields in the application.

The list of fonts for each locale is listed towards the end of this blog post. Getting to this list has not been an easy task and there has been a huge effort from multiple teams for this. Some of the hurdles that the team had to clear were –

Getting an exhaustive set of fonts used in each locale and OS

Segregating the fonts according to UI and Text fall-back

Putting those fonts and fall-back logic together in an xml file

Identifying the font’s priority so that same logic works across all OS platforms and versions

Working with linguists to test each screen with applied fonts for readability and aesthetics

Iterating #3 and #4 based on linguist’ response and ultimately arriving at final font fall-back xml file

One caveat to note here is that system fonts keep changing from time to time, which usually amounts to new fonts, or new versions of existing fonts, but sometimes results in existing fonts becoming deprecated. In general, though, linguistic support in OSes, in terms of glyph coverage in bundled fonts, gets better, not worse.

This article was originally written in English. Text in other languages was provided by machine translation.

In my previous blog article http://blogs.adobe.com/globalization/invoking-icu-from-adobe-air-applications-2, I demonstrated using the AIR3 ActionScript Native Extensions feature to invoke ICU from an AIR application. I used the AIR developer tools to compile and build various components. In this article, I demonstrate the same using the prerelease version of Adobe Flash Builder 4.6. It is much simpler to do this in Flash Builder avoiding the cumbersome command line.

The prerelease version of Adobe Flash Builder4.6 has a new Flex SDK version 4.5.2, which has AIR3 integrated. Please download the sample files as follows.

For simplicity, place the AirIcuExtension.dll, ICU dlls and extension.xml files in AirIcuExtensionbin folder. All these files are packaged into a zipped archive called AiricuExtension.ane using the following command.

Using Adobe FlashBuilder4.6 or C:FB4.6sdksbinadt program, one can generate an AIR certificate.

The output is an archive file AirIcuExtension.ane in the AirIcuExtensionbin folder.

1.3 Building the Test program AirIcuExtensionTest.mxml

Now that we built and packaged the native extension package AiricuExtension.ane, we are ready to use this and call ICU services in a test program.

The folder AirIcuExtensionTestsrc contains the test file AirIcuExtensionTest.mxml. The descriptor file AirIcuExtensionTest-app.xml has the details of native extension.

Flash builder4.6 has a new feature to link Flash applications with ANE files. As you see from the FB4.6 project properties ‘Flex Build Path’ command, there is a new tab for Native Extensions. Using ‘Add ANE’ button, add the AirIcuExtension.ane file present in the AirIcuExtension/bin folder as shown below.

Also see the ‘Flex Building Package’ command in the project properties, there is a new tab for Native Extension. Please make sure that the check box for AiricuExtension is On.

The output swf file AirIcuExtensionTest.swf is placed in the bin-debug folder.

1.4 Building AIR package for executing AirIcuExtensionTest

The final step is to package the above AirIcuExtensionTest .swf and AirIcuExtension.ane files into an AIR executable folder. We can do this in FB4.6 now instead of using tedious command line.

In the ensuing dialog, choose Signed native installer radio button. We can only create native installers as we are using OS specific ANE package.

In the Native Extensions tab, make sure that the AirIcuExtension.ane checkbox is On.

Finish creating the release build after entering the correct AIR certificate credentials.

The output of the above command is an installer AirIcuExtensionTest.exe. By executing it, you can install the test program.

2 Conclusion

The sample illustrated how to invoke ICU from ActionScript. The AIR ICU extension is easy to build using the upcoming AdobeFlash Builder 4.6 release. ANE is a great feature for AIR developers and AIR applications can make use of the platform or ICU provided globalization services.

This article was originally written in English. Text in other languages was provided by machine translation.

Dates can be formatted in various calendars in the Flex SDK. Let’s explore how it works.

Flex SDK lets you format a given date in “alternate calendars” besides the Gregorian calendar. The industry convention refers all non-Gregorian calendars as alternate calendars. To use an alternate calendar, it requires a little bit of care in your Flex application.

Types of calendars

Before we dive into the alternate calendar usages in the Flex SDK, let’s take a brief look at a couple of calen­dars of the world so that you get familiar with what this calendar talk is about. Please be aware, I can only describe the basic usages of some common alternate calendars. There are complexities behind each of the calendars and I may not be explicitly state them. Investigate fur­ther before you actually use them.

Gregorian calendar

This is the calendar most systems provide as the standard. You probably know this calendar already but here are some of the characteristics: There are always twelve months in a year and each month has 28 to 31 days. The numbers of days in each of the months are fixed (30 or 31 days) except for the second month (February), which includes 28 (non-leap years) or 29 days (leap years). The number of days in a year is fixed (365 or 366 days).

Islamic calendar (Hijri calendar)

Islamic calendar is one of the lunar calendars. There are always twelve months in a year. Each month has ei­ther 29 or 30 days. Beginning of a month is determined by observing the moon phase (Islamic religious calendar). Because of this nature, it is not very possible to predict the dates with the Islamic religious calendar. For the sake of convenience, there is the variant of the calendar, Islamic civil calendar, which determines the dates through some pure mathematical calculation. Islamic civil calendar may not be accurate for religious events. Number of days in a year is 354 or 355 days. Hence, the Islamic calendar year and the Gregorian calendar year are not synchronized.

Japanese calendar

Japanese calendar is very similar with the Gregorian calendar. The difference is the era part and the year. The Gregorian calendar has been using the same era name for the past 2,000 years (AD; Anno Domini). There is also BC (Before Christ) era but BC years are not by supported by pretty much all calendar apps. On the other hand, Japanese calendar era name changes when there is new emperor. Therefore, every ten to a couple of ten years, there are new eras. *1

*1 Before the 1868, the era name changes were more frequent, an era lasted only as low as two years. But just like the BC in Gregorian, there is not much demand to be able to deal with the older eras in today’s calendar applica­tions.

There are much more types of calendars in the world but I hope you got some ideas how calendars can vary.

How to use the alternate calendars in Flex SDK

Now let’s look at the usage of alternate calendars. How do you use calendar other than the Gregorian in the Flex SDK? The an­swer is to use the locale ID.

The locale ID can optionally contain calendar tag. For example:

Locale ID

Meaning

ar-SA

Arabic used in Saudi Arabia

ar-SA@calendar=islamic

Arabic used in Saudi Arabia. Islamic calendar

en-US@calendar=islamic

English used in the U.S. Islamic calendar.

When you need to format a date in an alternate calendar, the calendar tag can be appended to the locale ID. Here is an example:

Please note that the result may vary depending on the run-time platforms.

Limitations you should be aware of

There are couples of limitations in the current Flash Player and Flex SDK for alternate calendar support.

The Date class can handle only Gregorian dates.

The Spark DateTimeFormatter class can format a Date object but parsing feature (translating a formatted Gregorian or non-Gregorian date string into a Date object) is not available. English Gregorian date string can be parsed through the Date class constructor in some degree.

The availability of alternate calendar support and its behavior is platform dependent. Please check the plat­form if the alternate calendar support is important for your application.

If you would like to know more about alternate calendars, the calendar entries on Wikipedia is a good source.

This article was originally written in English. Text in other languages was provided by machine translation.

Flex SDK has two kinds of collators. Do you know the differences?

First of all, let me explain what a Collator is. The Flex SDK Collators are classes that are designed to compare two strings. Their compare functions return a numeric value to tell which of the two items is smaller or larger.

This example shows 0 as the compare result by default. As you alter the inputs, the result becomes -1 if the first input is smaller or 1 if larger. See the screenshots below.

The difference in sorting

Now, let’s talk about the differences of Matching and Sorting Collators. Actually, they are essentially same but they have given some specific initial collation parameters good for general string matching (MatchingCollator) or parameters good for general string sorting (SortingCollator). Example below illustrates why two different collators are useful.

Assume you have following items in your Array. You want to sort the items and find a specific string from the items.

naïve

Naïve

NAÏVE

naive

Naive

NAIVE

adolescent

youthful

If you sort items using a SortingCollator class with “en_US” (English spoken in U.S.) locale, you get following sort result.

adolescent

naive

Naive

NAIVE

naïve

Naïve

NAÏVE

youthful

This ordering makes sense for most usages. (At least that is what we have hoped.) Lowercase letters come first over upper cases; letters without accent come first over ones with accent.

On the other hand, if you sort the items using a MatchingCollator, you get following result. (Result may vary as some attributes are ignored.)

adolescent

Naïve

NAÏVE

naive

naïve

NAIVE

Naive

youthful

You may notice that upper/lowercase ordering and accent character ordering are not consistent with a MatchingCollator class. In fact, the MachingCollator class is not designed for sorting.

The difference in matching

Now, assume you want to search a specific string, “naive“, from the list. With a SortingCollator class, you get following result:

naive

Yes, only one string with a SortingCollator class.

On the other hand, with a MatchingCollator class, you get following result.

Naïve

NAÏVE

naive

naïve

NAIVE

Naive

As you can see, the string comparison was done in more lenient manner with MatchingCollator class. Often such leniency is desired when searching strings.

Although SortingCollator and MatchingCollator behave differently as you have seen above, those classes are pretty much same underneath. In fact, they can mute to the other sibling by setting their properties. If you need to control more details of sorting/matching behavior, you also manipulate the properties. Please see the Flex SDK references for more details.

Now in its fourth edition, “Adobe En Vivo” (‘Adobe Live’) was organized by Maximiliano Firtman and Mariano Carrizo, co-managers of ARFUG (Argentina RIA and Flex User Group). Hosted in beautiful Buenos Aires (Argentina), this well-attended event was targeted at Spanish-speaking developers and designers using Adobe’s tools and technologies in these regions.

Most event sessions focused on mobile development. Presentations covered topics such as how to get started with mobile development, game development, 3D development, multiscreen development, monetization, as well as content creation and management using Adobe tools. Most speakers were managers of Adobe user groups from throughout Latin America and Spain.

I had the pleasure of meeting and socializing with most of the event speakers. I was impressed by their mastery of Adobe tools and technologies, their presentation skills, and overall, their ability to work together in raising the profile of the Spanish-speaking Latin American community of Adobe users. This must be no easy feat, given that they come from 8 different countries.

Once again, beautiful Maceió, located in the tropical state of Alagoas in Northeast Brazil, hosted Flash Camp Brasil, a professionally-organized event led by Demian Borba, CEO of Action Creations and manager of the Jornada Adobe Brasil user group.

Some big industry names, from both Brazil and abroad, shared their expertise with the crowds here. This highly-publicized conference attracted many professionals from throughout Brazil, and featured sponsor stands, professional video makers and photographers, a user group stand, and even a space for attendees to unwind and play videogames.

I had the privilege to meet many Adobe Brazilian users, and I was impressed by their passion for Adobe and its products, and their energy. Also, I was surprised by a last-minute invitation to join John Koch in delivering the welcome keynote to an audience of aprox. 500, which proved to be an exciting experience.

If you haven’t attended one of these user-organized events yet, you should definitively consider it. It’s not only a great place to learn, but also to meet and network with industry peers. Check out Adobe’s groups site for the user group of interest nearest you, there you will find information about upcoming events.

I also want to acknowledge the great work by John Koch, Adobe Community Manager for Latin America and Asia, who invited me to these events, and who gives these communities enormous support and encouragement.

This article was originally written in English. Text in other languages was provided by machine translation.

The Adobe® Flex® ActionScript® 3.0 Language Reference in 6 languages is no more; the ActionScript® 3.0 Reference for Adobe® Flash® Professional in 16 languages bit the dust as well. Before you panic, the localized ActionScript References have gone the route of the English-language ActionScript® 3.0 Reference for the Adobe® Flash® Platform.

In addition to English, commenting has been enabled for French, German, Japanese, Spanish, Italian, Dutch, Brazilian Portuguese, and Simplified Chinese.

Now, if you develop in Flex, ColdFusion and Flash, in a language other than English, let’s say Japanese, you will be able to filter on those products and get the AS classes you need, all in one single document!

Not all products are supported in every language, but the beauty of this “all products under one roof” scenario is that you won’t have to go back and forth between the English-only version and a localized version if you are, for example, a Flex and ColdFusion developer. That’s because, for those products not supported in a particular language, you will find the English default in the same document. For example, French is supported by Flash Pro, AIR, Flash Player, Flex, but not LiveCycle or ColdFusion. So, in the French Platform ASR, you will find French and English together, depending on which products or runtimes you filter on.

I hope you are as excited about this as I am. Please blog and tweet about it, but most importantly, start using the new Platform ActionScript Reference in one of the above languages! Let me know what you think.

This article was originally written in English. Text in other languages was provided by machine translation.

Adobe AIR Launchpad v2.5.0, the desktop tool (created by Platform Evangelist Greg Wilson & team) that helps Adobe Flex® developers get started building desktop and mobile applications deployed on Adobe AIR, is now available in seven new languages in addition to English: French, Spanish, German, Portuguese, Russian, Chinese, and Japanese.

For details about the Launchpad v2.5.0 new features, including the localizations, visit Holly Schinsky’s (aka devgirlFL) blog. The language used at runtime is determined based on the default OS language. So far, feedback has been positive. If you wish to help us improve on it, please post to the AIR Launchpad Forum.

This article was originally written in English. Text in other languages was provided by machine translation.

Xie Fang

By default the DateChooser in Flex shows the English UI. You need to set the dayNames and monthNames properties to localized strings so that it shows the language you want. But do you know that all these localized names are available in the flash.globalization package? Here’s how to get the localized names.

First, create a DateTimeFormatter object with the locale you are interested in the <fx:Script> section

Alternatively, if you feel more comfortable with MXML than ActionScript, you can use a MXML DateTimeFormatter in the <fx:Declarations> section.

Second, create a vectorToArray function for type conversion in the <fx:Script> section, we will explain a little more in the next step.

Third, in your <mx:DateChooser> component, set the dayNames and monthNames properties.

And since you are using the DateTimeNameStyle enums, you want to import them in <fx:Script>

Here, the getWeekdayNames and getMonthNames methods give the localized names as a vector of string. And vectorToArray function is used to convert them to array before assigning them to the DateChooser. The getFirstWeekday method gives the first day of the week for the locale. For example, many european locales use Monday as the first day instead of Sunday.

That’s it. Now run your app and you will see the DateChooser UI is showing in Chinese.

Change the locale to British English (en-GB) and Arabic, Saudi Arabia (ar-SA) to see how the locale changes the first day of week.

Think that this doesn’t save time than hardcoding? Such as:

It is true if you just need to localized to your language. But imagine you need to localize in multiple languages, or languages you don’t know, or you want language switchable by users at run time. Using flash.globalization is more scalable.

To learn more features provided by flash.globalization package, check out the ActionScript API documentation.

This article was originally written in English. Text in other languages was provided by machine translation.

Do you create multilingual content or apps using Flash Builder? Do you use a localized version of Builder? Why or why not? Do you prefer to develop in English while deploying in multiple languages?

We would like to hear your voice and understand your pain points. Please link to our short survey on Flex and localization so we can understand what is important to you.
Many thanks!
Janice Campbell, Flex Localization