在qt中更改svg的颜色

时间:2021-10-26 18:57:57

I have a svg loaded in the resources, but it is black. How do I change the color to white?

我有一个svg加载资源,但它是黑色的。如何将颜色更改为白色?

4 个解决方案

#1


5  

This is how you can do it in Qt, don´t forget to add the xml and svg modules to your qt project (*.pro file). This code snippet changes the color by modifying the "fill" attribute of any "path" element but you could use it to modify any attribute of any element.

这是你在Qt中如何做到这一点,不要忘记将xml和svg模块添加到你的qt项目(* .pro文件)。此代码段通过修改任何“path”元素的“fill”属性来更改颜色,但您可以使用它来修改任何元素的任何属性。

void SetAttrRecur(QDomElement &elem, QString strtagname, QString strattr, QString strattrval);

void ChangeSVGColor()
{

    // open svg resource load contents to qbytearray
    QFile file("myfile.svg");
    file.open(QIODevice::ReadOnly);
    QByteArray baData = file.readAll();
    // load svg contents to xml document and edit contents
    QDomDocument doc;
    doc.setContent(baData);
    // recurivelly change color
    SetAttrRecur(doc.documentElement(), "path", "fill", "white");
    // create svg renderer with edited contents
    QSvgRenderer svgRenderer(doc.toByteArray());
    // create pixmap target (could be a QImage)
    QPixmap pix(svgRenderer.defaultSize());
    pix.fill(Qt::transparent);
    // create painter to act over pixmap
    QPainter pixPainter(&pix);
    // use renderer to render over painter which paints on pixmap
    svgRenderer.render(&pixPainter);
    QIcon myicon(pix);
    // Use icon ....    

}


void SetAttrRecur(QDomElement &elem, QString strtagname, QString strattr, QString strattrval)
{
    // if it has the tagname then overwritte desired attribute
    if (elem.tagName().compare(strtagname) == 0)
    {
        elem.setAttribute(strattr, strattrval);
    }
    // loop all children
    for (int i = 0; i < elem.childNodes().count(); i++)
    {
        if (!elem.childNodes().at(i).isElement())
        {
            continue;
        }
        SetAttrRecur(elem.childNodes().at(i).toElement(), strtagname, strattr, strattrval);
    }
}

#2


5  

Since the SVG format is XML based, and XML is just ASCII text... you could load the SVG resource in to a QString, call QString::replace("\"#000000\"", "\"#ffffff\""), and then pass the modified QString in to your QSVGRenderer.

由于SVG格式是基于XML的,而XML只是ASCII文本...您可以将SVG资源加载到QString中,调用QString :: replace(“\”#000000 \“”,“\”#ffffff \“ “),然后将修改后的QString传递给您的QSVGRenderer。

#3


2  

As long as you don't need it on Mac, this should work:

只要你在Mac上不需要它,这应该工作:

http://doc-snapshot.qt-project.org/4.8/qwidget.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qwidget.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qgraphicscolorizeeffect.html

http://doc-snapshot.qt-project.org/4.8/qgraphicscolorizeeffect.html

EDIT: Or if you need to support Mac, do the svg rendering and effects inside a QGraphicsView.

编辑:或者如果您需要支持Mac,请在QGraphicsView中执行svg渲染和效果。

http://doc-snapshot.qt-project.org/4.8/qgraphicsitem.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qgraphicsitem.html#setGraphicsEffect

Setup your colorize effect to color it white, and set it to the svgWidget.

设置您的着色效果以将其着色为白色,并将其设置为svgWidget。

Hope that helps.

希望有所帮助。

#4


0  

If white is the only color you need, then a simple solution would be to change the color of the original SVG image with an image editor (e.g. Inkscape). Of course, if you need use the image with many different colors, that wont be a reasonable solution.

如果白色是您需要的唯一颜色,那么一个简单的解决方案是使用图像编辑器(例如Inkscape)更改原始SVG图像的颜色。当然,如果您需要使用具有许多不同颜色的图像,那么这不是一个合理的解决方案。

#1


5  

This is how you can do it in Qt, don´t forget to add the xml and svg modules to your qt project (*.pro file). This code snippet changes the color by modifying the "fill" attribute of any "path" element but you could use it to modify any attribute of any element.

这是你在Qt中如何做到这一点,不要忘记将xml和svg模块添加到你的qt项目(* .pro文件)。此代码段通过修改任何“path”元素的“fill”属性来更改颜色,但您可以使用它来修改任何元素的任何属性。

void SetAttrRecur(QDomElement &elem, QString strtagname, QString strattr, QString strattrval);

void ChangeSVGColor()
{

    // open svg resource load contents to qbytearray
    QFile file("myfile.svg");
    file.open(QIODevice::ReadOnly);
    QByteArray baData = file.readAll();
    // load svg contents to xml document and edit contents
    QDomDocument doc;
    doc.setContent(baData);
    // recurivelly change color
    SetAttrRecur(doc.documentElement(), "path", "fill", "white");
    // create svg renderer with edited contents
    QSvgRenderer svgRenderer(doc.toByteArray());
    // create pixmap target (could be a QImage)
    QPixmap pix(svgRenderer.defaultSize());
    pix.fill(Qt::transparent);
    // create painter to act over pixmap
    QPainter pixPainter(&pix);
    // use renderer to render over painter which paints on pixmap
    svgRenderer.render(&pixPainter);
    QIcon myicon(pix);
    // Use icon ....    

}


void SetAttrRecur(QDomElement &elem, QString strtagname, QString strattr, QString strattrval)
{
    // if it has the tagname then overwritte desired attribute
    if (elem.tagName().compare(strtagname) == 0)
    {
        elem.setAttribute(strattr, strattrval);
    }
    // loop all children
    for (int i = 0; i < elem.childNodes().count(); i++)
    {
        if (!elem.childNodes().at(i).isElement())
        {
            continue;
        }
        SetAttrRecur(elem.childNodes().at(i).toElement(), strtagname, strattr, strattrval);
    }
}

#2


5  

Since the SVG format is XML based, and XML is just ASCII text... you could load the SVG resource in to a QString, call QString::replace("\"#000000\"", "\"#ffffff\""), and then pass the modified QString in to your QSVGRenderer.

由于SVG格式是基于XML的,而XML只是ASCII文本...您可以将SVG资源加载到QString中,调用QString :: replace(“\”#000000 \“”,“\”#ffffff \“ “),然后将修改后的QString传递给您的QSVGRenderer。

#3


2  

As long as you don't need it on Mac, this should work:

只要你在Mac上不需要它,这应该工作:

http://doc-snapshot.qt-project.org/4.8/qwidget.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qwidget.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qgraphicscolorizeeffect.html

http://doc-snapshot.qt-project.org/4.8/qgraphicscolorizeeffect.html

EDIT: Or if you need to support Mac, do the svg rendering and effects inside a QGraphicsView.

编辑:或者如果您需要支持Mac,请在QGraphicsView中执行svg渲染和效果。

http://doc-snapshot.qt-project.org/4.8/qgraphicsitem.html#setGraphicsEffect

http://doc-snapshot.qt-project.org/4.8/qgraphicsitem.html#setGraphicsEffect

Setup your colorize effect to color it white, and set it to the svgWidget.

设置您的着色效果以将其着色为白色,并将其设置为svgWidget。

Hope that helps.

希望有所帮助。

#4


0  

If white is the only color you need, then a simple solution would be to change the color of the original SVG image with an image editor (e.g. Inkscape). Of course, if you need use the image with many different colors, that wont be a reasonable solution.

如果白色是您需要的唯一颜色,那么一个简单的解决方案是使用图像编辑器(例如Inkscape)更改原始SVG图像的颜色。当然,如果您需要使用具有许多不同颜色的图像,那么这不是一个合理的解决方案。