Un développeur affirme pouvoir reproduire l'UI de tous les OS avec du CSS et JavaFx
Il relève le défi pour montrer le potentiel de ces technologies


Des gens demandaient à Jasper Potts (Architecte Développeur pour JavaFX) s'il était possible de recréer le look de tel ou tel OS avec JavaFX 2.x. Certains, persuadés qu'il ne pourrait pas, lui ont même lancé un défi.

Il a donc décidé de le relever.

La clef de sa méthode repose sur les feuilles de styles (CSS) qui permettent de personnaliser les boutons de JavaFX.

Résultat, des UI d'iPad, d'iPhone, de Windows 7, ou d'Android sans utiliser la moindre image (un design faisable également sans CSS et rien qu'en code Java avec les API JavaFX 2.x).

La meilleure méthode reste cependant les feuilles de style qui séparent le contenu et le rendu graphique. Et qui sont plus simple à coder qu'avec du Java.



Dans le détail, Jasper Potts explique qu'il utilise les gradients du CSS. Un bouton d'UI aura un air de Windows 7 si on lui applique par exemple la feuille de style suivante :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
#windows7-default {
    -fx-background-color:
        #3c7fb1,
        linear-gradient(#fafdfe, #e8f5fc),
        linear-gradient(#eaf6fd 0%, #d9f0fc 49%, #bee6fd 50%, #a7d9f5 100%);
    -fx-background-insets: 0,1,2;
    -fx-background-radius: 3,2,1;
    -fx-padding: 3 30 3 30;
    -fx-text-fill: black;
    -fx-font-size: 14px;
}
Défi réussi ?


Le projet Netbeans "ButtonStyles.zip" est disponible en téléchargement libre

Source : Billet de Jasper Potts