jkj yuio
jkj yuio

Reputation: 2613

Qt5.5 image resizing jitter and not smooth

i'm learning Qt5. I start with a really simple QtQuick QML app with just one image filling the background. It works, but when i resize the window (Windows 8.1 64 bit), the resize is not smooth. There is substantial jitter and sometimes significant lag. It should be using OGL for this right?

Here's my code:

import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Dialogs 1.2

ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")

menuBar: MenuBar {
    Menu {
        title: qsTr("File")
        MenuItem {
            text: qsTr("&Open")
            onTriggered: console.log("Open action triggered");
        }
        MenuItem {
            text: qsTr("Exit")
            onTriggered: Qt.quit();
        }
    }
}

MainForm {
    anchors.fill: parent
}
}

and

import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.2

Item {

visible: true
width: 640
height: 480

Image {
    id: image1
    sourceSize.height: 687
    sourceSize.width: 1280
    smooth: false
    anchors.fill: parent
    source: "images/showcase1280.jpg"
}
}

suggetions appreciated.

Upvotes: 1

Views: 693

Answers (2)

skypjack
skypjack

Reputation: 50568

It is not smooth.

The image has a property named smooth the aim of which is to hold:

[...] whether the image is smoothly filtered when scaled or transformed.

Another interesting property is mimap, for which the documentation says that:

This property holds whether the image uses mipmap filtering when scaled or transformed.

Mipmap filtering gives better visual quality when scaling down compared to smooth, but it may come at a performance cost (both when initializing the image and during rendering).

Note that in your code you set:

smooth: false

Maybe you are doing it wrong if you want smooth changes, try setting the above mentioned properties to true.

Upvotes: 1

progpow
progpow

Reputation: 1580

I`m not pretend by solve your task. But i think you can use animation, as a variant:

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Layouts 1.1

Item {

    Image {
        anchors.centerIn: parent
        width: parent.width
        height: parent.height
        sourceSize.height: 1000
        sourceSize.width: 2000
        source: "https://upload.wikimedia.org/wikipedia/ru/archive/8/88/20090512220306!Qt_logostrap_CMYK.png"
        smooth: false
        fillMode: Image.Stretch
        asynchronous: true

        Behavior on width {
            animation: whAnimation
        }

        Behavior on height {
            animation: whAnimation
        }

        NumberAnimation {
           id: whAnimation
           duration: 150
       }
    }
}

Upvotes: 0

Related Questions