Une des grosse frustration que peut rencontrer un développeur Flex proviens du composant Image disponible dans le framework.
Comme son nom l’indique ce composant permet d’afficher des images dans vos interfaces de manière simple et intégrée.
Seulement voila, alors qu’en ActionScript 3 pur, on peut choisir de lisser ou non les images lors de leur redimensionnement, il n’en est rien pour le composant Flex, les images apparaissent alors pixélisées.
C’est d’autant plus frustrant que le composant est basé sur la même classe que l’AS3 et que cette feature est donc présente, mais n’est pas activable directemment.
Une solution existe : il suffit d’étendre le composant pour accéder au bitmap et activer le lissage lors de l’initialisation (initialisation du composant pour les images Embed et a la fin du chargement pour les images externes).

Pour mes besoins personnels j’ai exploité cette solution en créant un composant « SmoothImage » dont voici le code :

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml" init="updateSmoothState()" initialize="updateSmoothState()">
	<mx:Script>
		<![CDATA[
			private function updateSmoothState():void{

				if (this.content is Bitmap){

					var btmp:Bitmap = this.content as Bitmap;

					if (btmp && !btmp.smoothing){

						btmp.smoothing = true;
					}
				}
			}
		]]>
	</mx:Script>
</mx:Image>

Voila c’est cadeau, et pour faire plaisir a tout le monde, j’ai compilé un SWC qu’il suffira de mettre dans le tiroir « libs » de son projet Flex pour disposer d’un nouveau composant « SmoothImage ».
Ce dernier fonctionne exactement comme « Image » … le lissage en plus.

Le SWC et le code source sont disponibles sur Google code.
(héhé je vais pouvoir me commander un NerdMeritBadge OpenSource)

This entry was posted on samedi, février 21st, 2009 at 14:40 and is filed under Code. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.