Canevas en Java

Version imprimable

26/05/2013, 18h23
rollbich

Canevas en Java

bonjour,

Je débute en java et souhaiterais créer le projet suivant :
- une couche de dessin vectoriel ( des lignes), cette couche pouvant être visible ou invisible
- des objets vectoriels (environ 20 cercles) qui se promènent par dessus
- une zone de texte vectoriel relié par une ligne à un objet cercle qui bougent (translation instantanée) toutes les 4 secondes
- récupérer les 'clicked', 'mouseover' de la souris sur ces même objects et sur la zone de texte correspondante pour réaliser diverses actions
- pouvoir à l'aide de 2 boutons, zoomer ou dezoomer le tout (la couche de dessin et les objets+la zone de texte)

1/ java peut-il faire cela sans librairies externes ?
2/ quelles librairies me conseillez-vous autrement pour réaliser plus facilement un tel projet ?
3/ je me pose surtout la question du zoom/dezoom ?
4 / faut-il faire plusieurs jpanels : un pour le background vectoriel (les lignes) et un pour les objets vectoriels ou alors faire redessiner tout (le background + les objects toutes les 4s)
5/ capter les evenements souris sur des objets vectoriels est-il facile (j'ai vu un tuto ou un mouselistener est mis sur le jpanel et ou on verifie si la position de la souris est sur l'objet ou y a-t-il qqchose de prévu pour cela ?)

merci
bon dimanche:)
26/05/2013, 22h51
ludomacho

bonjour,

oui c'est possible, ton projet ressemble beaucoup à un écran radar sur lequel il y a des plots ( les cercles) et des étiquettes (le texte).

1,2 - J'ai développé ce genre de projet avec swing qui est intégré dans java SE

3 - pour le zoom dezoom j'utilise une classe échelle qui fait le rapport entre la largeur à afficher et la taille de la fenêtre et pareil pour la hauteur. J'utilise un JSlider pour modifier l'échelle et ça fonctionne bien sans ralentissement.

4 - pour l'affichage du fond le mieux est de le mettre dans une BufferedImage qui sera en mémoire donc pas de perte de temps pour le réaffichage et quand tu zoom/dezoom tu modifies la BufferedImage. Je mets cette BufferedImage sur un JPanel et les éléments mouvants sur un autre JPanel au dessus. Je réaffiche tout à chaque fois car pas de problème de perfo sinon il est possible de ne redessiner que les choses qui changes

5 - pour le mouselistener tu peux faire comme le tuto ça fonctionne parfaitement. Sinon tu peux mettre ton texte dans des JPanel et tu mets ton mouseListener sur ces JPanels

bon courage
27/05/2013, 08h40
rollbich

bonjour ludomacho,

Je suis contrôleur aérien et effectivement je souhaite faire un simulateur de contrôle aerien en route. J'ai déjà réalisé ce projet avec mootools et la librairie vectoriel raphael en javascript. Tout fonctionne bien mais les drags d'étiquette sont un peu lents et les capteurs d'evênement ne sont pas rendus instantanément, c'est pourquoi je voulais le porter vers un langage plus rapide.

Concernant la classe zoom pour la couche du dessous, est-ce le fait de mettre dans un bufferedimage permet de garder le dessin en vectoriel, et donc sans perte de qualité car je ne veux pas d'image bitmap ??

Du coup, je pense utiliser des jpanels pour le texte mais chaque étiquette à environ 12 champs donc ça fait 12 jpanels. De plus ces 12 jpanels doivent former un groupe pouvant être 'dragged'.
C'est possible de faire un groupe comme cela ?

Merci beaucoup pour tes précieux conseils.
Y'a plus qu'à coder et comme j'ai jamais fait de java avant, ça va être sportif ! :P
27/05/2013, 18h21
sinok

Mauvaise idée que d'utiliser des JPanels à cet effet.

Il est recommandé pour ce genre de choses de n'utiliser qu'un seul JComponent qui dessinera l'ensemble des formes dans son paintComponent.

Formes étant stockées dans un modèle, en utilisant l'interface Shape et ses implémentations, ou des wrappers autours de cette interface pour enrichir les fonctionnalités.

Pour la gestion des sélections, il te faut combiner le MouoseListener du JComponent avec la méthode contains des shapes présentes.

De même pour le Drag avec les MouseMotionListener.

Et ainsi de suite.

Un empilage de JPanels va s'avérer rapidement trèslourd, hyper chiant pour tout ce qui est gestion d'events et ainsi de suite.
27/05/2013, 19h07
rollbich

bonsoir sinok,

Merci également pour tes conseils. Ca va me permettre de démarrer mon projet dans le bon sens.

Donc j'utiliserai un seul jpanel qui va contenir mes graphismes vectoriels de cercles et de texte.
Pour les évênements, j'ai compris c comme dans le tuto que j'ai vu.

Par contre, pour l'image vectorielle de fond (les lignes), est-il préférable de la séparer dans un autre jpanel transparent ou de tout mettre dans un seul jpanel ? (c peut-être mieux pour la gestion du zoom ??)

Sinon j'ai toujours la question de grouper les 12 textes ensembles pour faire du 'drag' du tout ? c possible facilement ?

Salut,

le jpanel ou le jcomponent est un composant d'interface graphique qui te permet d'afficher ton dessin : si tu veux séparer plusieurs couches de dessin, ne cherche pas à utiliser plusieurs composants swing superposés transparent, mais créer plutôt un classe permettant de dessiner

par exemple,

tu créés une classe

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
public abstract class AbstractDrawer {
 
        private boolean visible;
 
        public AbstractDrawer() {
             visible=true;
        }
 
        public abstract void draw(Graphics g, java.awt.Dimension size);
 
        /**
           * appeler repaint() à chaque fois qu'on modifie 
           */
        public void setVisible(boolean visible) {
           this.visible=visible;
        }
 
        public boolean isVisible() {
            return visible;
        }
 
}

dans ton jpanel (ou jcomponent) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
public class RadarPanel extends JPanel {
 
     private List<AbstractDrawer> drawers = new ArrayList<AbstractDrawer>();
 
     ...
 
     protected void paintComponent(Graphics g) {
           Dimension size = getsize();
           for(AbstractDrawer drawer : drawers) {
                if( drawer.isVisible() ) {
                    drawer.draw(g, size);
                }
           }
     }
 
     ...
 
     public void addDrawer(AbstractDrawer drawer) {
           drawers.add(drawer);
     }
 
     public void removeDrawer(AbstractDrawer drawer) {
           drawers.remove(drawer);
     }
 
     ... // etc toute méthode permettant de manipuler tes différents couches de dessin, en particulier des méthodes permettant de changer l'ordre des couches
 
 
 
 
 
}

ainsi tu peux séparer facilement chaque couche a dessiner, par exemple

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public class GridLayer extends AbstractDrawer {
 
     public void draw(Graphics g, Dimension2D size) {
           for(int i=0; i<size.width; i+=20 ) {
 
                g.drawLine(i,0,i,size.height);
 
           }
           for(int i=0; i<size.height; i+=20 ) {
 
                g.drawLine(0,i,size.width,i);
 
           }
     }
 
}

etc...

29/05/2013, 08h59
joel.drigo

pour pouvoir rendre interactive une couche de dessin, étend ta classe AbstractDrawer, ajoutes un moyen de stocker des objets qui représentent tes objets draggable (par exemple),une méthode qui permet de chercher quel élement correspond à une coordonnées souris

maintenant si tu veux pas avoir à écrire cette api en entier tu peux utiliser une api déjà faite.

j'ai fait personnellement ce genre de chose, avec PICCOLO : tu auras tout le support pour dessiner, faire l'interaction, et bien d'autres choses (en particulier le zoom, l'animation...)
29/05/2013, 09h00
plegat

Salut,

Si ça peut t'aider à démarrer, j'ai un futur tuto qui est dans les tuyaux: ici

Par contre attention, il a juste passé la relecture technique, il faut encore qu'il passe la relecture finale et l'autorisation de publication (d'ailleurs ça serait bien que je me bouge...). Donc officiellement, je ne t'ai rien dit! ;)

Il manque tout le côté "picking", je devrais en parler dans le second article... ou troisième... de la série. Par contre j'ai une implémentation qui fonctionne, donc je pourrai te donner quelques pistes.
29/05/2013, 22h19
rollbich

bonsoir Joel et Jean Michel,

Merci beaucoup pour le code et le tuto, c'est extrêmement intéressant.
J'ai bien compris l'idée, il faut maintenant que j'étudie un peu plus java pour maîtriser tout ça.
Je ne connaissais pas du tout piccolo2D, ça a l'air pas mal du tout !! :P

Je vais maintenant pouvoir m'y mettre dans de bonnes conditions de départ.

Merci encore et bonne soirée

:D
30/05/2013, 10h46
plegat

Citation:

Envoyé par rollbich

Je ne connaissais pas du tout piccolo2D, ça a l'air pas mal du tout !! :P

Tout pareil, je vais regarder et tester également.
30/05/2013, 10h55
joel.drigo

Salut,

je travaille avec Piccolo depuis 7 ou 8 ans, je confirme c'est assez puissant, et n'hésitez pas à me demander des infos sur comment faire ceci ou cela, j'ai fait tellement d'intégration qu'il est fort possible que j'ai déjà eu à traiter le cas

dans le jar, vous trouver une classe ExampleRunner, avec une méthode main : exécutez là et vous pourrez voir une partie de ce qu'on peut faire avec.