Discussion :

[Caroline76]

Bonjour,
je cherche a changer le pointeur de la souris, pas generalement (avec CSS), mais, par exemple, apres appui sur un bouton.
Le graphisme de la nouvelle icone pourrait etre dynamique.

Exemple:
Lorsque j'appuie sur le bouton [change], le pointeur de la souris deviens "nouveau_pointer.gif".

Sauriez-vous comment je dois proceder ? Merci!

[benwit]

Bonjour,

Si tu sais le faire en css, tu dois savoir que la règle css peut être appliquée à un élément en particulier.
Donc, sur une action, comme le clic d'un bouton, appeler la méthode DOM.setStyleAttribute(...) sur l'élément concerné pour changer le curseur
et sur une autre action, changer à nouveau pour revenir sur l'état initial.

[Caroline76]

Merci, mais a quel Element dois-je appliquer ce style ?
J'ai essaye:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
DOM.setStyleAttribute(this.mainPanel.getElement(), 
                    "cursor", "hand");

ou mainPanel est le Panel contenant tous les Panels et composants.
Mais je ne vois aucun changement dans mon application.

[benwit]

Le problème, c'est que ça n'a pas l'air de fonctionner sur tous les attributs css.

Il faut d'abord vérifier sur des composants simple et de premier plan, et contrôler avec un outil comme firebug (une fois compilé pour firefox)
J'essayerai d'abord avec un attribut comme "color" sur un label, et ensuite essayer "cursor" sur ce même label. Et ensuite seulement passer au panel.

Sinon, il faudra passer directement avec une méthode native en JSNI et appeler directement le code javascript qui va bien pour modifier en live le style de l'élément ...

[Caroline76]

Merci,
apparemment, c'est "hand" qui n'est pas reconnu.
En remplacant par "wait", je vois bien le curseur changer. Par contre, comme je m'y attendais, lorsque je survole des boutons ou textbox (par exemple), le curseur change de nouveau. Je ne souhaite pas modifier le style de tous les elements - mais je ne sais pas si j'ai le choix.
Je vais essayer de personnaliser le pointeur maintenant.

En fait, c'est pour un drag'n'drop d'Image vers TreeItem. Il fonctionne, mais il n'y a aucun feedback. Je souhaite que le pointeur change pendant le drag, je ne sais pas encore s'il devra etre une icone specifique ou une miniature de l'image a deplacer.

[Caroline76]

On m'a conseille d'utiliser les CSS pour resoudre mon probleme, comme ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.globalMoveCursor *, .globalMoveCursor .absolutelyPositioned {
    cursor: move;
}

et d'utiliser ce style lorsque je souhaite changer l'icone, comme ca:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

RootPanel.get().addStyleName("globalMoveCursor");

[benwit]

Bonjour,

ça peut être une bonne idée en effet ...

merci de la partager avec nous