我需要在 Component.OnCompleted
处理程序中获取Rectangle的宽度和高度,但如果我打印相同的我得到一些未知值,以下是代码:
[EDIT-1] - 添加了更多代码。
import QtQuick 2.6
import QtQuick.Controls 2.2
import QtQuick.Window 2.3
ApplicationWindow {
id: appWindow
visible: true
width: 600
height: 400
title: qsTr("test")
flags: Qt.Window | Qt.FramelessWindowHint
Rectangle{
id:rectParent
width:parent.width * 0.75
height: parent.height * 0.70
Rectangle{
id:rectChild
width:parent.width * 0.75
height: parent.height * 0.70
Component.onCompleted: {
console.log("Width=",width) //prints "0" .
}
}
}
}
如何在onCompleted
中获得宽度,高度?
答案 0 :(得分:3)
好的,我会尝试重新开始:
你的问题是一种误解,隐藏背后的parent
。
import QtQuick 2.6
import QtQuick.Controls 2.0
ApplicationWindow {
id: appWindow
width: 600
height: 400
visible: true
Rectangle {
id: someRect
width: parent.width * 0.7
heigth: parent.height * 0.7
}
}
您可以假设parent
someRect
为appWindow
,parent.width = appWindow.width = 600
。someRect
。 这是错误的
appWindow
的父级不能appWindow
,因为Item
不属于someRect.parent === appWindow.contentItem
类型。事实上,width: parent.width => width: appWindow.contentItem.width
,contentItem
。
问题是,0
的宽度在创建时为appWindow.width
,并且仅在创建后重新设置为someRect.width
。
这意味着0
也是appWindow.contentItem
,直到600
的宽度调整为Component.onCompleted
- 直到appWindow.contentItem
才会发生这种情况。执行。
解决方案是,在{strong> appWindow.width
属性中,从一开始就可以获得import QtQuick 2.6
import QtQuick.Controls 2.0
ApplicationWindow {
id: appWindow
width: 600
height: 400
visible: true
Rectangle {
id: someRect
width: parent.width * 0.7 // depends on appWindow.contentItem.width -> initally 0, changing soon after
heigth: appWindow.height * 0.7 // depends on appWindow.height -> initially 400.
Component.onCompleted: console.log('someRect:', width, height) // prints: "someRect: 0 280"
Rectangle {
id: someOtherRect
width: parent.width * 0.7 // depends on someRect.width which is initally 0 as it depends on appWindow.contentItem.width
height: parent.height * 0.7 // depends on someRect.height which is initally 400 * 0.7
Component.onCompleted: console.log('someOtherRect:', width, height) // prints "someOtherRect: 0, 196"
}
}
}
宽度的依赖关系的快捷方式。
让我们看另一个例子:
appWindow.contentItem
此处,高度将从头开始设置,而宽度只会在height
调整大小后立即更改。因此,最好按照我用于default property alias
。
有许多QML组件,其中父级可能不是,它看起来像什么。对于自定义组件,例如所有使用
Item
推送"儿童"嵌套/layout
s。
答案 1 :(得分:2)
直接嵌套在窗口中的parent
个项目不是窗口,而是窗口contentItem
。
请改为尝试:
Rectangle{
id:rect
width: appWindow.width * 0.75
height: appWindow.height * 0.70
}
这同样适用于您的"完整代码":
Rectangle{
id:rectParent
width:appWindow.width * 0.75
height: appWindow.height * 0.70
Rectangle{
id:rectChild
width:parent.width * 0.75
height: parent.height * 0.70
Component.onCompleted: {
console.log("Width=",width) //prints "Width= 337.5"
}
}
}
您可以在第二个矩形中使用parent
,因为它的父级将是第一个矩形,但由于第一个矩形嵌套在窗口内,因此需要引用窗口而不是其父级来获取属性大小