qt - QML 中宽度、高度和隐式宽度/高度与相应用例之间的差异

Question

width/height 和有什么区别和 implicitWidth/Height在 QML 中？什么时候应该设置隐式尺寸而不是常规尺寸？什么时候应该从组件/项目中询问隐式尺寸而不是常规尺寸？

Answer 1

一般使用implicitHeight/Width仅在可重用组件中才有意义。

它给出了项目的自然大小的提示，而不强制执行此大小。

让我们来个Image举个例子。图像的自然大小会将图像文件中的一个像素映射到屏幕上的一个像素。但是它允许我们拉伸(stretch)它，所以大小不是强制的，可以被覆盖。

假设现在，我们想拥有一个包含未知维度图片的画廊，我们不想扩大，只在必要时缩小它们。所以我们需要存储图像的自然大小。也就是说，隐含高度发挥作用的地方。

Image {
    width: Math.max(150, implicitWidth)
    height: Math.max(150, implicitHeight)
}

在自定义组件中，您可以选择如何定义尺寸。

一种选择是，拥有与组件相关的所有尺寸 root -node，可能是这样的:

Item {
    id: root
    Rectangle {
        width: root.width * 0.2
        height: root.height * 0.2
        color: 'red'
    }
    Rectangle {
        x: 0.2 * root.width
        y: 0.2 * root.height
        width: root.width * 0.8
        height: root.height * 0.8
        color: 'green'
    }
}

在这种情况下，对象没有自然大小。对于您为组件设置的每个尺寸，一切都完美无缺。

另一方面，您可能有一个具有自然大小的对象 - 发生这种情况，例如如果你有绝对值

Item {
    id: root
    property alias model: repeater.model
    Repeater {
        id: repeater
        delegate: Rectangle {
            width: 100
            height: 100
            x: 102 * index
            y: 102 * index
        }
    }
}

在此示例中，您应该向用户提供有关自然尺寸的信息，其中内容不会突出项目。用户可能仍然决定设置较小的尺寸并处理突出，例如通过剪裁，但他需要有关自然尺寸的信息来做出决定。

在许多情况下， childrenRect.height/width是 implcitHeight/Width 的一个很好的衡量标准，但也有一些例子，这不是一个好主意。 - 例如当item的内容有 x: -500 .

一个真实的例子是 Flickable专门设计用于包含比其自身大小更大的对象。具有 Flickable 的大小等于内容是不自然的。

使用 scale 时也要小心在自定义组件中，因为 childrenRect 不会知道缩放。

Item {
    id: root
    implicitWidth: child.width * child.scale
    implicitHeight: child.height * child.scale
    Rectangle {
        id: child
        width: 100
        height: 100
        scale: 3
        color: 'red'
    }
}

对于您的评论:我只是不明白为什么设置隐式宽度/高度而不是设置组件根尺寸的宽度/高度更好。

implicitWidht/Height are not a necessety - QtQuick could do without them. They exist for convenience and shall be convention.

经验法则

When you want to set dimension of a root node of a reusable component, set implicitWidth/Height.
In some cases, set it for non-root-nodes, if the nodes are exposed as a property.
Do so only, if you have a reason for it (many official components come without any).
When you use a component, set width/height.