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

Xavier Bigand flamaros.xavier at gmail.com
Tue Mar 6 17:50:00 CET 2018


I think that you just have to link the svg module, if I remember correctly,
then in QML just use it as source of an Image item.
The only think is that you have to fix the size of the item as the
sourceSize have no sense here.

2018-03-06 17:47 GMT+01:00 Nuno Santos <nunosantos at imaginando.pt>:

> I have never used SVG in QtQuick.
>
> What can be used to render SVG’s in QtQuick?
>
> On 6 Mar 2018, at 16:45, 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.
>
> 2018-03-06 17:06 GMT+01:00 Jason H <jhihn at gmx.com>:
>
>> Maybe this has something to do with with mipMapping/smooth? It looks like
>> it's not anti-aliasing?
>>
>> *Sent:* Tuesday, March 06, 2018 at 10:50 AM
>> *From:* "Nuno Santos" <nunosantos at imaginando.pt>
>> *To:* "Mitch Curtis" <mitch.curtis at qt.io>
>> *Cc:* "Qt Project MailingList" <interest at qt-project.org>
>> *Subject:* Re: [Interest] How to render small Images decently on non
>> retina displays with QtQuick?
>> Mitch,
>>
>> Thanks for your reply.
>>
>> You are right. I’m not playing all the cards…
>>
>> Original image attached (it is white over transparent so you will not see
>> it in the email body. The file is called isotope.png)
>>
>> The item who renders this is the following:
>>
>> import QtQuick 2.4
>>
>> Item {
>>     id: root
>>     implicitWidth: 100
>>     implicitHeight: 100
>>
>>     property real padding: 0
>>     property alias imageSource: icon.source
>>     property color imageColor: controller.settings.foregroundColor
>>
>>     Image {
>>         id: icon
>>         anchors.fill: parent
>>         anchors.margins: root.padding
>>         fillMode: Image.PreserveAspectFit
>>     }
>>
>>     ColorOverlay {
>>         id: overlay
>>         source: icon
>>         anchors.fill: icon
>>         color: root.imageColor
>>     }
>> }
>>
>>
>> <Mail Attachment.png><Mail Attachment.png>
>>
>> <Mail Attachment.png>
>>
>>
>> On 6 Mar 2018, at 15:41, Mitch Curtis <mitch.curtis at qt.io> wrote:
>>
>> Can you elaborate on “really bad”, and also share a screenshot?
>>
>> *From:* Interest [mailto:interest-bounces+mitch
>> .curtis=qt.io at qt-project.org
>> <interest-bounces+mitch.curtis=qt.io at qt-project.org>] *On Behalf Of *Nuno
>> Santos
>> *Sent:* Tuesday, 6 March 2018 4:27 PM
>> *To:* Qt Project MailingList <interest at qt-project.org>
>> *Subject:* [Interest] How to render small Images decently on non retina
>> displays with QtQuick?
>>
>> Hi,
>>
>> I have a simple question.
>>
>> *How to render small Images decently on non retina displays with QtQuick?*
>>
>> In my apps, I use images for icons and logos. They are all big enough to
>> be displayed correctly.
>>
>> However, on non Retina displays they get really bad! And on retine
>> display they appear perfectly.
>>
>> What is the rule of thumb to use QtQuick Image element on on retina
>> displays?
>>
>> Thx!
>>
>> Regards,
>>
>> Nuno
>>
>> _______________________________________________ Interest mailing list
>> Interest at qt-project.org http://lists.qt-project.org/ma
>> ilman/listinfo/interest
>>
>> _______________________________________________
>> Interest mailing list
>> Interest at qt-project.org
>> http://lists.qt-project.org/mailman/listinfo/interest
>>
>>
>
>
> --
> Xavier
>
>
>


-- 
Xavier
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20180306/67f8262c/attachment.html>


More information about the Interest mailing list