Centrer un item dans son parent

Version imprimable

2 pièce(s) jointe(s)

Bonsoir...

Je développais une petite extension pour le framework GraphicsView de Qt pour fournir des gizmos (comme ceux des logiciels de créa 3D), et vu que QtQuick est bien parti pour en être un remplaçant, autant ne pas resté ancré dans le passé. Je porte donc le tout sous QML.

Je m'arrache les cheveux sur un problème (qui semble) tout simple. J'arrête donc et je m'en remets à vous :oops:

J'utilise une classe C++ "QuickTranslateGizmo" qui dérive de QQuickPaintedItem pour le gizmo, que j'enregistre dans un plugin QML. Mon fichier de test ressemble à cela :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 Item { id: b width: 100 height: 100 x: 50 y: 50 TranslateGizmo { width: 150 height: 150 manipulatedItem: b currentConstraint: TranslateGizmo.xyPlane } }
A terme je souhaite que le développeur n'aie même pas à fixer la taille et encore moins la position du gizmo depuis le QML. Pour la taille, je pense que c'est possible en utilisant un setProperty ou équivalent depuis la classe C++, vous confirmez ?

Enfin...le problème principal, c'est celui que vous pouvez voir sur la capture ci-dessous. Je n'arrive pas à centrer mon gizmo dans son item parent. Je souhaite juste que leurs centres respectifs coïncident, et je souhaite le faire depuis la classe C++ (donc pas d'utilisation d'anchors). Pour la version GraphicsView, c'était facile, un setPosition() et c'était bon. Mais là, j'ai beau retourner le problème dans tous les sens, je ne vois pas.

Je précise que je n'ai pas utilisé QQuickItem::setPosition() directement : je suis bien passé par un setProperty comme le demande la doc.
J'ai aussi tenté un mapToScene, cela n'a aucun effet...

Voici la capture :

Pièce jointe 164971

En bleu, le boundingRect de l'item auquel est appliqué le gizmo. En son centre, vous pouvez voir que j'affiche le centre de son boundingRect ainsi que sa position.

J'ai fais de même avec le gizmo, cette fois en noir. Sa position est indiquée à l'origine de son parent. Et là je ne comprends pas comment faire en sorte que "le centre du bounding rect (que vous voyez en dessous) ne coïncide avec sa position".

Ci-dessous la capture après avoir déplacé le gizmo à la position de son parent avec :
Code:

1 2 3 4 5 // QuickTranslateGizmo.cpp // 'manipulated' est l'item auquel est appliqué le gizmo QPointF manipulatedCenter = manipulated->boundingRect().center(); setProperty("x", manipulatedCenter.x()); setProperty("y", manipulatedCenter.y());
Pièce jointe 164973

En une phrase, je souhaite que le centre (des boundingRect, donc) de l'item et du gizmo soit le même...

Si vous avez des pistes, des conseils, je suis preneur...

Merci !

29/12/2014, 20h30
loupium
Bonsoir,
Dans les logiciels de création 3D, chaques objets possèdent une origine. Origine objet qui est relatif à l'objet et qui d'ailleurs peut être redefinie.
Donc tes objets doivent avoir une proprièté qui se nomme "origin". Cette proprièté peut par exemple être initialisée par défaut au centre de l'objet. Optionnellement, l'utilisateur pourrait changer cette origine en faisant par exemple:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 Item { width: 100 height: 100 x: 50 y: 50 // Optionnelle origin.x: 20 origin.y: 30 // TranslateGizmo { ... } }
Quant au gizmos, il initialisera sont x et y avec la proprièté origin disponible de son parent (l'objet) dans le constructeur c++ de ta class QuickTranslateGizmo. Idem pour width et height du gizmos qui pourra par exemeple être initialisé en fonction de la taille de son parent.
03/01/2015, 10h08
GilbertLatranche

Hello,

Merci pour ta réponse, je vais tester ça tout à l'heure.

N'y aurait-il pas moyen, dans un premier temps, de se passer d'une propriété origin ? Je pensais développer deux libs : une permettant d'appliquer un gizmo à n'importe quel item QtQuick, une autre qui utiliserait la première pour proposer diverses fonctionnalités.

Bonjour,
Pour aller plus loin, les logiciels de création 3D n'ont qu'un seul Gizmo, celui de l'objet sélectionné.

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
// Item {
Rectangle {
	color: "green"
	width: 150
	height: 150
	MouseArea {
		anchors.fill: parent
		onClicked: {
                        gizmo.parent = parent
                        gizmo.opacity = 1
                }
	}
	Text {
		text: qsTr("Clique moi !")
	}
}
Rectangle {
	color: "blue"
	width: 150
	height: 150
	x: 200
	MouseArea {
		anchors.fill: parent
		onClicked: {
                        gizmo.parent = parent
                        gizmo.opacity = 1
                }
	}
	Text {
		text: qsTr("Clique moi !")
	}
}
// TranslateGizmo {
Rectangle {
	id: gizmo
	width: 100
	height: 100
	color: "red"
	opacity: 0
	onParentChanged: {
                console.log("gizmo : " + parent);
                gizmo.x = parent.width / 2 - gizmo.width / 2
                gizmo.y = parent.height / 2 - gizmo.height / 2
        }
	MouseArea {
		anchors.fill: parent
		drag.target: gizmo.parent
	}
 
	Text {
		text: qsTr("bouge moi !")
	}
}

05/01/2015, 17h18
GilbertLatranche

Bonsoir,

Merci pour ton extrait de code.

En fait, je vois d'où vient le problème : le système de coordonnées local des items QtQuick est différent de celui du framework GraphicsView (que l'ancienne version du projet utilisait - et forcément ça passait comme crème).

A moins que je ne me trompe, l'origine d'un item GraphicsView est son centre tandis que celui d'un item QtQuick est son topLeft...et ça me gêne vraiment, j'en ai presque honte :aie:

Aurais-tu des pistes pour prendre cela en compte ?

Merci beaucoup !
08/01/2015, 19h07
loupium

Bonsoir,

Citation:

A moins que je ne me trompe, l'origine d'un item GraphicsView est son centre tandis que celui d'un item QtQuick est son topLeft...

sauf que ce n'est pas des GraphicsView que tu manipule mais des GraphicsItem dont l'origine est bien topLeft. Toutes les coordonnées dans Qt sont topLeft.
D'ailleurs Qt Quick 1 est basé sur GraphicsView.