Qt Designer QML DummyContextObject
-
wrote on 7 Mar 2014, 19:03 last edited by
When I design a new object such as a custom button, I define a new Item without specifying the width and the height. If I try to edit this object in Qt Designer I could not see the button because it is collapsed in a point of zero dimension.
Is there a way to tell Qt Creator to put a dummy dimensions to display the button correctly?In the case that the width and height are specified as a function of the parent object dimensions,
in http://qt-project.org/doc/qtcreator-3.0/creator-using-qt-quick-designer.html#creating-dummy-context is explained a way to create a dummy context in order to display the button correctly in the designer but
I can't find the module QmlDesigner 1.0. Anyone know how to do this?Example:
@import QtQuick 2.0
Rectangle {
id: item1
width:parent.width
height:parent.heightText { id: text1 text: qsTr("PROVA") font.pointSize: 26 verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter anchors.fill: parent }
}@
@import QtQuick 1.0
import QmlDesigner 1.0DummyContextObject {
parent: Item {
width: 640
height: 300
}
}@ -
wrote on 11 Mar 2014, 09:05 last edited by
bq. I can’t find the module QmlDesigner 1.0. Anyone know how to do this?
The blog post describes it correctly. The "QmlDesigner" import is just for the designer and not known to QML/the code model.
Note that you can also use the width and height field in the form editor to override width and height of the root item without actually changing the .qml file.
-
wrote on 12 Mar 2014, 15:40 last edited by
Ok I understand. The width and height in the designer do the job of DummyContext.
One more question.
I have the following situation:
@BasicComponent.qml@
@Item{
property Component pageComponent
/CODE/
Loader{
sourceComponent: pageComponent
}
}@@DerivedComponent.qml@
@BasicComponent{
pageComponent: Item{
/CODE/
}
}@when I open the DerivedComponent in Qt Designer I can see the DerivedComponent components but I can't edit them, in fact in the navigator the only element displayed is DerivedComponent without any child. Is there a way to edit the DerivedComponent graphically with QtDesigner in this situation? Which are the alternatives to do this?
Thanks
-
wrote on 12 Mar 2014, 15:55 last edited by
Next to the file name on top of the designer is a combo-box.
There you can select all components defined in the current file and edit them
as if they were defined in a separate file. -
wrote on 12 Mar 2014, 16:47 last edited by
Thanks. I haven't noticed it.
Now the situation is this:
- when "master" is selected I can see all the components but I can't edit them
- when in the combo box I select the item loaded by the Loader I can see the hierarchy of the components in the navigator by I can't see any of them on the canvas. Is it because they are custom components created by me? How can I make Qt Designer aware of these new components?
-
wrote on 12 Mar 2014, 17:17 last edited by
If you components worked in the master document they should work here.
Maybe the size is (0,0) or visibility is false? -
wrote on 12 Mar 2014, 17:27 last edited by
They are visible and they are inside a layout. May the layout cause the problem?
The size of ImageButton is not defined in the source of ImageButton but it should be set by the layout, in fact in the master the two ImageButton are displayed correctly.
@BasicPage {
id: gameModePagepageComponent: Item{ RowLayout { id: rowLayout anchors.fill: parent ImageButton { id: buttonModeFood buttonId: 1 buttonPath: "../images/food.jpg" Layout.preferredWidth: gameModePage.width/3 Layout.preferredHeight: gameModePage.height/3 Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter onBtnClicked: foodGamePage() } ImageButton { id: buttonModeLight buttonId: 1 buttonPath: "../images/laser.jpg" Layout.preferredWidth: gameModePage.width/3 Layout.preferredHeight: gameModePage.height/3 Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter onBtnClicked: lightGamePage() } } }
}@
-
wrote on 12 Mar 2014, 17:29 last edited by
Actually the size of ImageButton is 0,0, if I set it manually I can see the ImageButton. But I expect the layout set the size.
-
wrote on 14 Mar 2014, 19:39 last edited by
This the reason:
RowLayout {
id: rowLayout
anchors.fill: parent <-you anchor to the parent
... -
wrote on 18 Mar 2014, 14:13 last edited by
So, how should I anchor it?
-
wrote on 19 Apr 2014, 09:10 last edited by
If you leave out the anchors.fill: parent , then the layout will resize itself to its content.