如何将 QSGClipNode 与自定义几何一起使用？

Question

如何将 QSGClipNode 与自定义几何一起使用？
这是一个示例：

Answer 1

QSGClipNode

QSGClipNode 使用其几何图形来裁剪其子节点的渲染。

所以要使用它，您首先必须创建代表您的掩码的几何体（一组 vertices/triangles），并使用 setGeometry 方法设置它。资源稀缺是的，这里有几个使用 QSGGeometry 的例子，你需要绘制你的 "heart" 形状：

使用 QSG 创建自定义几何图形的示例：QQuickPolygon
一个 old presentation I made（有点惊讶它出现在 google 第一个结果中）
和一个例子from Qt documentation

然后使用 appendChildNode method to add the children that you want to clip in your QSGClipNode. In your case, QSGImageNode 可能是要走的路，以显示您的图片剪裁。

其他解决方案：OpacityMask

无需深入研究 c++ 场景图类即可使用的另一种解决方案是使用 QtQuick.GraphicalEffect 中的 OpacityMask。它也适用于您在 C++ 中创建的 QtQuickItem。

example in Qt documentation很好用，只是不要忘记将Mask和Source的visible属性设置为false，OpacityMask 元素本身将显示来源 cropped/masked.

这里有一个剪辑"children"的方法（注：当时未测试）：

clipperitem.qml

import QtQuick 2.5
import QtGraphicalEffects 1.0

Item {
    width: 300
    height: 300

    // Item-based children will be mapped to this property
    default property alias clippedContent: clippedItem.children

    // Optional mask property to set it from outside
    property alias mask: opacityMask.mask

    Item {
        id: clippedItem
        anchors.fill: parent
        visible: false
    }

    Item {
        id: defaultMask
        // Your default mask
        visible: false
    }

    OpacityMask {
        id: opacityMask
        anchors.fill: clippedItem
        source: clippedItem
        mask: defaultMask
    }
}

main.qml

ClipperItem {
    // Content here will be clipped. Non item-based elements will have
    // to be explicitly assigned to `ressources` property (i.e. Timer, etc.)
    Rectangle {
        //...
    }
    Image {
        //...
    }
}

如何将 QSGClipNode 与自定义几何一起使用？

How to use QSGClipNode with custom geometry?

qt

qtquick2

clip

scenegraph

qsgclipnode