Adobe Flex Tutorial - Adobe Flex Tutorial

24oct/100

Code samples et composants optimisés pour Flash Player 10.1 sur mobile

Si vous développez des applications Flash à destination des mobiles (dans le navigateur Android >= 2.2), vous avez sûrement buté sur certains points comme le scrolling (la gestion des barres de défilement). Dans un environnement Desktop, avec souris, lorsqu'un conteneur est trop petit pour accueillir tous ses enfants, des scrollbar sont affichées automatiquement. On peut aussi scroller avec la molette.

Mais sur un mobile, pas de molette et pour arriver à attraper une scrollbar de 10px de large, c'est mission quasi-impossible. Le système de scrolling sur mobile est différent. Tout d'abord, les scrollbars ne sont (la plupart du temps) pas affichées, seul un indicateur apparait lors du scroll. Pour scroller, il faut taper sur le conteneur et déplacer son doigt (qui peut alors sortir du conteneur mais le scrolling s'effectuera quand même.

De même, le défilement à une certaine inertie. C'est à dire qu'il ne s'arrête pas de manière abrupte mais il continue sa course avec une inertie dépendant de la vitesse initiale.

Si vous développez pour mobile, il faut donc faire cela soit-même en AS3. Pour vous aider, Adobe fournit des exemples de code ainsi que des composants:

Reference mobile video player sample: A fully configurable flash application which supports playback optimized for mobile devices. The player supports of several video formats including H.264. Additional features include play list support, JavaScript API, external skinability, and integration with tracking services.
Image Carousel sample: A simple auto-rotating image slideshow application optimized for mobile devices. The application supports basic configurability through an external XML file.
Control examples: Two sample components created with Adobe Flash Builder 4 and optimized for mobile that you can use and extend in your mobile Flash applications:
- DraggableVerticalContainer vertically scrolls a block of DisplayObjects
- DraggableVerticalList vertically scrolls items in a list

Voilà, le code est propre et performant. Si vous souhaitez développer vos propres composants pour mobile, je vous conseille de vous inspirer de ces codes source.

Optimize web content for mobile delivery (bas de page)

Remplis sous: ActionScript, Android, Exemple, Flash Player Aucun commentaire

26août/090

Composant Flex – Menu avec Scroll vertical (et MenuBar, PopUpMenuButton)

Quand vous créez une application Flex, vous avez plusieurs moyens de faire apparaître des menus. Pour cela, il y a les composants MenuBar, PopUpMenuButton par exemple. Ces deux composants utilisent une classe de base la classe Menu. La classe Menu du framework peut être utilisée pour afficher des menus n'importe où dans votre application.

Seulement, les menus crées avec la classe Menu ne tiennent pas compte du nombre d'éléments dans un menu ou dans un sous-menu. Ainsi, si vous avez une grande quantité d'éléments et que la hauteur du menu est supérieure à la hauteur de votre application, vous ne verrez pas certains éléments et vous n'aurez aucun moyen d'y accéder (pas de défilement).

Doug McCune a pour cela crée un composant baptisé ScrollableMenu qui affiche des flèches de défilement et/ou des barres de défilement (scrollbar). Tous ces composants sont facilement personnalisables. Les composants ScrollableMenuBar et ScrollablePopUpMenuButton sont eux aussi inclus dans le projet et implémente le même comportement que le ScrollableMenu.

Voir la page officielle sur le blog de Doug McCune