如何在图像中制作渐变不透明度? [英] How do I make a gradient opacity in an image?

问题描述

如何使图像在qml中褪色?如何达到此效果?在这里，我附上我想要的图像

How do I make an image fade in qml? How do I achieve this effect? here I attach the image of how I want it to look

推荐答案

一种可行的解决方案是使用 OpacityMask 和 作为来源

A possible solution is to use OpacityMask with a LinearGradient as source

import QtQuick 2.9
import QtQuick.Window 2.2
import QtGraphicalEffects 1.0

Window {
    visible: true
    width: 600
    height: 600
    title: qsTr("Hello World")
    Image {
        id: input
        source: "input.jpg"
        anchors.fill: parent

        OpacityMask {
            source: mask
            maskSource: input
        }

        LinearGradient {
            id: mask
            anchors.fill: parent
            gradient: Gradient {
                GradientStop { position: 0.2; color: "transparent"}
                GradientStop { position: 0.5; color: "white" }
            }
        }
    }
}

输入:

输出:

这篇关于如何在图像中制作渐变不透明度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！