QML 不透明度继承 [英] QML Opacity Inheritance

问题描述

在 QML 中，如何防止子元素从其父元素继承不透明度?我想为父元素和它的子元素设置不同的不透明度值.

In QML, how can I prevent a child element from inheriting the opacity from its parent? I want to set different opacity values for the parent and it's child element.

推荐答案

实际上，为父元素设置 layer.enabled: true 对我来说是这样的.整个元素被渲染到缓冲区，opacity 被应用到生成的缓冲区(一次应用到整个图层).

Actually, setting layer.enabled: true for the parent element does the thing for me. The whole element is rendered to the buffer, and opacity is applied to the resulting buffer (to the whole layer at once).

参见 http://doc.qt.io/qt-5/qml-qtquick-item.html#layer.enabled-prop

示例代码:

Rectangle {
    width: 400
    height: 200
    opacity: 0.5
    layer.enabled: true
    Rectangle {
            width: parent.width
            height: parent.height
            color: 'red'
    }
    Rectangle {
            width: parent.width / 2
            height: parent.height
            color: 'blue'
    }
}

这是一个解决方案，但请确保在启用分层时知道自己在做什么.

That is a solution, but make sure that you know what you are doing when enabling layering.

另一种可能的解决方案是使用着色器效果.

Another possible solution would be using a shadereffect.

感谢 #qt@freenode 上的 peppe.

Thanks to peppe on #qt@freenode.

这篇关于QML 不透明度继承的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！