Qt QML LevelAdjust在应用于svg源时显示奇怪的边缘效果
对图像应用LevelAdjust效果时,Qt似乎无法正确处理边缘 我有一组svg图标,全部用黑色绘制。我想在飞行中轻松地改变它们的颜色。 我正在试验QtGraphicalEffects 1.12的水平调整效果。根据文档,使用minimumOutput应该以线性方式移动颜色曲线:黑色将对应于minimumOutput,白色将是白色,中间的颜色将是minimumOutput的按比例版本 如果我尝试以下方法:Qt QML LevelAdjust在应用于svg源时显示奇怪的边缘效果,qt,svg,qml,Qt,Svg,Qml,对图像应用LevelAdjust效果时,Qt似乎无法正确处理边缘 我有一组svg图标,全部用黑色绘制。我想在飞行中轻松地改变它们的颜色。 我正在试验QtGraphicalEffects 1.12的水平调整效果。根据文档,使用minimumOutput应该以线性方式移动颜色曲线:黑色将对应于minimumOutput,白色将是白色,中间的颜色将是minimumOutput的按比例版本 如果我尝试以下方法: Rectangle { height: 100 width: 100 Imag
Rectangle {
height: 100
width: 100
Image {
id: iconImage
source: "qrc:/images/circles.svg"
anchors.centerIn: parent
width: 0.8 * parent.width
height: width
sourceSize.width: width
sourceSize.height: width
fillMode: Image.PreserveAspectFit
}
LevelAdjust {
anchors.fill: iconImage
source: iconImage
minimumOutput: "#0098FE8F"
}
}
我的svg尽可能简单:
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.0" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<circle cx="50" cy="50" r="50" fill-rule="evenodd" style="paint-order:normal"/>
</svg>
再次感谢 在图像中,必须设置:
可见:false
通过半透明的抗锯齿边,您可以看到LevelAdjust项下的原始黑色图标 这并不是对所问问题的回答,但如果您试图设置SVG图标颜色(而不是调整其级别),我建议您完全按照现在所做的操作,但使用ColorOverlay而不是LevelAdjust-您可以设置图标的确切颜色。可能更容易确定颜色。太好了,只是在我的代码中遵循了你的建议。我猜我在这里展示的代码中唯一的限制是,你不能在颜色代码中控制结果图像的不透明度,但需要在项目的不透明度参数中进行控制…我从来没有想过这一点,我本以为LevelAdjust也会变得不可见。太好了,谢谢!如果LevelAdjust是iconImage的子对象,我相信您是正确的,因为可见性和不透明度从父对象传递到子对象,但在本例中,它们不是,因为它们是兄弟对象。
import QtQuick 2.0
import QtGraphicalEffects 1.12
Item {
id: imageWrapper
property bool colored: true
property string color: "#FFFF0000"
// Replicate some Image properties:
property string source
property var fillMode: Image.PreserveAspectFit
property var status: image.status
property real progress: image.progress
Image {
id: image
source: imageWrapper.source
anchors.fill: parent
sourceSize.width: width
sourceSize.height: height
fillMode: imageWrapper.fillMode
visible: !imageWrapper.colored
}
ColorOverlay {
id: overlay
anchors.fill: image
source: image
color: imageWrapper.color
visible: imageWrapper.colored
}
}