Dans ce tutoriel, nous allons voir comment utiliser le data-binding pour rendre votre application dynamique très simplement. Dans cet exemple, nous réaliserons une petite application comprenant un champ texte à remplir, un slider qui change de couleur en fonction de sa valeur et un boutton permettant de quitter l'application, mais qui est disponible uniquement lorsque du texte est entré dans le champ à remplir.
Nous allons laisser de côté pour l'instant notre slider et nous focaliser sur le textfield et le bouton. Créons tout d'abord notre vue :
<Application id='tuto'>
<style source='data-binding.css'/>
<JTextField id='textField'
constraints='BorderLayout.NORTH'/>
<JButton text='Button'
constraints='BorderLayout.SOUTH'
onActionPerformed='dispose()'/>
</Application>
Si vous lancez l'application, le boutton est toujours valide.
Nous allons donc le modifier et lui rajouter l'attribut :
enabled='{textField.getText().length() != 0}'
Ce que cela va faire c'est rajouter les listeners adéquats pour qu'à chaque fois que le résultat de textField.getText() change, la propriété enabled du boutton est réévaluée. En l'occurence, dès que la taille du texte est différente de 0, le boutton est activé. Essayez pour voir.
Nous allons rajouter un slider entre notre textField et notre bouton. On utilisera pour cela le code suivant :
<JSlider maximum='200'/>
Nous souhaitons que lorsque l'on dépasse la moitié du slider (la valeur 100), la couleur du fond passe à rouge. Nous allons rajouter cela au style de l'application grace au data-binding. Dans notre feuille de style, rajoutons (ici est décrit uniquement le style nous intéressant):
Slider:{object.getValue() > 100} {
background: red;
}
Cela donne :
Dans le style, il est possible d'utiliser le data-binding sur object, qui sera remplacé par l'objet en question dans l'application. Ici, comme pour notre bouton précédemment, nous changeons une propriété (ici background) lorsque la propriété value dépasse une certaine valeur.
Vous avez découvert comment créer des interfaces dynamiques en utilisant le data-binding. Vous avez-vu la simplicité ? Vous sentez votre créativité augmenter ? Avec les bases que vous venez d'acquérir, vous pouvez simplement créer des applications au look très évolué et dynamique. Il ne reste plus que votre patte créative à mettre en route.
Les sources de ce tutoriel sont disponibles au telechargement ici
Pour lancer ce tutoriel via Java Web Start suivez ce lien
Pour plus de détail sur webstart
