Discussion :

[danyboy85]

Bonjour,

je viens de créer, en JavaFX, 2 panels déplaçables. Cela ressemble à ça :



Le panel est déplaçable en cliquant sur son entête(en noir).

Le problème c'est que lorsque 2 panels se superposent, et donc si 2 entêtes se superposent, l'événement est capté sur les 2 panels.
En clair si je clique sur le bout de la petite flèche rouge que j'ai dessiné et que j'effectue un glisser-déplacer, les 2 panels se déplacent

Existe-il un moyen de modifier ce comportement ?

Merci d'avance

[adiGuba]

Salut,


Quel est le code de ton évènement ?

a++

[danyboy85]

Je t'envoie tout le code car dans mes événements j'utilise des variables déclarées ailleurs dans le code, donc je pense que ce sera plus compréhensible :

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
 
package javafxapplication1;
 
import javafx.application.*;   
import javafx.scene.*;   
import javafx.scene.geometry.*;   
import javafx.scene.paint.*;   
import javafx.input.*;   
import javafx.animation.*;   
import javafx.scene.transform.Translate;
import java.lang.Math;
import javafx.scene.text.Text;
 
// Class to create a draggable group of objects   
public class Panel extends CustomNode{
 
    private attribute wParent = 0.0;   
    private attribute hParent = 0.0;   
    private attribute parentFrame : Frame;
    private attribute left = 0;
    private attribute top = 0;
    private attribute panelID = "panel1";
 
    private attribute grp : Group = Group {
        var endX = 0.0;
        var endY = 0.0;
        var startX = 0.0;
        var startY = 0.0;
        var enteteRectWidth = 300;
        var enteteRectHeight = 50;
        var corpsRectWidth = 300;   
        var corpsRectHeight = 150;  
 
        var enteteRectangle : Rectangle = Rectangle {
            x: left;
            y: top;
            width: enteteRectWidth;
            height: enteteRectHeight;
            fill: LinearGradient {
                startX:0 startY:0 endX:0 endY: 1
                stops: [
                    Stop { offset:0 color:Color.web("#b3b3b3") },
                    Stop { offset:0.08 color:Color.web("#555555") },
                    Stop { offset:0.25 color:Color.web("#131313") },
                    Stop { offset:0.75 color:Color.web("#131313") },
                    Stop { offset:0.95 color:Color.web("#181818") },
                    Stop { offset:1 color:Color.web("#434343") }
                ]
            }
            stroke: Color.fromAWTColor(new java.awt.Color(56, 114, 168))
            arcWidth: 20;
            arcHeight: 20;
            onMousePressed: function(e:MouseEvent):Void {
                startX = e.getDragX()-endX;
                startY = e.getDragY()-endY;
            }
            onMouseDragged: function(e:MouseEvent):Void {                
                var tempEndX = e.getDragX()-startX;
                if (tempEndX+left<0) tempEndX=0-left;
                if (tempEndX>wParent-enteteRectWidth-9-left) tempEndX=wParent-enteteRectWidth-9-left;
                endX = tempEndX;
                var tempEndY = e.getDragY()-startY;
                if (tempEndY+top<0) tempEndY=0-top;
                if (tempEndY>hParent-(enteteRectHeight + corpsRectHeight)-15-top) tempEndY=hParent-(enteteRectHeight + corpsRectHeight)-15-top;
                endY = tempEndY; 
            }
        }
        var corpsRectangle : Rectangle = Rectangle {
            x: left;
            y: top + 30;
            width: corpsRectWidth;
            height: corpsRectHeight;
            fill: Color.WHITE
            stroke: Color.fromAWTColor(new java.awt.Color(56, 114, 168))
        }
 
        transform: bind Translate.translate(endX, endY);
 
        //translateX: bind endX   
        //translateY: bind endY   
 
        content: [
            enteteRectangle,
            corpsRectangle, 
            Text {
               content: bind String.valueOf(endX);
               fill: Color.WHITE
               font: Font { size: 16 style: FontStyle.BOLD  }
               x: left + 10;
               y: top + 23;
            }, CloseButton {
                translateX: left + enteteRectWidth - 30
                //translateX: widgetWidth-32
                translateY: top + 5
                onClicked: function() {
                    grp.visible = false;
                }
            },
        ]
    }
 
    public function create(): Node {
        return grp;
    }
 
    /*
    public attribute fadeIn = Timeline {
        keyFrames: [
            KeyFrame { time:1s values:frame.opacity => 1.0 tween Interpolator.LINEAR },
        ]
    };
    
    public attribute fadeOut = Timeline {
        keyFrames: [
            KeyFrame { time:1s values:frame.opacity => 0.0 tween Interpolator.LINEAR 
                action: function() { System.exit(0); }
            },
        ]
    };
    */
}
 
 
 
var frame : Frame = Frame {
    width: 1024 
    height: 768 
    visible: true  
 
    var panel1 : Panel = Panel {
        panelID: "panel1"
        wParent: bind frame.width
        hParent: bind frame.height
        parentFrame: bind frame
        left : 50
        top : 50
    }
 
    var panel2 : Panel = Panel {
        panelID: "panel2"
        wParent: bind frame.width
        hParent: bind frame.height
        parentFrame: bind frame
        left : 200
        top : 200
    }
 
    stage: Stage { 
        //fill: Color.BLACK   
        content: [ 
            panel1,
            panel2
            /*
            Panel{
                wParent: bind frame.width
                hParent: bind frame.height
                parentFrame: bind frame
            }*/
 
        ]   
    }   
 
    closeAction: function() {   
        java.lang.System.exit( 0 );   
    }
}

Les événements sont les méthodes onMousePressed() et onMouseDragged().

[adiGuba]

Essayes peut-être d'appeler la méthode consume() de ton MouseEvent, pour éviter que l'événement ne soit remonter au parent.

Sinon je ne vois pas...

a++

[danyboy85]

Y'a pas de méthode consume() dans la classe MouseOvent

[adiGuba]

Aucune idée alors.
Je pensais qu'il s'agissait du même MouseEvent qu'avec AWT/Swing...

a++

[danyboy85]

J'ai réussi à appeler consume() avec e.awtMouseEvent.consume()
mais cela ne change rien.

D'ailleurs ce n'est pas l'événement qui se propage. C'est que lors du clic, les 2 panels prennent l'événement, peu importe celui qui superpose l'autre.

J'ai l'impression que les événements JavaFX ne prennent pas en compte le fait que l'objet soit visible ou non, qu'il soit en-dessous ou au-dessus d'un autre composant. Lorsque que l'on clique sur un point X,Y dans l'application, JavaFX recherche tous les composants dont la surface comprend ce point, et il leur dispatche l'événement...

Enfin c'est comme ça que je le ressends... et à partir de là, je ne vois pas bien comment je vais pouvoir m'en sortir

[danyboy85]

J'ai la réponse !!!

Je suis tombé un peu par hasard sur ce topic : http://forums.sun.com/thread.jspa?threadID=5327116 et il y est clairement expliqué qu'il suffit, dans la déclaration de l'événement, de rajouter la propriété :

Code :

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

blocksMouse = true;

Ceci permet de ne pas propgager l'événement (qui est donc bien propagé contrairement à ce que je pensais)

Bonne journée