项目 QML 类型

一个基本的视觉 QML 类型。 更多...

属性

方法

详细描述

Item类型是Qt Quick中所有视觉元素的基类型。

Qt Quick中所有视觉元素都继承自Item。尽管Item对象没有视觉外观,但它定义了所有视觉元素共有属性,如x和y位置、宽度和高度、锚定和按键处理支持。

Item类型可以用于在单个根视觉元素下分组几个元素。例如

import QtQuick 2.0

Item {
    Image {
        source: "tile.png"
    }
    Image {
        x: 80
        width: 100
        height: 100
        source: "tile.png"
    }
    Image {
        x: 190
        width: 100
        height: 100
        fillMode: Image.Tile
        source: "tile.png"
    }
}

事件处理

所有基于Item的视觉类型都可以使用输入处理程序来处理传入的输入事件(QInputEvent的子类),如鼠标、触摸和按键事件。这是处理事件的推荐声明式方式。

处理触摸事件的另一种方法是子类化QQuickItem,在构造函数中调用setAcceptTouchEvents(),并覆盖touchEvent()方法。接收整个事件以阻止将其传递到下面的项目,并接管事件的所有触摸点。使用QPointerEvent::setExclusiveGrabber()仅获取某些触摸点,并允许事件进一步传递。

同样,QQuickItem子类可以通过调用setAcceptedMouseButtons()来注册接收鼠标按钮事件,通过调用setAcceptHoverEvents()来接收悬停事件(鼠标移动而没有任何按钮被按下),并通过覆盖虚拟函数mousePressEvent()、mouseMoveEvent()和mouseReleaseEvent()。这些函数可以接收事件以防止进一步传递并获得隐式把握;或者显式获取QMouseEvent携带的单一QEventPoint

所有基于项的视觉类型都可以使用附加属性Keys来进行键的识别。附加属性Keys提供了基本信号,例如pressedreleased,以及特定按键的信号,例如spacePressed。以下示例将键盘焦点分配到项中,并通过通用的onPressed处理程序处理左键,通过onReturnPressed处理程序处理回车键。

import QtQuick 2.0

Item {
    focus: true
    Keys.onPressed: (event)=> {
        if (event.key == Qt.Key_Left) {
            console.log("move left");
            event.accepted = true;
        }
    }
    Keys.onReturnPressed: console.log("Pressed return");
}

有关详细文档,请参阅Keys附加属性。

布局镜像

可以使用附加属性LayoutMirroring来镜像项布局。这将导致锚点水平反转,并导致布局项或定位子项(如ListViewRow)在布局中水平反转方向。

有关详细信息,请参阅LayoutMirroring

项图层

项通常将被直接渲染到它所属的窗口中。但是,通过设置layer.enabled,可以将项及其整个子树委托到一个离屏表面上。这时只有离屏表面,一个纹理,将被绘制到窗口中。

如果希望纹理的大小与项的大小不同,可以使用layer.textureSize来实现。要渲染项的某一部分到纹理中,使用layer.sourceRect。也可以指定layer.sourceRect使其超出项的边界。在这种情况下,外部将用透明的像素填充。

如果将layer.smooth设置为true,项将使用线性插值进行缩放;如果将layer.mipmap设置为true,则使用mipmap进行降采样。Mipmapping可能提高降采样项的视觉质量。对于单个Image项的mipmapping,请优先选择Image::mipmap

图层不透明度与项不透明度对比

当将opacity应用到项层次结构时,透明度将应用到每个项上。当透明度应用于子树时,可能导致不期望的视觉结果。考虑以下示例

非分层透明度
Item {
    id: nonLayered

    opacity: 0.5

    width: 100
    height: 100

    Rectangle { width: 80; height: 80; border.width: 1 }
    Rectangle { x: 20; y: 20; width: 80; height: 80; border.width: 1 }
}

以根项的不透明度1渲染图层,然后当绘制时将根项的不透明度应用到纹理上。这意味着在没有重叠伪影的情况下,可以从透明到不透明或反之,逐项alpha混合的正常项可以有较大的项层次结构。

分层透明度
Item {
    id: layered

    opacity: 0.5

    layer.enabled: true

    width: 100
    height: 100

    Rectangle { width: 80; height: 80; border.width: 1 }
    Rectangle { x: 20; y: 20; width: 80; height: 80; border.width: 1 }
}

与ShaderEffects结合使用

layer.enabled设置为true,将项转换为纹理提供者,使其能够直接将项作为纹理使用,例如与ShaderEffect类型结合使用。

可以在运行时使用layer.effect在图层上应用效果。

Item {
    id: layerRoot
    layer.enabled: true
    layer.effect: ShaderEffect {
        fragmentShader: "effect.frag.qsb"
    }
}

有关使用效果的更多信息,请参阅ShaderEffect

注意:layer.enabled 实际上只是使用 ShaderEffectSource 的更便捷方式。

内存和性能

当项的层级启用时,场景图将在 GPU 中分配内存,大小等于 宽度 x 高度 x 4。在内存受限的配置中,应谨慎使用大型层级。

QPainter / QWidget world 中,有时将复杂内容缓存在位图、图像或纹理中是有利的。在 Qt Quick 中,由于场景图渲染器已经应用的技巧,这通常并不适用。由于批处理,过多的绘制调用已经减少,同时在大多数情况下,缓存将混合比原始内容更多的像素。因此,将渲染结果输送到离屏缓冲区以及绘制纹理所涉及的混合操作的开销往往大于简单地让项及其子项正常绘制。

此外,使用层级的项在渲染期间不能 批处理。这意味着具有许多分层项的场景可能会有性能问题。

分层对于视觉效果既方便又有用,但在大多数情况下,效果持续期间应启用分层,之后应禁用。

属性文档

children : list<Item>

resources : list<QtObject>

children 属性包含此项的视觉子项列表。resources 属性包含您希望按名称引用的非视觉资源。

在添加子项或资源时,通常没有必要引用这些属性,因为默认的 data 属性将自动将子对象分配给 children 和 resources 属性。有关详细信息,请参见 data 文档。


height : real

width : real

x : real

y : real

定义了项的位置和大小。默认值是 0

(x, y) 位置相对于 parent

Item { x: 100; y: 100; width: 100; height: 100 }

implicitHeight : real

implicitWidth : real

定义了项的首选宽度和高度。

如果未指定 widthheight,则项的有效大小将根据其 implicitWidthimplicitHeight 确定。

然而,如果项是 layout 的子项,则布局将确定项的首选大小,使用其隐式大小。在这种情况下,显式的 widthheight 将被忽略。

大多数项的默认隐式大小是0x0,但某些项具有固有的隐式大小,无法强制,例如:Image(图像)和 Text(文本)。

设置隐式大小有助于定义基于其内容具有首选大小的组件,例如

// Label.qml
import QtQuick 2.0

Item {
    property alias icon: image.source
    property alias label: text.text
    implicitWidth: text.implicitWidth + image.implicitWidth
    implicitHeight: Math.max(text.implicitHeight, image.implicitHeight)
    Image { id: image }
    Text {
        id: text
        wrapMode: Text.Wrap
        anchors.left: image.right; anchors.right: parent.right
        anchors.verticalCenter: parent.verticalCenter
    }
}

注意:使用 implicitWidth 属性的 TextTextEdit 并显式设置宽度会导致性能损失,因为文本必须重排两次。


activeFocus : bool [只读]

此只读属性表示项是否具有活动焦点。

如果 activeFocus 为真,则此项要么是当前接收键盘输入的项,要么是当前接收键盘输入的项的 FocusScope 祖先。

通常,通过设置项及其包含的 FocusScope 对象的 focus 获得活动焦点。在以下示例中,inputfocusScope 对象将具有活动焦点,而根矩形对象则不会。

import QtQuick 2.0

Rectangle {
    width: 100; height: 100

    FocusScope {
        id: focusScope
        focus: true

        TextInput {
            id: input
            focus: true
        }
    }
}

另请参阅:focusQt Quick中的键盘焦点


activeFocusOnTab : bool

此属性表示项是否希望处于制表符焦点链中。默认情况下,此设置为 false

制表符焦点链通过首先访问父元素,然后按照在 children 属性中出现的顺序遍历其子元素。在制表符焦点链中的项上按 Tab 键将键盘焦点移动到链中的下一个项。按 BackTab(通常为 Shift+Tab)将焦点移动到上一个项。

要设置手动制表符焦点链,请参阅 KeyNavigation。Keys 或 KeyNavigation 中使用的 Tab 键事件优先级高于焦点链行为;忽略其他键处理器中的事件,以允许其传播。


锚点组

anchors.alignWhenCentered : bool

anchors.baseline : AnchorLine

anchors.baselineOffset : real

anchors.bottom : AnchorLine

anchors.bottomMargin : real

anchors.centerIn : Item

anchors.fill : Item

anchors.horizontalCenter : AnchorLine

anchors.horizontalCenterOffset : real

anchors.left : AnchorLine

anchors.leftMargin : real

anchors.margins : real

anchors.right : AnchorLine

anchors.rightMargin : real

anchors.top : AnchorLine

anchors.topMargin : real

anchors.verticalCenter : AnchorLine

anchors.verticalCenterOffset : real

锚点通过指定对象与其他对象之间的关系来定位对象。

边距适用于顶部、底部、左侧、右侧和填充锚点。可以使用 anchors.margins 属性一次性将所有不同的边距设置为相同的值。它不会覆盖已设置的特定边距;要将显式边距清除,将其值设置为 undefined。请注意,边距是锚点特定的,如果项不使用锚点,则不应用这些边距。

偏移量适用于水平居中、垂直居中和基线锚点。

文本锚定到图像下方,水平居中,并带有边距。
Item {
    Image {
        id: pic
        // ...
    }
    Text {
        id: label
        anchors.horizontalCenter: pic.horizontalCenter
        anchors.top: pic.bottom
        anchors.topMargin: 5
        // ...
    }
}

文本的左侧锚定到图像的右侧,带有边距。两者的y属性默认为0。
Item {
    Image {
        id: pic
        // ...
    }
    Text {
        id: label
        anchors.left: pic.right
        anchors.leftMargin: 5
        // ...
    }
}

anchors.fill 提供了一个方便的方法,使一个项目可以具有与另一个项目相同的几何形状,并且与连接所有四个方向锚点等效。

要清除锚点值,将其设置为 undefined

anchors.alignWhenCentered(默认 true)强制居中对齐的锚点对齐到整个像素;如果居中的项的宽度或高度是奇数,则项目将在整个像素上定位,而不会放置在半像素上。这确保了项目被清晰地绘制。在某些情况下,这可能不是必要的,例如在旋转项时,中心四舍五入可能会导致抖动。

注意:您只能将项与兄弟项或父项锚定。

有关更多信息,请参阅 锚点布局


antialiasing : bool

由视觉元素用于决定是否应使用抗锯齿。在某些情况下,启用抗锯齿的项目可能需要更多内存,并且可能渲染得更慢(有关详细信息,请参阅抗锯齿)。

默认值为 false,但可能被派生元素覆盖。


baselineOffset : int

指定项目基线在局部坐标系中的位置。

Text 项的基线是文本所在的可想象线。通常,包含文本的控件将它们的基线设置为文本的基线。

对于非文本项目,使用默认基线偏移量0。


childrenRect group

childrenRect.height : real [只读]

childrenRect.width : real [只读]

childrenRect.x : real [只读]

childrenRect.y : real [只读]

此只读属性保持项子项的总体位置和尺寸。

此属性在需要访问项子项的总体几何形状以便正确调整项大小时很有用。

返回的几何形状是针对项的局部。例如

Item {
    x: 50
    y: 100

    // prints: QRectF(-10, -20, 30, 40)
    Component.onCompleted: print(childrenRect)

    Item {
        x: -10
        y: -20
        width: 30
        height: 40
    }
}

clip : bool

此属性保持是否启用了裁剪。默认裁剪值为 false

如果启用了裁剪,项将裁剪其自己的绘画,以及其子项的绘画,以适应其边界矩形。

注意:裁剪可能会影响渲染性能。有关更多信息,请参阅裁剪


containmentMask : QObject*

此属性包含用于在contains()方法中使用的可选掩码。其主要用途是确定是否已向项中添加指针事件

默认情况下,contains()方法将对项的边界框内的任何点返回true。 containmentMask允许更精细的控制。例如,如果将自定义的 C++ QQuickItem子类,它具有专门的contains()方法,用作containmentMask

Item { id: item; containmentMask: AnotherItem { id: anotherItem } }

itemcontains方法只有在anotherItemcontains实现返回true时才会返回true。

Shape可以用作掩码,使项仅对非矩形区域内的指针事件做出响应

Rectangle {
    width: 90; height: 100
    color: hoverHandler.hovered ? "wheat" : "lightgray"
    containmentMask: shape

    HoverHandler { id: hoverHandler }

    Shape {
        id: shape
        containsMode: Shape.FillContains

        ShapePath {
            fillColor: "lightsteelblue"
            startX: 10; startY: 20
            PathArc {
                x: 10; y: 80
                radiusX: 40; radiusY: 40
                useLargeArc: true
            }
            PathLine {
                x: 10; y: 20
            }
        }
    }
}

也可以在QML中定义含有方法。例如,要创建一个圆形项,它仅对其实际边界内的事件做出响应

Rectangle {
    id: circle
    width: 100; height: width
    radius: width / 2
    color: tapHandler.pressed ? "tomato" : hoverHandler.hovered ? "darkgray" : "lightgray"

    TapHandler { id: tapHandler }
    HoverHandler { id: hoverHandler }

    containmentMask: QtObject {
        property alias radius: circle.radius
        function contains(point: point) : bool {
            return (Math.pow(point.x - radius, 2) + Math.pow(point.y - radius, 2)) < Math.pow(radius, 2)
        }
    }
}

另请参阅Qt Quick 示例 - 形状


data : list<QtObject> [默认]

data属性允许你在项中自由混合视觉子项和资源。如果你将视觉项分配给数据列表,它就成为一个子项;如果你分配任何其他对象类型,就将其添加为资源。

因此,你可以写

Item {
    Text {}
    Rectangle {}
    Timer {}
}

而不是

Item {
    children: [
        Text {},
        Rectangle {}
    ]
    resources: [
        Timer {}
    ]
}

通常不必引用data属性,因为它默认是项的属性,因此所有子项都自动分配到此属性。


enabled : bool

此属性表示项是否接收鼠标和键盘事件。默认情况下为true。

直接设置此属性将直接影响子项的enabled值。当设置为false时,所有子项的enabled值也变为false。当设置为true时,子项的enabled值将返回到true,除非它们明确设置为false

将此属性设置为false会自动将activeFocus设置为false,此项将不再接收键盘事件。

另请参阅visible


focus : bool

此属性表示项在包围的FocusScope内是否有焦点。如果为true,则当包围的FocusScope获得活动焦点时,此项将获得活动焦点。

在以下示例中,当scope获得活动焦点时,input将获得活动焦点

import QtQuick 2.0

Rectangle {
    width: 100; height: 100

    FocusScope {
        id: scope

        TextInput {
            id: input
            focus: true
        }
    }
}

在此属性的目的上,整个场景被视为焦点范围。在实际应用中,这意味着以下QML将在启动时将活动焦点给予input

Rectangle {
    width: 100; height: 100

    TextInput {
          id: input
          focus: true
    }
}

另请参阅activeFocusQt Quick中的键盘焦点


focusPolicy : enumeration [since 6.7]

该属性确定项目接受焦点的方式。

常量描述
Qt.TabFocus项目通过制表符接受焦点。
Qt.ClickFocus项目通过点击接受焦点。
Qt.StrongFocus项目通过制表符和点击都接受焦点。
Qt.WheelFocus项目通过制表符、点击和使用鼠标滚轮接受焦点。
Qt.NoFocus项目不接受焦点。

注意:在 Qt 6.6 及更早版本中,此属性是 Control QML 类型的成员。

此属性在 Qt 6.7 中引入。


layer.effect : Component

保存应用于此层的效果。

效果通常是 ShaderEffect 组件,尽管可以分配任何 Item 组件。效果应具有名称匹配 layer.samplerName 的源纹理属性。

另请参阅layer.samplerName项层


layer.enabled : bool

保存项目是否分层。分层默认是禁用的。

分层项目渲染到离屏表面并缓存,直到它发生变化。为复杂的 QML 项目层次结构启用分层有时可以是优化。

当分层被禁用时,其他分层属性都不会有任何影响。

另请参阅项层


layer.format : enumeration

此属性定义了背衬纹理的格式。修改此属性在指定 layer.effect 时最有意义。

常量描述
ShaderEffectSource.RGBA8 
ShaderEffectSource.RGBA16F 
ShaderEffectSource.RGBA32F 
ShaderEffectSource.Alpha从 Qt 6.0 开始,此值不再使用,实际上与 RGBA8 有相同的效果。
ShaderEffectSource.RGB从 Qt 6.0 开始,此值不再使用,实际上与 RGBA8 有相同的效果。
ShaderEffectSource.RGBA从 Qt 6.0 开始,此值不再使用,实际上与 RGBA8 有相同的效果。

另请参阅项层


layer.live : bool [since 6.5]

当此属性为真时,项目更新时将更新层纹理。否则,它始终是冻结图像。

默认情况下,此属性设置为 true

此属性在 Qt 6.5 中引入。

另请参阅项层


layer.mipmap : bool

如果此属性为真,将为纹理生成米普图。

注意:一些 OpenGL ES 2 实现不支持非 2 的幂次的纹理的米普映射。

另请参阅项层


layer.samplerName : string

保存效果的源纹理属性的名称。

此值必须与效果的源纹理属性的名称相匹配,以便项能够正确地将分层离屏表面传递给效果。

另请参阅layer.effectShaderEffect项层


layer.samples : enumeration

此属性允许在层中请求多采样渲染。

默认情况下,如果整个窗口启用了多采样,则默认启用多采样,前提是使用的场景图渲染器和底层图形 API 支持此功能。

通过将值设置为2、4等,可以在不启用整个场景多采样的情况下,对场景的一部分请求多采样渲染。这样,多采样仅应用于给定的子树,由于多采样不应用于场景的其他部分,因此可以显著提高性能。

注意:启用多采样可能会非常昂贵,无论层的尺寸如何,因为它会产生硬件和驱动程序依赖的性能和内存成本。

注意:此属性仅在支持多样本渲染缓冲区和帧缓冲区混合的情况下才有效。否则,将静默忽略该值。


layer.smooth : bool

表示层是否进行平滑转换。当启用时,对层的纹理进行采样的操作使用 线性插值 进行,而未平滑则使用 最邻近过滤 模式。

默认情况下,此属性设置为 false

另请参阅项层


layer.sourceRect : rect

此属性定义了应渲染到纹理中的项目矩形区域。源矩形可以大于项目本身。如果矩形为空,即默认值,则将整个项目渲染到纹理中。

另请参阅项层


layer.textureMirroring : enumeration

此属性定义了生成的纹理应如何进行镜像。默认值是 ShaderEffectSource.MirrorVertically。自定义镜像如果生成的纹理直接由自定义着色器(如由 ShaderEffect 指定)访问时可能很有用。如果对分层项目未指定效果,则镜像对项目的UI表示没有影响。

常量描述
ShaderEffectSource.NoMirroring无镜像
ShaderEffectSource.MirrorHorizontally生成的纹理在X轴上翻转。
ShaderEffectSource.MirrorVertically生成的纹理在Y轴上翻转。

layer.textureSize : size

此属性包含层纹理请求的像素大小。如果它为空,即默认值,则使用项目的尺寸。

注意:某些平台对帧缓冲对象的大小有限制,这意味着实际纹理大小可能大于请求的大小。

另请参阅项层


layer.wrapMode : enumeration

此属性定义与纹理关联的包装模式。修改此属性最有意义时,layer.effect 被指定。

常量描述
ShaderEffectSource.ClampToEdgeGL_CLAMP_TO_EDGE水平垂直
ShaderEffectSource.RepeatHorizontallyGL_REPEAT水平,GL_CLAMP_TO_EDGE垂直
ShaderEffectSource.RepeatVerticallyGL_CLAMP_TO_EDGE水平,GL_REPEAT垂直
ShaderEffectSource.RepeatGL_REPEAT水平垂直

注意:某些OpenGL ES 2实现不支持非2的幂次的纹理与GL_REPEAT包装模式。

另请参阅项层


opacity : real

此属性包含项的不透明度。不透明度以介于0.0(完全透明)和1.0(完全不透明)之间的数字表示。默认值是1.0。

当设置此属性时,指定的不透明度还将单独应用于子项。在某些情况下,这可能会产生意想不到的影响。例如,在下面的第二个矩形集中,红色矩形指定了不透明度为0.5,这影响了其蓝色子矩形的透明度,尽管子矩形没有指定透明度。

Item {
    Rectangle {
        color: "red"
        width: 100; height: 100
        Rectangle {
            color: "blue"
            x: 50; y: 50; width: 100; height: 100
        }
    }
}

Item {
    Rectangle {
        opacity: 0.5
        color: "red"
        width: 100; height: 100
        Rectangle {
            color: "blue"
            x: 50; y: 50; width: 100; height: 100
        }
    }
}

调整项的透明度不影响该项是否接收用户输入事件。(相比之下,将 visible 属性设置为 false 会阻止鼠标事件,而将 enabled 属性设置为 false 会阻止鼠标和键盘事件,并且还会将活动的焦点从该项移除。)

另请参阅visible


palette : 调色板 [自 6.0 开始]

此属性包含当前为项设置的调色板。

此属性描述了项所请求的调色板。调色板在项的样式渲染所有控件时使用,并且可以作为确保自定义控件与本地平台的本地外观和感觉保持一致的手段。不同的平台或不同的样式为应用程序定义不同的调色板是很常见的。

默认调色板取决于系统环境。《a href="qml-qtquick-controls-applicationwindow.html" translate="no">ApplicationWindow 维护一个系统/主题调色板,该调色板作为所有控件的默认值。某些类型的控件可能有特殊的默认调色板。您也可以通过以下方式设置控件的默认调色板:

项会从父项继承显式的调色板属性到子项。如果您更改项的调色板上的具体属性,则会将该属性传播到所有子项,覆盖该属性的任何系统默认值。

Item {
    palette {
        buttonText: "maroon"
        button: "lavender"
    }

    Button {
        text: "Click Me"
    }
}

此属性是在 Qt 6.0 中引入的。

另请参阅 Window::palettePopup::paletteColorGroupPaletteSystemPalette


parent : Item

此属性包含项的视觉父项。

注意:“视觉父项”的概念与“QObject 父项”的概念不同。项的视觉父项不一定与其实例的父项相同。有关更多详细信息,请参阅 概念 - Qt Quick 中的视觉父项


rotation : real

此属性包含项围绕其 transformOrigin 顺时针旋转的角度。

默认值为 0 度(即,没有旋转)。

Rectangle {
    color: "blue"
    width: 100; height: 100
    Rectangle {
        color: "red"
        x: 25; y: 25; width: 50; height: 50
        rotation: 30
    }
}

另请参阅 TransformRotation


scale : real

此属性包含此项的缩放因子。

小于 1.0 的缩放会使项以较小的大小渲染,而大于 1.0 的缩放会使项以较大的大小渲染。负缩放会导致渲染时项被镜像。

默认值为 1.0。

缩放是从 transformOrigin 应用的。

import QtQuick 2.0

Rectangle {
    color: "blue"
    width: 100; height: 100

    Rectangle {
        color: "green"
        width: 25; height: 25
    }

    Rectangle {
        color: "red"
        x: 25; y: 25; width: 50; height: 50
        scale: 1.4
        transformOrigin: Item.TopLeft
    }
}

另请参阅 TransformScale


smooth : bool

主要用于基于图像的项,以决定项是否应该使用平滑采样。平滑采样通过线性插值执行,而非平滑采样则通过最近邻执行。

在 Qt Quick 2.0 中,此属性对性能的影响很小。

默认情况下,此属性设置为 true


state : string

此属性包含项当前状态的名称。

如果项目处于默认状态,即未设置任何明确状态,则该属性包含一个空字符串。同样地,您可以将该项目还原到默认状态,方法是将该属性设置为空字符串。

另请参阅Qt Quick 状态.


states : list<State>

此属性包含该项目的所有可能状态。要更改该项目的状态,将state属性设置为这些状态之一,或将state属性设置为空字符串,以将项目还原到其默认状态。

此属性指定为一系列State对象。例如,以下是一个具有"red_color"和"blue_color"状态的项

import QtQuick 2.0

Rectangle {
    id: root
    width: 100; height: 100

    states: [
        State {
            name: "red_color"
            PropertyChanges { root.color: "red" }
        },
        State {
            name: "blue_color"
            PropertyChanges { root.color: "blue" }
        }
    ]
}

请参阅Qt Quick 状态Qt Quick中的动画和过渡以获取关于使用状态和过渡的更多详细信息。

另请参阅transitions.


transform : list<Transform> [只读]

此属性包含要应用的变换列表。

有关更多信息,请参阅Transform


transformOrigin : enumeration

此属性包含围绕该点进行缩放和旋转的来源点。

下面有九个变换来源,默认变换来源是Item.Center

此示例围绕图像的右下角进行旋转。

Image {
    source: "myimage.png"
    transformOrigin: Item.BottomRight
    rotation: 45
}

要设置任意变换来源点,请使用具有transform属性缩放旋转变换类型。


transitions : list<Transition>

此属性包含该项目要应用的过渡列表。这些定义了在更改state时应用到项目上的过渡。

此属性指定为一系列Transition对象。例如

import QtQuick 2.0

Item {
    transitions: [
        Transition {
            //...
        },
        Transition {
            //...
        }
    ]
}

请参阅Qt Quick 状态Qt Quick中的动画和过渡以获取关于使用状态和过渡的更多详细信息。

另请参阅states.


visible : bool

此属性包含项目是否可见。默认情况下为true。

直接设置此属性将直接影响子项的visible值。当设置为false时,所有子项的visible值也将设置为false。当设置为true时,子项的visible值将返回到true,除非它们已显式设置为false

(由于这种级联行为,如果属性绑定应仅对显式属性更改做出响应,则使用visible属性可能不会产生预期效果。在这种情况下,最好使用opacity属性代替。)

如果将该属性设置为 false,则该元素将不再接收鼠标事件,但将继续接收按键事件,并且如果已经设置,将保留键盘 焦点。 (相比之下,将 启用 属性设置为 false 将停止接收鼠标和键盘事件,并且从该元素中移除焦点。)

注意:此属性值仅受对此属性或父 可见性 属性的更改影响。例如,如果此元素移出屏幕或 不透明度 变为 0,它不会改变。

另请参阅:不透明度启用


visibleChildren : 列表<元素>

此只读属性列出了当前所有可见的子元素。请注意,子元素的可见性可能已明确更改,或因为此(它的父)元素的可见性或其他祖父母的可见性发生更改。


z : 实数

设置兄弟元素的堆叠顺序。默认堆叠顺序为 0。

堆叠值较高的元素将绘制在堆叠顺序较低的兄弟元素之上。具有相同堆叠值的元素根据它们出现的顺序从下往上绘制。堆叠值为负的元素将绘制在其父内容之下。

以下示例显示了堆叠顺序的不同效果。

相同的 z - 后续子元素位于较早子元素之上
Item {
    Rectangle {
        color: "red"
        width: 100; height: 100
    }
    Rectangle {
        color: "blue"
        x: 50; y: 50; width: 100; height: 100
    }
}

更高的 z 在顶部
Item {
    Rectangle {
        z: 1
        color: "red"
        width: 100; height: 100
    }
    Rectangle {
        color: "blue"
        x: 50; y: 50; width: 100; height: 100
    }
}

相同的 z - 子元素位于父元素之上
Item {
    Rectangle {
        color: "red"
        width: 100; height: 100
        Rectangle {
            color: "blue"
            x: 50; y: 50; width: 100; height: 100
        }
    }
}

较低的 z 在底部
Item {
    Rectangle {
        color: "red"
        width: 100; height: 100
        Rectangle {
            z: -1
            color: "blue"
            x: 50; y: 50; width: 100; height: 100
        }
    }
}

方法文档

mapFromItem(元素 item, p)

mapFromItem(元素 item, 实数 x, 实数 y)

矩形 mapFromItem(元素 item, 实数 x, 实数 y, 实数 宽度, 实数 高度)

矩形 mapFromItem(元素 item, 矩形 r)

item 坐标系中的点 (x, y) 或矩形 (x, y, 宽度, 高度) 映射到此元素坐标系中,并返回一个匹配映射坐标的 矩形

在映射中使用以下元素属性: xy比例旋转变换原点变换

如果 item 是一个 null 值,则将该点或矩形从 场景 坐标系映射过来。

从 Qt 5.15 版本开始接受点和矩形的版本。


point mapToItem(Item item, point p)

point mapToItem(Item item, real x, real y)

rect mapToItem(Item item, real x, real y, real width, real height)

rect mapToItem(Item item, rect r)

将在此项坐标系统中的点(xy)或矩形(xywidthheight)映射到item的坐标系统,并返回匹配映射坐标的矩形

在映射中使用以下元素属性: xy比例旋转变换原点变换

如果itemnull值,则将该点或矩形映射到场景的坐标系统。

从 Qt 5.15 版本开始接受点和矩形的版本。


childAt(real x, real y)

返回位于此项坐标系统中的点(xy)内第一个可见子项。

如果没有这样的项,则返回null


bool contains(point point)

如果此项包含局部坐标中的point,则返回true;否则返回false。这和在进行事件分发期间用于QEventPoint的击测试用的检查是相同的,并且如果设置了,会受containmentMask的影响。


[since 6.3] dumpItemTree()

递归地输出从当前项及其子项开始的项的可视树的一些详细信息。

输出看起来与以下 QML 代码类似

function dump(object, indent) {
    console.log(indent + object)
    for (const i in object.children)
        dump(object.children[i], indent + "    ")
}

dump(myItem, "")

因此,如果您想了解更多信息,您可以实现自己的函数并向控制台.log添加额外的输出,例如特定属性的值。

此方法是在 Qt 6.3 中引入的。

另请参阅QObject::dumpObjectTree


forceActiveFocus()

强制在项上激活焦点。

此方法将焦点设置在项上,并确保对象层次结构中的所有先祖FocusScope对象也获得了focus

焦点更改的原因将是Qt::OtherFocusReason。使用重载方法来指定焦点原因,以更好地处理焦点更改。

另请参阅activeFocus


forceActiveFocus(Qt::FocusReason reason)

这是一个重载函数。

用给定的reason强制在项上激活焦点。

此方法将焦点设置在项上,并确保对象层次结构中的所有先祖FocusScope对象也获得了focus

另请参阅activeFocusQt::FocusReason


bool grabToImage(回调函数, 目标大小)

将项目捕获到内存中的图像。

捕获操作是异步的,当捕获完成时调用JavaScript函数callback。回调和操作结果一起返回,是一个ItemGrabResult对象。

使用targetSize来指定目标图像的大小。默认情况下,结果将与项目的大小相同。

如果无法启动捕获,则函数返回代码false

以下代码片段展示了如何捕获项并存储结果到文件中

Rectangle {
    id: sourceRectangle
    width: 100
    height: 100
    focus: true
    gradient: Gradient {
        GradientStop { position: 0; color: "steelblue" }
        GradientStop { position: 1; color: "black" }
    }

    Keys.onSpacePressed: {
        sourceRectangle.grabToImage(function(result) {
           result.saveToFile("something.png")
        })
    }
}

以下代码片段展示了如何捕获项并在另一个图像元素中使用结果

Image {
    id: image
}

Keys.onSpacePressed: {
    sourceRectangle.grabToImage(function(result) {
        image.source = result.url
    }, Qt.size(50, 50))
}

注意:此函数将项目渲染到离屏表面,并将该表面从GPU内存复制到CPU内存,这可能非常耗费资源。对于“实时”预览,请使用ShaderEffectSource


point mapFromGlobal(real x, real y)

将全局坐标系统中的点(x, y)映射到项的坐标系统,并返回匹配映射坐标的点point

在映射中使用以下元素属性: xy比例旋转变换原点变换


point mapToGlobal(real x, real y)

将此项的坐标系统中的点(x, y)映射到全局坐标系统,并返回匹配映射坐标的点point

在映射中使用以下元素属性: xy比例旋转变换原点变换


nextItemInFocusChain(bool forward)

返回关注链中与该项相邻的项。如果forwardtrue或者未提供,则为正向方向的下一个项。如果forwardfalse,则为反向方向的下一个项。


© 2024 Qt公司有限公司。本文件中包含的文档贡献是各自所有者的版权。提供的文档依据GNU自由文档许可证版本1.3(由自由软件基金会发布)下的条款许可。Qt及其相关标志是芬兰和/或其他国家的Qt公司有限公司的商标。所有其他商标均为其各自所有者的财产。