Réaliser un resize et une rotation

Version imprimable

Bonjour,

J'ai un composant électrique

http://images3.hiboox.com/vignettes/0708/wcj8z5vm.gif

Celui-ci est composer différentes lignes

J'aimerai réaliser un resize de mon composant.(width et height)
Pour faire un resize d'un simple rectangle, je fais:

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
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
  /**
   * Equipment resize state. This states manages the resizing of a equipment.
   */
  private class EquipmentResizeState extends ControllerState {
    private float                deltaXToResizeVertex;
    private float                deltaYToResizeVertex;
    private SlipEquipment	 selectedPiece;
    private float                oldX;
    private float                oldY;
    private float                oldWidth;
    private float                oldHeight;
    private String               centimerResizeToolTipFeedback;
    private String               inchResizeToolTipFeedback;

    @Override
    public Mode getMode() {
      return Mode.SELECTION;
    }
    
    @Override
    public void enter() {
      this.centimerResizeToolTipFeedback = resource.getString("centimerResizeToolTipFeedback");
      this.inchResizeToolTipFeedback = resource.getString("inchResizeToolTipFeedback");
      this.selectedPiece = (SlipEquipment)slip.getSelectedItems().get(0);
      float [] resizePoint = this.selectedPiece.getGraphicEquipment().getPoints() [2];
      this.deltaXToResizeVertex = getXLastMousePress() - resizePoint [0];
      this.deltaYToResizeVertex = getYLastMousePress() - resizePoint [1];
      this.oldX = this.selectedPiece.getX();
      this.oldY = this.selectedPiece.getY();
      this.oldWidth = this.selectedPiece.getWidth();
      this.oldHeight = this.selectedPiece.getHeight();
      PlanComponent planView = (PlanComponent)getView();
      planView.setResizeIndicatorVisible(true);
      planView.setToolTipFeedback(getToolTipFeedbackText(this.oldWidth, this.oldHeight), 
          getXLastMousePress(), getYLastMousePress());
    }
    
    @Override
    public void moveMouse(float x, float y) {
      // Compute the new location and dimension of the piece to let 
      // its bottom right point be at mouse location
      float angle = this.selectedPiece.getAngle();
      double cos = Math.cos(angle); 
      double sin = Math.sin(angle); 
      float [] topLeftPoint = this.selectedPiece.getGraphicEquipment().getPoints() [0];
      float deltaX = x - this.deltaXToResizeVertex - topLeftPoint[0];
      float deltaY = y - this.deltaYToResizeVertex - topLeftPoint[1];
      float newWidth =  (float)(deltaY * sin + deltaX * cos);
      float newHeight =  (float)(deltaY * cos - deltaX * sin);

      newWidth = Math.max(Math.round(newWidth * 10f) / 10f, 0.1f);
      newHeight = Math.max(Math.round(newHeight * 10f) / 10f, 0.1f);

      // Update piece new location
      float newX = (float)(topLeftPoint [0] + (newWidth * cos - newHeight * sin) / 2f);
      float newY = (float)(topLeftPoint [1] + (newWidth * sin + newHeight * cos) / 2f);
      slip.setEquipmentLocation(this.selectedPiece, newX, newY);
      // Update piece new dimension
      slip.setEquipmentDimension(this.selectedPiece, newWidth, newHeight);


      PlanComponent planView = (PlanComponent)getView();
      // Ensure point at (x,y) is visible
      planView.makePointVisible(x, y);
      planView.setToolTipFeedback(getToolTipFeedbackText(newWidth, newHeight), x, y);
    }

    @Override
    public void releaseMouse(float x, float y) {
      postEquipmentResize(this.selectedPiece, this.oldX, this.oldY, 
          this.oldWidth, this.oldHeight);
      setState(getSelectionState());
    }

    @Override
    public void escape() {
      slip.setEquipmentLocation(this.selectedPiece, this.oldX, this.oldY);
      slip.setEquipmentDimension(this.selectedPiece, 
              this.oldWidth, this.oldHeight);
      setState(getSelectionState());
    }

    @Override
    public void exit() {
      PlanComponent planView = (PlanComponent)getView();
      planView.setResizeIndicatorVisible(false);
      planView.deleteToolTipFeedback();
      this.selectedPiece = null;
    }  
  }

Hors mon composant est un peu plus complexe qu'un simple rectangle.

J'ai essayé, dans ma classe permettant la modification, de modifier seulement les coordonnées de fin de mes différentes lignes (xEnd et yEnd)

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
 
	   /**
            * Sets the width of this equipment.
            * This method should be called from {@link Slip}, which
            * controls notifications when a equipment changed.
                 */	    	   
	   void setWidth(float width) {
		     this.width = width;		     
	        for (EquipmentLine equipmentLine : this.getEquipmentLines()) {
	            equipmentLine.setXEnd(width);
	        }
	        this.shapeCache = null;
		   }
 
	   /**
            * Sets the height of this equipment.
            * This method should be called from {@link Slip}, which
            * controls notifications when a equipment changed.
            */
	   void setHeight(float height) {
	     this.height = height;
	        for (EquipmentLine equipmentLine : this.getEquipmentLines()) {
	            equipmentLine.setYEnd(height);
	        }
	        this.shapeCache = null;
	   }

Mais le résultat est catastrophique
Comment feriez-vous pour faire un resize d'un composant comme le mien?
Pour la rotation, je poserai ma question après :)
Merci de votre aide

07/04/2008, 14h22
corseb

salut!
Tu m'a lair detre balaise, tu veut pas m'aider sur ma question>
http://www.developpez.net/forums/sho...d.php?t=522318

Au passage regarde mon code la bas il taidera pour la rotation!
(il faudra mettre un bounding sphere et c un truc genre rotatorinterpoleur)

Pour le "resize", moi quand je creer ma forme basique genre:

Code:

Bird.addChild(new com.sun.j3d.utils.geometry.Box(.25f,.22f,.45f, primflagsx,apx));

il suffit simplement que je divsie .25f (laxe des x) par deux par example... si je divise tout par 2 genre 12,11,22 en gros, cela me fait un cube identique mais 2 fois plus petit...
:D
07/04/2008, 14h39
pingoui

"Balaise" :arrow: Certainement pas :aie:
Désolé, je ne peux t'aider
07/04/2008, 14h45
sinok

Pour moi l'idée serait de prévoir la fonctionnalité de redimensionnement au moment du dessin de tes composants, c'est à dire de prévoir un ration qui sera appliqué à toutes les opérations de dessin, qui est fixé par défaut à 1 mais peut augmenter/diminuer selon le besoin, une sorte de facteur de zoom en quelque sorte.
Enfin pour me donner une idée serait il possible d'avoir une Image de ce que tu cherches à redimensionner, (car bon, un composant électrique çà peut dire beaucoup de choses)....
07/04/2008, 14h49
pingoui

Salut sinok,

Le composant ressemble à ça :

Citation:

Envoyé par pingoui

http://images3.hiboox.com/vignettes/0708/wcj8z5vm.gif

Bonjour,

d'après ce que j'ai vue la rotation est mise en oeuvre pour le cadre

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
	  /**
           * Renvoie la forme qui entoure l'équipement
           */
	  public Shape getShape() {
		   if (this.shapeCache == null) {
			   System.out.println("GraphicEquipment getShape");
		      //Crée un rectangle de dimension
		      Rectangle2D pieceRectangle = new Rectangle2D.Float(
		    		  getAreaX() /*- this.width / 2*/,
		    		  getAreaY() /*- this.height / 2*/,
		          getWidth(), getHeight());
		      // Applique la rotation du rectangle
		      AffineTransform rotation = new AffineTransform();
		      rotation.setToRotation(this.angle, this.x, this.y);
		      PathIterator it = pieceRectangle.getPathIterator(rotation);
		      GeneralPath pieceShape = new GeneralPath();
		      pieceShape.append(it, false);
		      // Cache shape
		      this.shapeCache = pieceShape;
		    }
		    return this.shapeCache;
		  }

pourquoi ne pas faire la même chose pour le contenu

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
	  /**
           * Création d'un chemin qui relie le premier
           * point au autres point.
           */
	  private Shape getShape(float [][] points) {
		GeneralPath path = new GeneralPath();
		path.moveTo(points [0][0], points [0][1]);
	    for (int i = 1; i < points.length; i++) {
	    	path.lineTo(points [i][0], points [i][1]);
	    }
	    path.closePath();//fermeture du chemin
	    return path;
	  }

deviendrait quelque chose comme (a tester )

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
	  /**
           * Création d'un chemin qui relie le premier
           * point au autres point.
           */
	  private Shape getShape(float [][] points) {
		GeneralPath path = new GeneralPath();
		path.moveTo(points [0][0], points [0][1]);
	    for (int i = 1; i < points.length; i++) {
	    	path.lineTo(points [i][0], points [i][1]);
	    }
	    path.closePath();//fermeture du chemin
        AffineTransform rotation = new AffineTransform();
        rotation.setToRotation(this.angle, this.x, this.y);
        PathIterator it = path.getPathIterator(rotation);
        GeneralPath pieceShape = new GeneralPath();
        pieceShape.append(it, false);
	    return pieceShape;
	  }

à premiere vue la rotation s'effectue (mal mais s'effectue) cela peut-être une direction de solution (plutôt que modifier les coordonnées des traits il est peut-être préférable de transformer sa représentation)

07/04/2008, 16h11
pingoui

Effectivement, cela fonctionne :king: mais de façon hanarchique :mrgreen:
Je ne sais par où commencer pour debuger :oops: vu que cela part dans tout les sens :?

Citation:

Une solution plus jolie serait que la classe GraphicEquipment correspond au bloc Equipement constituer des lignes . ces lignes devrait idéalement être définie de façon relative par rapport au groupe => quand on change x du groupe cela change automatiquement le x de chacune des lignes....

Je me demande si cette solution ne simplifierai pas mes problèmes de resize et de rotation mais je ne vois pas trop comment y arriver:oops:
De plus mon resize, devra me permettre de garder les proportions pour éviter de déformer mon composant électrique
07/04/2008, 16h23
fnobb

Je connais rien en java2D, mais l'idée est peut être de mémoriser la représentation initiale des traits du composant et par la suite ne faire que des transformations en fonction de l'angle et|ou de la translation (comme si s'était une simple image)

Il doit y avoir des docs (avec des exemples)
07/04/2008, 16h48
pingoui

J'ai l'impression que j'ai un problème de coordonnées d'origine !
Lorsque je fais un glisser-déposer d'un équipement celui-ci se dépose aux coordonnées (x,y) en dessous du point de lâché :oops:

De plus, le rectangle englobant mon équipement ne tourne pas avec la même origine que mon équipement !!! Les 2 sont décalés

http://images3.hiboox.com/vignettes/1508/dgepcm9g.gif

L'erreur vient peut être de là car pour moi la rotation comme tu l'as écrit est bonne
07/04/2008, 17h08
fnobb

Tout dépend autour de quoi tu veux le faire tourner lee coin en haut à gauche ou le centre du rectangle
07/04/2008, 17h13
pingoui

Autour du point supérieur gauche du rectangle englobant l'équipement

http://images3.hiboox.com/vignettes/1508/o7d74v9y.gif

Là où j'ai le symbole de rotation

L'idée (à creuser)

-> GraphicEquipment est l'ensemble du composant électrique.
-> Les coordonées des lignes sont défini par rapport au coin de GraphicEquipment

-> le x, y , angle sont ceux du composant

ce qui donne dans une version light

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
 
public class GraphicEquipment implements Serializable{
.....
private Area graphicEquipmentArea;
....
void setX(float x) {
	    this.x = x;
}
 
....
 
	  /**
           * Returns an area matching the union of all <code>lines</code> to do the shapes. 
           */
	  public Area getGraphicEquipmentArea() {
		  System.out.println("GraphicEquipment getGraphicEquipmentArea() equipmentLines"+this.equipmentLines);
          if(graphicEquipmentArea == null) {
              //construction du composant et mise en place
              graphicEquipmentArea = new Area();
    		  for (EquipmentLine equipmentLine : this.equipmentLines) {
    			  graphicEquipmentArea.add(new Area(getShape(equipmentLine.getPoints())));			  
    		  }
          }
          //transformation (une fois le composant initial construit, on se contente de le transformer par rapport aux infos globales)
          AffineTransform rotation = new AffineTransform();
          rotation.rotate(this.angle);
          rotation.translate(x,y);
		  return graphicEquipmentArea.createTransformedArea(rotation);
	  }
 
.......

Ok merci

J'ai modifier setX, setY, setAngle
J'ai modifié getGraphicEquipmentArea()

Par contre, le rectangle englobant l'équipement s'est encore désolidarisé de celui-ci
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 /** * Renvoie la forme qui entoure l'équipement */ public Shape getShape() { if (this.shapeCache == null) { //Crée un rectangle de dimension Rectangle2D pieceRectangle = new Rectangle2D.Float( getAreaX() /*- getWidth() / 2*/, getAreaY() /*- getHeight() / 2*/, getWidth(), getHeight()); // Applique la rotation du rectangle AffineTransform rotation = new AffineTransform(); rotation.setToRotation(this.angle, this.x, this.y); PathIterator it = pieceRectangle.getPathIterator(rotation); GeneralPath pieceShape = new GeneralPath(); pieceShape.append(it, false); // Cache shape this.shapeCache = pieceShape; } return this.shapeCache; }
Cela vient probablement de mon problème de coordonnée !!

Mon programme à une fonction supplémentaire qui permet de générer le dessin des équipements. Hors celui-ci est générer à des coordonnées (x,y) et ces coordonnées qui me polluent !

Il faudrait que j'initialise avant l'affichage les coordonnées pour éviter ce décalage.... Mais je ne vois pas comment faire cela! :oops:

ps: Demain, je reprends le travail. Je serai présent sur le forum que le soir

Merci beaucoup pour ton aide

Citation:

Envoyé par sinok

Pour moi l'idée serait de prévoir la fonctionnalité de redimensionnement au moment du dessin de tes composants, c'est à dire de prévoir un ration qui sera appliqué à toutes les opérations de dessin, qui est fixé par défaut à 1 mais peut augmenter/diminuer selon le besoin, une sorte de facteur de zoom en quelque sorte.

Je dirais meme plus d'avoir une Transform associe a chaque equipement pour son affichage graphique.

Une idee jetee comme ca...
Note : je n'ai pas trop d'idee en ce moment pour ce genre de chose, alors j'espere ne pas trop dire de betises.

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
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
 
/** The reference point (may be the center point or the top left point).
*/
private Point2D refPoint;
 
/** The handle box shape.
*/
private Shape handleBox;
 
/** Calculate initial handle shape based on the shape of the component.
* Calculate initial ref point based on the shape of the component.
*/
private void initialize() {
  [...]
}
 
/** The bounding box of the componant.
* <br>Useful for graphics optimizations, partial redraws, search on click and collision detection.
*/
Public Rectangle getBounds2D() {
  return getHandleBox().getBounds();
}
 
/** The bounding box of the componant.
* <br>Useful for graphics optimizations, partial redraws, search on click and collision detection.
*/
Public Rectangle2D getBounds2D() {
  return getHandleBox().getBounds2D();
}
 
/** A 4 side shape that allows to handle the component.
* It's PathIterator will be followed to draw each handle separatly.
*/
public Shape getHandleBox() {
  [...]
}
 
/** Resets the component to its initial transformation.
*/
public void reset() {
  transform.setToIdentity();
  // transform handle box.
  // Recalculate connection points to the component.
  // Recalculate position.
}
 
public rotate(double theta) {
  transform.rotate(theta, refPoint.getX(), refPoint.getY());
  // transform handle box.
  // Recalculate connection points to the component.
  // Recalculate position.
}
 
public shear(double sx, double sy) {
  transform.shear(sx, sy));
  // transform handle box.
  // Recalculate connection points to the component.
  // Recalculate position.
}
 
public scale(double sx, double sy) {
  transform.scale(sx, sy));
  // transform handle box.
  // Recalculate connection points to the component.
  // Recalculate position.
}
 
public move(double dx, double dy) {
  transform.translate(dx, dy));
  // transform handle box.
  // Recalculate connection points to the component.
  // Recalculate position.
}
 
public void draw(Graphics2D g) {
  Shape handleBox = getHandleBox();
  // Draw handle box and handles.
  Transform oldTransform = g.getTransform();
  g.setTransform(transform);
  // Draw component shape at theta = 0, sx = 0, sy = 0, dx = 0, dy = 0, etc...
  render(g);
  g.setTransform(oldTransform);
}
 
/** Draw component shape at theta = 0, sx = 0, sy = 0, dx = 0, dy = 0, etc...
*/
private void render(Graphics2D d) {
}

08/04/2008, 10h30
Alec6

Franchement si ta rotation peut être quelconque tu devrais vraiment regarder comment ils font dans la 3D, avec le système d'arbre de scène.

Car tu vas avoir de sérieux soucis, à commencer par le calcul des coordonnées à cause des arrondies de calculs.
08/04/2008, 18h55
pingoui

[mode déconnade=on]Moi la 3D :mrgreen: pas possible ;)
Pas equipé pour :mrgreen:

Je suis un bricoleur.... Le developpement n'est pas mon job mais une occupation...

Petite annonce:
Achète cerveau java d'occasion même en mauvaise état :arf:
[mode déconnade=off]

Je ne dois pas être loin. Si quelq'un peut regarder mon problème de coordonnées, cela serait sympa!
:lahola:

Mon problème de coordonnées est résolu :mrgreen:
A la construction de mon équipement, je translate le tout vers le point de coordonnées (0,0)

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
 
	  public Area getGraphicEquipmentArea() {
          if(graphicEquipmentArea == null) {
    		  float xOriginTranslation=0;
    		  float yOriginTranslation=0;
              boolean first = true;
              //construction du composant et mise en place
              graphicEquipmentArea = new Area();
    		  for (EquipmentLine equipmentLine : this.equipmentLines) {    			      			  
    			  if(first){
  				  	xOriginTranslation = equipmentLine.getXStart();
  				  	yOriginTranslation =  equipmentLine.getYStart();
  				    first = false;
  				  }
    			  //Déplacement des formes géographiques composant l'équipement aux points (0,O)
    			  equipmentLine.setXStart(equipmentLine.getXStart() - xOriginTranslation );
    			  equipmentLine.setXEnd(equipmentLine.getXEnd() - xOriginTranslation );
    			  equipmentLine.setYStart(equipmentLine.getYStart() - yOriginTranslation );
    			  equipmentLine.setYEnd(equipmentLine.getYEnd() - yOriginTranslation );  
    			  //Ajouts des formes géographiques à l'équipement
    			  graphicEquipmentArea.add(new Area(getShape(equipmentLine.getPoints())));
    		  }
 
          }                    
          //transformation (une fois le composant initial construit, on se contente de le transformer par rapport aux infos globales)
          AffineTransform transform = new AffineTransform();
          transform.setToRotation(this.angle, this.x, this.y);
          transform.translate(x,y);
		  return graphicEquipmentArea.createTransformedArea(transform);
	  }

Par contre, lors d'une rotation, mon rectangle englobant mon équipement ne tourne pas avec le même angle :? Enfin l'axe de rotation n'est pas le même

Avant rotation :

http://images3.hiboox.com/vignettes/1508/o7d74v9y.gif

Après /pendant la rotation:

http://images3.hiboox.com/vignettes/1508/dgepcm9g.gif

Code du rectangle englobant mon équipement:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
	  /**
           * Renvoie la forme qui entoure l'équipement
           */
	  public Shape getShape() {
		   if (this.shapeCache == null) {
		      //Crée un rectangle de dimension
		      Rectangle2D pieceRectangle = new Rectangle2D.Float(
		    		  this.x - this.width /*/ 2*/,
		    		  this.y /*- getHeight() / 2*/,
		          getWidth(), getHeight());
		      // Applique la rotation du rectangle
		      AffineTransform rotation = new AffineTransform();
		      rotation.setToRotation(this.angle, this.x, this.y);
		      PathIterator it = pieceRectangle.getPathIterator(rotation);
		      GeneralPath pieceShape = new GeneralPath();
		      pieceShape.append(it, false);
		      // Cache shape
		      this.shapeCache = pieceShape;
		    }
		    return this.shapeCache;
		  }

Je ne comprend pas bien pourquoi les deux entités ne tourne pas de la même façon:?

D'avance merci pour votre aide

10/04/2008, 19h33
pingoui

Bonjour,

Désormais mes problèmes de coordonnées, de translation de rotation et de resize sont résolu :mrgreen:

Merci pour votre aide :mrgreen: