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

Posted 2023-02-16

【中文标题】如何将 QSGClipNode 与自定义几何图形一起使用？

【英文标题】：How to use QSGClipNode with custom geometry?

【发布时间】：2017-03-06 06:36:25

【问题描述】：

这是一个示例：

【问题讨论】：

使用setGeometry(QSGGeometry *geometry)到底有什么问题？

我不知道如何使用QSGClipNode 并且官方文档很差。因此，对于任何想知道如何以正确的方式在 QQuickItem 中的场景图中进行剪辑的人来说，这个问题都是一个参考。

你的问题对 *** 来说很糟糕。你试过什么？有没有重现问题的代码？错误或预期效果是什么？这是QSGGeometryNode 的示例：doc.qt.io/qt-5/qtquick-scenegraph-customgeometry-example.html

你试过用QSGClipNode吗？！它不同于QSGGeometryNode。我的问题很简单明了……“如何使用QSGClipNode？”你有使用QSGClipNode的示例代码吗？

【参考方案1】：

QSGClipNode

QSGClipNode 使用其几何来剪辑其子节点的渲染。

因此，要使用它，您首先必须创建代表蒙版的几何体（一组顶点/三角形），并使用setGeometry 方法进行设置。资源稀缺是的，这里有几个使用QSGGeometry 的例子，你需要画出你的“心”形：

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

然后使用appendChildNode 方法在QSGClipNode 中添加您要剪辑的子节点。在您的情况下，QSGImageNode 可能是显示您的图像已剪辑的方式。

其他解决方案：OpacityMask

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

example in Qt documentation 易于使用，只是不要忘记将 Mask 和 Source 的 visible 属性设置为 false，OpacityMask 元素本身将显示裁剪/屏蔽的源。

这是一种用它来剪辑“孩子”的方法（注意：当时未经测试）：

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
    

ma​​in.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 
        //...
    

【讨论】：

好的，我测试它，它会剪切它的子节点。有没有办法剪辑子 QQuickItems？假设在 QML MyClipItem width: 45; height: 45; Rectangle id: rec; width: 50; height: 50; color: "red"; radius: 20 是否可以使用 MyClipItem 剪辑 rec？

好，我认为它可以直接在你的情况下工作，你的 Rectangle 被重新定义为MyClipItem。你试过了吗？

我对其进行了测试，它非常适合作为孩子的QSGNodes，但在之前的评论中，我的名为rec 的矩形没有被剪裁。换句话说，QSGClipNode 不会剪辑 QQuickItems 子项，例如 rec。

请尝试使用 MyClipItem clip: true; /*...*/ ，这应该可以解决问题！

好吧，这其实很正常。我编辑了我的答案以包括 OpacityMask，这可能对您有所帮助，即使在这种情况下您不再需要 GSGClipNode。然而，完全可以在 QQuickItem 中使用 QSGGeometry 作为掩码