IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

AWT/Swing Java Discussion :

Moteur de CSS pour Swing, SWT


Sujet :

AWT/Swing Java

  1. #1
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut Moteur de CSS pour Swing, SWT
    Bonjour,

    Je me permets de poster un message concernant le moteur de CSS que je suis en train d'implémenter pour gérer n'importe qu'elle renderer Swing, SWT...
    pour mon projet TK-UI.

    Le moteur de CSS pourra s'appliquer soit sur un DOM (dans le cas de TK-UI) mais aussi sur du pur Swing ou du pur SWT.

    Je sais qu'il existe des classes Swing qui gère les CSS (par contre je ne suis pas sur qu'il puisse lire des fichiers CSS standards), mais l'interet du moteur CSS est qu'il soit générique et surtout il suit les spécification w3c.

    Pour parser un fichier CSS en suivant w3c, il faut utiliser un parser SAC ce que j'utilise (flute, batik...).

    Concernant les règles de sélection des CSS, pareil j'utilise les recommandations w3c, et on peut par exemple utiliser l'implementations des Selectors du projet batik.

    Vous pouvez trouvez deux capures d'ecrans :

    swing.css : qui est la copie d'ecran Swing qui se base sur le css suivant :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    JLabel {
    	font-style: italic;
    	font-weight:bold;
    	font-family: "Arial";
    	color:black;	
    }
     
    JPanel JPanel JPanel JLabel {
    	font-weight:normal;	
    	font-style: normal;
    } 
     
    H1, H2 {color: green }
     
    JTextField {
    	background-color:rgb(100,100,0);
    }
    swt-css.png
    qui est la copie d'ecran SWT qui se base sur le css suivant :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    Label {
    	font-style: italic;
    	font-weight:bold;
    	font-family: "Arial";
    	color:black;	
    }
     
    Composite Composite Label {
    	font-weight:normal;	
    	font-style: normal;
    } 
     
    Text {
    	background-color:rgb(100,100,0);
    }
    Comme vous pouvez voir la regle CSS Composite Composite Label est géré
    autrement dit elle s'applique a un Label SWT qui est dans un composite qui est lui meme dans un composite.

    Cette règle utilise batik pour gérer ceci, mais il est possible de creer ses propres règles.

    Si vous etes interesses pour tester ceci, vous pouvez telecharger le projet Eclipse
    org.akrogen.tkui.core.css

    et lancer
    /test/org/akrogen/tkui/core/css/selectors/swing/TestSwingCSSSelectors.java
    pour Swing et
    /test/org/akrogen/tkui/core/css/swt/selectors/TestSWTCSSSelectors.java
    pour SWT.

    Le code peut paraitre tres complique, mais j'ai surtotu travaille sur les selectors et la possibilite d'utiliser n'importe quelle parser SAC.
    La je dosi travailler sur les applications des Styles beuacoup plus proprement.

    Si vosu etes interesses, n'hesitez pas a me solliciter.

    Angelo
    Images attachées Images attachées   

  2. #2
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour,

    Je pense que mes examples n'etaient pas assez pertinent car ca n'a pas l'air d'intéresser grand monde. J'ai continué a avancer sur l'implementation SWT du moteur de CSS.

    Je vous joins 3 copies d'ecrans qui est le meme code SWT mais ou un fichier CSS est applique sur la fenetre SWT. J'espere que ces examples seront plus pertinent et donneront envie a certains.

    Voici la feuille CSS pour le screen TestMatrix :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    Tree {
    	background-color: black;
    	color: white;	
    }
     
    CTabFolder {
    	background-color: black;
    	color: white;
    }
     
    SashForm, Shell {
    	background-color: green;
    }
     
    ToolBar {
    	background-color: white, green, 100%;
    	color: black;
    }
     
    CLabel {
    	background-color: black;
    	color: white;
    }
    Cet example est base sur un article Eclipse que j'ai decouvert.

    Angelo
    Images attachées Images attachées    

  3. #3
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    Personnellement je suis interressé par un module qui permettrait d'affecter une CSS à du Swing.

    Je n'aime pas les frameworks, je préfère avoir des petits outils.

    J'ai déjà fait un composant dans ce genre, et avec l'aide de SwingX, pour les images de fond.

    Coder un ihm par du xml comme en web est à mon gout fort déplaisant.

    Pour mon composant j'utilise la technique d'un écouteur d'évènement AWTEventListener, sur les containers. Et à chaque composant ajouté je calcul l'apparence CSS. C'est pas très compliqué.
    Mon rêve étant de pouvoir faire comme dans zen css, mais à partir d'un contenu swing et non html.

    Peux tu nous expliquer un peu comment tu t'y prends de ton coté.
    Merci.

  4. #4
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour Alec6,

    Merci beaucoup de ton post. je me sentais un peu seul
    J'en suis qu'au debut du developpement donc tout n'est pas supporte surtout concernant Swing, mais ca va etre le prochain developpement que j'envisage
    pour gerer les font, les degrades comme dans l'exemple SWT que j'ai mis.

    Tout d'abord voici le code pour appliquer une CSS a une JFrame :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    // Instanciate Swing CSS Engine
    CSSEngine engine = new CSSSwingEngineImpl();
    engine.parseStyleSheet(new FileInputStream(new File("swing.css")));
     
    /*---   UI SWT ---*/
    JFrame frame = new JFrame();
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
     
    JPanel panel = new JPanel();
    frame.getContentPane().add(panel);
     
    // Label
    JLabel label1 = new JLabel();
    label1.setText("Label 0");
    panel.add(label1);
    ...
    /*---   End UI Swing  ---*/
     
    // Apply Styles
    engine.applyStyles(frame, true);
     
    frame.pack();
    frame.setVisible(true);
    La methode parseStyleSheet parse le fichier CSS en utilisant un parse SAC w3c qui construit les CSS rules w3c et les stockent.

    La méthode applyStyles, appliquent les styles CSS a la frame et a ses enfants (applyStyles est appele avec true qui indique que les Component enfant de la JFrame doivent etre itérer et que l'on doit appliquer un style a chacun des Component).

    Ca c'et le principe de base des applications des styles CSS pour n'importe quel renderer SWT ou Swing (ou autres).

    Lors de l'application des styles parses sur un Component, le moteur CSS itère sur chacune des CSS rules et verifient que le Component vérifie la règle.

    Pour tester si le CSS rule courant doit s'appliquer, j'utilise les Selector w3c SAC. Je n'ai pas implementer ces Selector et j'utilise ceux implementer par batik (mais on peu implementer ses propres selectors si besoin) qui travaille avec des w3c Element.

    Pour travailler avec des w3c Element, j'ai cree une classe SwingElement qui implemente w3c Element est qui est lie a un Component Swing. Tout ceci c'est le moteur CSS qui s'en occupe. Du coup on peut utiliser les selectors batik pour gerer le selectors CSS du type

    JPanel JPanel JLabel qui indique que seuls les Jlabel qui sont contenus dans un JPanel qui est lui meme contenu dans un JPanel doit avoir la regle applique.

    Ca c'est pour savoir si la regle CSS courante doit s'appliquer sur le Component courant.

    Si la regle CSS doit s'appliquer, celle ci appelle des implementation de ICSSPropertyHandler, qui permet d'appliquer la regle background-color sur un JComponent Swing.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    public class CSSPropertyColorSwingHandler implements ICSSPropertyColorHandler {
     
    	public void handle(Object element, String property, CSSValue value,
    			String pseudo) {
    		JComponent control = getJComponent(element);
    		if (value.getCssValueType() == CSSValue.CSS_PRIMITIVE_VALUE) {
    			Color color = CSSSwingHelpers.getColor((CSSPrimitiveValue) value);
    			if (color == null)
    				return;
     
    			// if (control instanceof Control) {
    			if ("background-color".equals(property)) {
    				control.setBackground(color);
    			}
    Je ne sais pas si j'ai ete assez clair, mais c'est assez diffcile d'expliquer le fonctionnement d'un moteur CSS par un message.

    Le moteur de CSS que je susi en train d'implementer suit toutes les recommandations w3c.

    Pour conclure, le fonctionnement est :

    1. Parser les feuilles de styles a l'aide d'un parser SAC qui construit des CSS rules.
    2. Iterer sur les JComponent de la JFrame et pour chacun des JComponent, iterer sur les règles CSS. Des qu'un regle CSS est applicable, appliquer la regle CSS a l'aide d'une implementation de ICSSPropertyHandler.

    Angelo

  5. #5
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    Très bien,

    je n'est pas de connaissance sur la création d'un renderer, il me manque donc l'application des sélectors, je l'ai fait à la main, j'ai comme toi l'équivalent d'un propertyhandler (logique).

    comment tu fais pour gérer quand on ajoute des composants à la fenêtre après avoir fait engine.applyStyles(frame, true); (d'ou mon utilisation du AWTEventListener).

    Autre chose que j'ai pas compris c'est pour tes CSS; est tu obligé d'utiliser des tags JPanel, JLabel... moi j'utilise la méthode setName de Component pour une utilisation classique comme en HTML (malheureusement pas de setId).

  6. #6
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    je n'est pas de connaissance sur la création d'un renderer,
    En fait quand je parlais de renderer, je parlais de Swing ou SWT.

    il me manque donc l'application des sélectors
    Les selectors peuvent etre tres complexe, mais comme j'utilise ceux de batik, c'est deja tout fait et ca gere tous les types de selectors w3c (j'ai pas encore tout teste).

    comment tu fais pour gérer quand on ajoute des composants à la fenêtre après avoir fait engine.applyStyles(frame, true); (d'ou mon utilisation du AWTEventListener).
    Tres bonne remarque, ca je ne le gere pas encore. Mais je vais y réfléchir.
    Ca arrive souvent que l'on ajoute au runtime des Component?

    Autre chose que j'ai pas compris c'est pour tes CSS; est tu obligé d'utiliser des tags JPanel, JLabel...
    En fait j'ai fait ce choix pour l'implementation Swing et SWT d'utiliser les nom des classes. Ceci est gere dans la classe SwingElement :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    public class SwingElement extends ElementAdapter {
       ...
         public String getLocalName() {
    		// The localName is simple class name
    		// of the Swing component. For instance
    		// for the javax.swing.JLabel
    		// localName is JLabel
    		// CSS selector will use this localName
    		// ex : JLabel {background-color:red;}
    		Component component = getComponent();
    		Class clazz = component.getClass();
    		String name = ClassUtils.getSimpleName(clazz);
    		return name;
    	}
    }
    Mais tu peux utiliser ta propre classe MySwingElement qui retourne ce que tu veux, ce qui donnerait :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    public class MySwingElement extends ElementAdapter {
       ...
         public String getLocalName() {		
    		Component component = getComponent();
    		if (component instanceof JLabel)
                        return "label";
                    if (component instanceof JTextField)
                        return "input";
    		return "";
    	}
    }
    Concernant le ID, il faut implementer aussi dans le SwingElement la methode getId (qu'un Condition Selector w3c que j'ai implemente utilise).

    Je l'ai implemente comme ceci :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    	public String getId() {
    		Component component = getComponent();
    		if (component instanceof JComponent) {
    			Object id = ((JComponent) component).getClientProperty("id");
    			if (id != null)
    				return id.toString();
    		}
    		return component.getName();
    	}
    autrement dit il va d'abord chercher si dans l'id a ete enregistre avec la methode putClientProperty (avec la cle id)
    sinon il retourne le name du Component :

    Apres tu peux utiliser la regle CSS :

    JLabel#MyId {
    color:blue;
    }
    Et dans ton code Java tu fais :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    JLabel label2 = new JLabel();
    label2.setName("MyId");
    Ou

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    JLabel label2 = new JLabel();
    label2.putClientProperty("id", "MyId2");
    Angelo

  7. #7
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour Alec6,

    Tu m'a l'air d'avoir une bonne experience concernant les CSS, serais tu intéressé pour tester mon moteur de CSS et si jamais si il te plait, serais tu interesser pour contribuer? J'ai plein d'idee (comme pouvoir changer au runtime les styles apres avoir choisi une feuille CSS, avoir un editeur de CSS simple ou il y aurrait a droite de l'ecran une JTextArea qui afficherait les styles CSS et des que l'on modifie un style, ca met a jour l'ecran....)

    Je ne maitrise pas Swing, pourrais tu s'il te plait developper sur ton idee de AWTEventListener. Merci.

    Mon rêve étant de pouvoir faire comme dans zen css, mais à partir d'un contenu swing et non html.
    Pourrais tu developper s'il te plait ton idee. J'espere qu'un jour mon moteur de CSS aboutir a tes attentes

    Angelo

  8. #8
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    En faite ton projet et certains de mes projets ont des problèmatiques techniques en commun.

    J'ai un soucis avec ton projet c'est que le code n'est pas divisé en sous projets.
    Il y a en gros deux parties:
    - parsing d'un flux xml ---> génération d'IHM
    - skinning d'une IHM par une CSS (ca devrait être un Jar différent).
    Et il ne doit pas forcément y avoir de dépendance de l'un vers l'autre (ou bien il faut une librairie tierce)

    Notamment je viens d'ouvrir un projet dans la partie Desktop chez sun qui s'appel UGC. C'est pour formaliser un projet que j'étudie depuis un moment et qui est un casse tête (enfin qui demande une expertise), et se veut être un projet de recherche sur les IHM. L'idée est de faire l'introspection d'un model de données pour générer l'IHM qui convient à sa manipulation (pas nouveau dans l'idée).

    L'idée nouvelle c'est de ne pas produire un XML qui décrit la structure de l'IHM mais un XML qui décrit la structure du dialogue que l'IHM doit matérialisé.

    En effet un IHM permet à l'homme de dialoguer avec le système en ayant des question et des réponses, des sujets et sous sujets, des notifications etc...
    Pour un même dialogue plusieurs structure d'IHM sont possibles mais certaines sont plus cohérentes que d'autre (il faut lire les référentiels de l'ergonomie).

    J'ai donc:
    - Data Model --> XML (structure du dialogue=métamodèle d'IHM)
    - XML --> IHM
    (le CSS est un plus mais c'est interressant)
    Et en réponse à un commit
    - IHM --> XML (dialogue en retour, donc avec des questions répondues)
    - XML --> Data Model

    Tu vois le problème commun avec les rendereurs !

    J'ai donc des parties indépendantes:
    - Data Model --> XML (on peu imaginer n'importe quel langage) donc pas de dépendance avec la suite.
    - XML --> IHM (comme tu le fais), mais il faut des jars différents et sans doute le savoir faire de JSF pour la customization des rendereurs (avec des XML de configuration).

    En somme morcelle ton projet en autant de parties indépendantes que possible et pour chaque partie écrit une procédure du genre:
    - vous voulez rajouter un Rendereur (fait ci faite ca, et placer le la dedans...); comme si tu parlais à des novices.

    Je pense que tu auras plus de succès.

    Pour le CSS, c'est un peu un autre projet que j'ai, et effectivement je vais regarder ton projet, et contribué si possible. Mais please morcelle.

  9. #9
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour,

    J'ai un soucis avec ton projet c'est que le code n'est pas divisé en sous projets.
    Il y a en gros deux parties:
    - parsing d'un flux xml ---> génération d'IHM
    - skinning d'une IHM par une CSS (ca devrait être un Jar différent).
    Le moteur de CSS est completement indépendant de TK-UI (- parsing d'un flux xml ---> génération d'IHM), autrement dit le projet org.akrogen.tkui.core.css contient le moteur de CSS et ne fait reference a aucun autre projet de TK-UI qui permet de decrire une IHM en XML. En d'autres termes l emoteur CSS peut s'appliquer sur du pur code Swing ou SWT.

    En effet un IHM permet à l'homme de dialoguer avec le système en ayant des question et des réponses, des sujets et sous sujets, des notifications etc...
    Pour un même dialogue plusieurs structure d'IHM sont possibles mais certaines sont plus cohérentes que d'autre (il faut lire les référentiels de l'ergonomie).
    Je vais peut etre dire uen betise, mais j'ai l'impression que c aressemble a l'idee de XForms ou tu as une instance dans le model (XML) et ensuite la gestion des evts estdécrite en XML.

    En somme morcelle ton projet en autant de parties indépendantes que possible et pour chaque partie écrit une procédure du genre:
    - vous voulez rajouter un Rendereur (fait ci faite ca, et placer le la dedans...); comme si tu parlais à des novices.
    C'est ce que j'ai tente de faire. Tu as le core TK-UI (qui gere le chargement d'un XML et qui gere le Databinding, le lien entre l'UI et le DOM....). Tu as ensuite un projet par implementation de renderer (Swing, SWT...) Tu as un projet de moteur de CSS (independant de TK-UI)...
    Pour le CSS, c'est un peu un autre projet que j'ai, et effectivement je vais regarder ton projet, et contribué si possible. Mais please morcelle.
    Genial. Mais j'ai decoupe TK-UI en plusieurs projets.

    Tu peux trouver une breve description des projets ici.

    Angelo

  10. #10
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Tu vois le problème commun avec les rendereurs !
    Oui je le voies tres bien. En fait pour l'instant j'ai implemente mes propres renderer SWT et Swing.

    Mais a termes j'aimerais bien integrer ceux de UFace qui propose une API ou les UI sont des interfaces et ou ils ont implementes plusieurs renderers comme Swing SWT et GWT.

    Je contribue a ce projet concernant le Databinding avec JFace (qui est super puissant ) pour gerer le Databinding avec Swing, Rhino (Javascript) et DOM.

    TK-UI utilise en interne le Databinding DOM pour synchroniser l'UI (Swing, SWT...) avec le DOM.

    UFace est en cours de developpement, mais peut etre que ca pourrait repondre a ta problématique des renderers.

    Angelo

  11. #11
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour alec6,

    Je ne maitrise pas Swing, pourrais tu s'il te plait developper sur ton idee de AWTEventListener.
    Ok je viens de comprendre ce que tu as fait. Ta classe elle ne s'appelerait pas SwingWatcher que l'on puet trouver dans cette article?

    Je ne matrise pas super bien Swing et je commence a bloquer sur pas mal de point technique Swing comme par exemple gerer le backgrounde des TreeNode d'un JTree sans passer par un TreeCellRenderer.

    Si tu as l'envie de m'aider a implementer le moteur CSS de Swing, j'en serai ravi.

    Angelo

  12. #12
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    Effectivement c'est bien l'article de Josh, voir d'autres dans les Cours et tutoriels pour apprendre CSS

    Je vais voir ce que je peux faire avec mes moyens temporels.

  13. #13
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Ok je viens d'implementer l'idee du AWTEventListener dans la classe CSSSwingLazyEngineImpl (qui lance CSSSwingApplyStylesListener (comme SwingWatcher) qui herite de CSSSwingEngineImpl (qui elle n'applique pas le style quand le Swing component est ajoute).

    Par contre dans le cas du SwingWatcher, ca marche tres bien car RuleManager est un singleton. Dans mon cas j'ai une instance de CSS par JFrame et pas un singleton RuleManager.

    J'ai utilisé la classe que j'adore et qui me sauve tout le temps : ThreadLocale ou je stocke le moteur de CSS dans une ThreadLocale.

    Du coup le code est encore plus simplifie (uniquement pour Swing), ce qui donne :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    // Instanciate Swing CSS Engine
    CSSEngine engine = new CSSSwingLazyEngineImpl();
    engine.parseStyleSheet(css);
     
    /*---   UI SWT ---*/
    JFrame frame = new JFrame();
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
     
    JPanel panel = new JPanel();
    frame.getContentPane().add(panel);
    ...
    Il n'y a plus besoin d'appeler la methode engine.applyStyles(frame, true); et du coup l'iteration sur les Component ne doit plus s'effectuer.

    Merci de m'avoir parle de ton idee. La ca marche nickel.

    Le test se trouve dans la classe TestCSSLazyEngine


    Je vais voir ce que je peux faire avec mes moyens temporels.
    Oui je connais tres bien ce probleme. En tout cas si on peut bosser ensemble ca serait cool. Tu as un site ou on pourrait voir ton projet UGC?


    Angelo

  14. #14
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    Et non j'ai pas de site:

    je suis pas doué dans ce genre de plomberie (mise en place d'un serveur SVN etc)

    A mon avis je ne pourrais pas remettre les pieds sur le projet CSS avant une semaine.

    Est ce que tu arrives à gérer les problèmes de layout des CSS ?

  15. #15
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    je suis pas doué dans ce genre de plomberie (mise en place d'un serveur SVN etc)
    C clair que ca prend du temps. Moi j'utilise Sourceforge, et j'en suis tres content. Tu as un serveur CVS ou SVN, tu peux as un site avec ton url du projet. Sourceforge te fait ca pour toi.

    A mon avis je ne pourrais pas remettre les pieds sur le projet CSS avant une semaine.
    Pas de souci, n'hesites pas a me contacter des que tu as envioe de bosser dessus.

    Est ce que tu arrives à gérer les problèmes de layout des CSS ?
    Non je n'ai pas gerer le cas des layout, car je n'ai pas encore fini d'implementer les styles basiques. De plus la je susi en train de mettre en place la possibilite d'appliquer un style au runtime ce qui signifie qu'il faut reseter le style applique precedemment avant d'appliquer le nouveau style.

    De plus je ne sais pas trop comment je vais gerer les layout (avec MigLayout?). J'ai en effet vu que le projet SwingWatcher proposait cette fonctionnalite. Mais promis je regarderais comment on pourrait faire.

    Angelo

  16. #16
    Membre averti
    Homme Profil pro
    Inscrit en
    Juillet 2002
    Messages
    705
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2002
    Messages : 705
    Points : 393
    Points
    393
    Par défaut
    Voici des idées et problèmes à résoudre, en tant que pro du Swing:
    - pour le layout: le layout de swing et le mieux, cependant on a parfois besoin de laisser la tache à la css car on veut qu'un graphiste dispose d'une certaine liberté.
    Je pense qu'il faudrait soit regarder si un container à déjà un layout (gridbag, grid etc...) avec d'appliquer une property de layout, soit dans les clients properties dire que le layout doit etre fixe (par swing). Un mix des deux sans doute, la pratique le dira.
    - La mise en forme du texte est du fond est de loin l'aspect le plus séduisant des CSS pour Swing (plus que le layout et les bordures). Et c'est surtout bien plus pratique qu'un fichier property. Il faudrait pouvoir récupérer le texte d'un JLabel et le modifier, et notamment parser du HTML dans un JLabel pour appliquer les styles dedans (je crois que c'est imporant ca).

  17. #17
    Nouveau Candidat au Club
    Profil pro
    Inscrit en
    Janvier 2003
    Messages
    1
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2003
    Messages : 1
    Points : 1
    Points
    1
    Par défaut
    Bonjour

    Comment te difference tu par rapport au projet jaxx : http://www.jaxxframework.org : qui entre autre applique des css sur des composants swing?

    Autre question :
    Par rapport a ton projet Akrogen : qui si j'ai bien compris permet la generation de wizard pour eclipse
    Envisage tu de l'utiliser pour la generation de wizard ou autre pour Netbeans?

    A+
    Theodore

  18. #18
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    - pour le layout: le layout de swing et le mieux, cependant on a parfois besoin de laisser la tache à la css car on veut qu'un graphiste dispose d'une certaine liberté.
    Je pense qu'il faudrait soit regarder si un container à déjà un layout (gridbag, grid etc...) avec d'appliquer une property de layout, soit dans les clients properties dire que le layout doit etre fixe (par swing). Un mix des deux sans doute, la pratique le dira.
    Ok je comprends ton idée. En fait j'aimerais bien gerer les 2 cas (Layout de Swing) et (layout de MigLayout) car dans TK-UI j'utilise MigLayout pour gerer les layout Swing et SWT.

    - La mise en forme du texte est du fond est de loin l'aspect le plus séduisant des CSS pour Swing (plus que le layout et les bordures). Et c'est surtout bien plus pratique qu'un fichier property.
    Oui je susi entierement d'accord.

    Il faudrait pouvoir récupérer le texte d'un JLabel et le modifier, et notamment parser du HTML dans un JLabel pour appliquer les styles dedans (je crois que c'est imporant ca).
    Tu veux parler des styles inlines? Si c'est le cas je viens de gerer ce cas.
    Tu peux faire :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
     
    JLabel label1 = new JLabel();
    label1.putClientProperty("style", "color:blue;");
    Ou

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    JLabel label1 = new JLabel();
    engine.parseAndApplyStyleDeclaration(label1, "color:red;");
    Pardon je n'ai pas bien compris l'interet de gerer le text du JLabel dans un CSS? Mettre en dur le text d'un JLabel ne me parait pas tres international. Mieux vaut les gerer dans des ficheirs de prorietes? Mais peut eter que je n'ai pas bien compris ton idee.

    Angelo

  19. #19
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour Theodore,

    Comment te difference tu par rapport au projet jaxx : http://www.jaxxframework.org : qui entre autre applique des css sur des composants swing?
    La première difference est que le moteur de CSS puisse gerer SWT et Swing. Je n'en ai pas trouve actuellement qui fasse ca. La deuxieme difference est que mon moteur de CSS est execute au runtime alors que JAXX (d'apres ce que j'ai pu lire) part d'un fichier XML (d'UI) et compile des classes Java Swing.

    Du coup tu peux utiliser le moteur CSS dans une application Swing existante.

    Autre question :
    Par rapport a ton projet Akrogen : qui si j'ai bien compris permet la generation de wizard pour eclipse
    Envisage tu de l'utiliser pour la generation de wizard ou autre pour Netbeans?
    Akrogen ne genere pas des Wizard Eclipse, il interprete un fichier XUL/XML qui decrit ton interface et t'affiche le wizzard. Dans cette description XML de ce wizard tu infique le template (Freemarker, XSL, Velocity) que tu veux utiliser (ou une tache ANT).

    Lorsque tu cliques sur le bouton Finish les valeurs saisies dajns le wizards sont fucionnes avec le template pour generer le code que tu souhaites (Class Java, PHP, XML...)

    L'interet d'interpreter le XUL (au lieu de generer le code Wizard Eclipse) est que tu modifie ton fichier XUL des que tu as envie, tu reouvres ton wizard et ton wizard s'affiche avec ta nouvelle description (pas besoin de compiler).

    Concernant Netbeans, tu as tappe dans le mile. En fait aujourd'hui Akrogen est base sur Wazaabi pour interpreter le XML/XUL en SWT. Mais il ne gere pas Swing, ni les CSS...

    C'est pour cela que j'ai cree TK-UI
    qui permet de decrire une UI en XML (XUL, XHTML...) et le rendre en Swing et SWT (ou autres).

    Une fois que j'aurrais finalise TK-UI je m'attaquerais au module Netbeans, mais d'ici la je pense qu'il va y avoir pas mal de temps qui va s'ecouler car je suis tout seul a faire le developpement.

    Dans TK-UI, j'utiliserai aussi le moteur CSS que je suis en train de mettre en place donc on pourra decrire des wizard en XUL, XHTML...et CSS avec du binding (comme en XAML).

    Si tu es interesse par le sujet, n'hesite pas à me solliciter .

    Angelo

  20. #20
    Membre expérimenté
    Avatar de azerr
    Homme Profil pro
    Ingénieur Etude JEE/Eclipse RCP
    Inscrit en
    Avril 2006
    Messages
    942
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Drôme (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur Etude JEE/Eclipse RCP
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2006
    Messages : 942
    Points : 1 464
    Points
    1 464
    Par défaut
    Bonjour,

    Je vous tiens au courant de l'etat d'avancement de mon moteur CSS.
    J'ai bien avance concernant SWT, moins sur Swing car je ne suis pas un expert et je commence a sentir mes limites.

    J'ai bien avance sur la partie selector, et on peut ajourd'hui utilisé la plupart des selectors de w3c.

    Par exemple :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    JCheckBox[visible="true"] {
    	background-color:green;
    }
    Signifie que les JCheckBox qui sont visible ont le style applique vert (meme si ca n'a aucun sens).

    J'ai commence aussi a travaille sur les selectors de type HTML.
    Je vais donc proposer par defaut les selectors de type Swing (ex : JTextField) et de type HTML (ex : input). Mais il est bien sur possible de personnaliser ces selectors.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    input {
    	background-color:green;
    }
    Met en vert tous les composants JCheckBox, JtextField... comme en HTML.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    input[type=checkbox] {
    	background-color:green;
    }
    Met en vert uniquement les JCheckBox.

    J'ai aussi gere les backround image.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    JButton {
    	background: url(./images/icons/type/class.gif);
    }
    Permet d'ajouter un icone sur les JButton.

    Une fois que j'aurrais bien finalise ca, je m'attaquerai a 2 fonctionnalites importantes :

    1. possibilite de recuperer les styles initiaux des Widgets avant d'appliquer un style (ex : background-color...) pour pouvoir ensuite appliquer une CSS au runtime. Avant d'appliquer une CSS, la Widget s'initialisera avec son style initial (pour annuler les styles deja applique par une CSS) puis la nouvelle CSS s'appliquera.
    2. les pseudo classes dynamiques, pour gerer le cas suivant

      JTextField:focus {backround-color:red;} qui permet de mettre en rouge les JTextField que si elle a le focus.


    J'espere que cela donnera envie a certain.

    Alec6 si tu es interesse par mon travail, n'hesite pas a me contacter. Je suis pas super bon en Swing, et j'aimerais bien que tu juges de mon code.
    Et encore mieux si tu peux m'aider ca serait genial.Merci.

    Angelo

Discussions similaires

  1. Moteur CSS pour SWT et Swing
    Par azerr dans le forum Akrogen
    Réponses: 0
    Dernier message: 10/05/2008, 17h38
  2. Réponses: 2
    Dernier message: 11/01/2008, 11h05
  3. [plugin]Le meilleur pour realisation GUI SWING/SWT ?
    Par Ancien_Legolas dans le forum Eclipse Java
    Réponses: 3
    Dernier message: 01/06/2005, 11h08
  4. [Comparaison] Jbuilder ou Eclipse pour Swing ?
    Par phpe dans le forum Eclipse
    Réponses: 12
    Dernier message: 04/10/2004, 09h33
  5. [Info]AWT, SWING, SWT
    Par ben23 dans le forum AWT/Swing
    Réponses: 2
    Dernier message: 13/04/2004, 10h28

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo