在QML中,OpacityMask 是用于实现遮罩效果的组件,它能将一个图形(源元素)按照另一个图形(遮罩)的形状进行裁剪。
基本使用
核心属性:
source:需要被遮罩的元素(被裁剪)
maskSource:遮罩层的来源(通常是 Rectangle 等图形元素,裁剪形状)
注意:在使用的时候,源元素和遮罩元素的visible必须为false;这是因为OpacityMask组件会自动处理这两个元素,不需要显示原始内容。
示例,制作一个圆形头像:
import QtQuick 2.15
import QtGraphicalEffects 1.15Item {width: 120height: 120// 头像图Image {id: imgsource: "qrc:/images/Lena.jpg"visible: falseanchors.fill: parent}// 圆形遮罩Rectangle {id: maskradius: width / 2;visible: falseanchors.fill: parent}// 应用遮罩效果OpacityMask {id: opMasksource: imgmaskSource: maskanchors.fill: img}
}
效果图如下:
将圆形遮罩换成自定义图形图片
代码修改:
Image {id: masksource: "qrc:/images/shape.png"visible: falseanchors.fill: parent
}
运行结果如下图: