QIcon with SVG appears black

Question

I need to support high DPI displays with my Qt 5.9.1 application and I'm looking for a solution to scale the QIcons used by the app.

I'm currently only targeting Windows 7 and 10.

So far, for non-high DPI displays (Windows 7), I used .ico files for icons that appear at different resolutions.

I've also got some icons as .png files when they're only used at a single resolution.

With high-DPI displays, under Windows 10, when the user applies a zoom factor which scales the app, the icons end-up scaled but blurred.

I've tested adding high-res png files named with the '@2x' suffix, but the scaling blurs the icons.

Seeing this I thought I'd try using .svg files instead as those should scale, but they appear black when used with QIcons. This post implies 'fill' color is not supported for QIcons: Qt support for coloring SVG in a QIcon

Has anyone managed to get .svg files to work with QIcons? Am I even on the right track with .svg to support high-DPI displays and still get crisp icons? If not, what approach are people out there taking?

Answer 1

This is part of code from my project:

ui->pushButtonIcon->setIcon(QIcon(":/simplebrowser.svg"));

I am setting *.svg image to QPushButton(). Image is added to my resources in project.

Answer 2

I had same problem with QT 5.6. I edited .svg files and I replaced <style> by <style type="text/css"> and it worked fine for me.