Archives pour la catégorie RadioButton

AIR Mobile – Les composants et le thème Mobile Flex 4.5

L’avantage de pouvoir utiliser les composants Flex par rapport à une application pure AS3 est de simplifier le développement en vous donnant toute une bibliothèque de composants prêts à l’emploi. Certains composants sont de nouveaux composants, d’autres ont simplement une autre « Skin » optimisée pour le rendu mobile (plus gros, système de cache, etc.). Bien sûr, vous pouvez toujours faire vos propres composants mais on va voir ceux qui sortent directement du four. Dans ce billet, on va découvrir ces composants et leurs looks pour vous donner une idée.

Notez que les itemRenderer seront couverts dans un autre billet sur flex-tutorial.

Bouton

Ce n’est pas un nouveau composant, seulement le composant s:Button avec un look différent lorsque vous l’utilisez dans un projet de type Mobile:

buttons

Notez que le composant Spark Button a retrouvé sa propriété « icon » vous permettant d’ajouter un icône directement avec la Skin de base (il fallait faire sa propre Skin auparavant).

Lire la suite

Composant Flex – RadionButton Multi-Line

Le composant RadioButton de base du framework Flex ne permet pas d’afficher un texte sur plusieurs lignes. Si vous donnez un texte long avec une largeur de composant donnée, votre texte sera tronqué (truncateToFit) et vous pourrez simplement voir la suite du texte en toolTip.

Alex Harui de la Flex Team, sur son blog explique que la mise en page de texte en Flex est lente et n’est pas toujours adaptée au système global de mise en page. Le fait est qu’il n’y a pas vraiment de moyen de déterminer la taille d’un bloc de texte, à moins qu’il n’y ait qu’une seule ligne ou bien de retour à la ligne avec un composant de largeur fixe. Le composant suivant doit d’ailleurs avoir une largeur fixe.

Mais grâce au mécanisme d’héritage de Flex (enfin de la POO en général), on peut arriver à créer ce composant RadioButton MultiLine. Voici donc le composant qu’Alex Harui a crée, nommé MultilineRadioButton.

Exemple en ligne

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:comp="*" >
	<mx:Panel title="MultilineRadioButton et RadioButton"
		paddingLeft="15" paddingRight="15" paddingTop="15" paddingBottom="15">

		<mx:Label text="MultilineRadioButton" fontSize="15"/>
		<comp:MultilineRadioButton
			width="150"
			id="rb1"
			label="This is a multiline radio button whose label should wrap" />
		<comp:MultilineRadioButton
			width="150"
			id="rb2"
			label="This is a multiline radio button whose label should wrap with even more text" />
		<comp:MultilineRadioButton
			width="150"
			id="rb3"
			label="This is a multiline radio button whose label should wrap with even more text and more text beyond that" />
		<mx:Label text="RadioButton Classique" fontSize="15"/>
		<mx:RadioButton
			width="150"
			id="rbNormal"
			label="This is a multiline radio button whose label should wrap" />
	</mx:Panel>
</mx:Application>

Flex Source Code Download: Télécharger le code source complet de l’application

This movie requires Flash Player 11

Voir l’article original de l’auteur

Télécharger les sources sur le blog de l’auteur

Flex UIComponent – Les Composants de type Boutons (Button, LinkButton, RadioButton, CheckBox)

Il y a quatre type de boutons basiques: Button, LinkButton, RadioButton et CheckBox. Bien que chaque type se comporte de la même manière, chacun a son utilité.

This movie requires Flash Player 11

Les plus similaires dans leur fonctionnement sont Button et LinkButton. En fait, la vraie différence est purement esthétique: les Button ont des bordures/fonds alors que les LinkButton n’en ont pas. Cependant, vous allez typiquement utiliser ces deux types pour la même utilisation.
Avec Button et LinkButton, le comportement par défaut est de répondre à chaque click de la même manière. Cependant, vous pouvez fixer leur propriété « toggle » à true et dans ce cas, le bouton aura deux état: sélectionné et desélectionné. Le click de l’utilisateur servira à basculer entre ces états.

Lire la suite