[Interest] How to render small Images decently on non retina displays with QtQuick?

Mitch Curtis mitch.curtis at qt.io
Thu Mar 15 17:14:45 CET 2018



> -----Original Message-----
> From: Interest [mailto:interest-bounces+mitch.curtis=qt.io at qt-project.org]
> On Behalf Of Shawn Rutledge
> Sent: Thursday, 15 March 2018 3:27 PM
> To: Shantanu Tushar <shaan7in at gmail.com>
> Cc: Qt Project MailingList <interest at qt-project.org>
> Subject: Re: [Interest] How to render small Images decently on non retina
> displays with QtQuick?
> 
> 
> > On 15 Mar 2018, at 14:20, Shantanu Tushar <shaan7in at gmail.com> wrote:
> >
> > On 6 March 2018 at 22:15, Xavier Bigand <flamaros.xavier at gmail.com>
> wrote:
> > Hi,
> >
> > If your sample picture is relevant I can suggest you to convert it as SVG
> (vectoring it) or using distance field technique.
> >
> > I had this question for a while now - if we can use SVGs for showing
> application icons (which will then look good with any dimensions / DPI), why
> is it common to use images instead? There's obviously some benefit to
> images as people take pains to bundle multiple versions for different DPIs, I
> wanted to know what they are. Most of the stuff I can find online is always
> talking about websites and "web apps" which might not all apply to desktop
> applications.
> >
> > I see that Uwe has pointed out a performance issue which can happen
> because of multiple renderings due to size changes. Is that it? Or are there
> other reasons behind preferring PNG icons over SVG?
> 
> I think it’s mainly that SVG rendering is slow because it’s done in software,
> and also that qtsvg only supports SVG Tiny, so it can’t render everything that
> you can design in Inkscape, for example.  You have keep the SVGs simple and
> avoid features that we don’t support (blurs, gradients, line
> endings/arrowheads and lots more).  If you want full SVG support you can
> use webkit/webengine, but that’s overkill in many applications.
> 
> Speaking of distance field: If your icons are monochrome, you might consider
> making a custom icon font for your application.  You can start with something
> like Font Awesome, edit it to include only the icons you need, and add more
> custom-designed icons as necessary.  Then you can render an icon with a
> Text element.  But finding a suitable icon editing program is up to you in that
> case.  I did it with FontForge once a couple of years ago.

Or just use Fontello:

http://fontello.com/

> In the future I think it will make sense to use PDF for vector icons too (in
> color, even).  (Some frameworks already can do this.)  Then instead of an
> icon font, you could have one PDF file with all the icons for your app, one icon
> per “page”.  I hope to eventually support using a PDF file with an ordinary
> Image in QML, but we have to add API for selecting the page, and there are
> other issues with caching and so on.  I had patches to get it mostly working a
> couple of years ago, it just wasn’t 100% ready for integration.
> 
> _______________________________________________
> Interest mailing list
> Interest at qt-project.org
> http://lists.qt-project.org/mailman/listinfo/interest


More information about the Interest mailing list