Resize ApplicationWindow

[att_]

Hi,

I am learning QML by writing my first project. A calculator. This calculator can have a basic or advanced mode. The advanced mode has more buttons than the basic one. So I need to change the size of the ApplicationWindow depending on the mode I am in.
I will have a drawer for mode selection and a stackview for my grid of buttons. My challenge is to pass the grid width to the parents so that ApplicationWindow can set its width correctly. But before I can get to this level, I write this simple qml to set ApplicationWindow size.

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

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

ColumnLayout
{
    spacing: 50
    Rectangle
    {
        width: 100; height: 100; color: "red"
        Text
        {
            text: qsTr("Size 500X500")
        }
        MouseArea
        {
            anchors.fill: parent
            onClicked: console.log("change to 500X500")
        }
    }
    Rectangle
    {
        width: 100; height: 100; color: "red"
        Text
        {
            text: qsTr("Size 600X600")
        }
        MouseArea
        {
            anchors.fill: parent
            onClicked: console.log("change to 600X600")
        }
    }
}

}

How can I change the ApplicationWindow size when onClicked is called?

Thanks in advance,
Anthony

[raven-worx]

@att_ said in Resize ApplicationWindow:
set an id for the window and set it's size:

ApplicationWindow {
    id: window
   ....
   MouseArea
        {
            anchors.fill: parent
            onClicked: {
                   window.width = 500
                   window.height = 500
            }
        }
}

[att_]

@raven-worx Thank you for the quick reply.

I implemented as suggested. I am able to see the window size changed. However, by clicking button 1 and 2 and back and forth, the screen is completely messed up. The buttons are not displayed where they supposed to be. I have to drag the window into another monitor to force the window to refresh. Also when I resize the window to enlarge it, the app is showing some black lines. How do I force a refresh of the window each time the size has changed?

Anthony

[raven-worx]

@att_
This rather sounds like a bug?
What version of Qt are you using? And on what platform?
Can you post a screenshot/video of the behavior?

[att_]

@raven-worx

I am using QT 5.7.1 on Windows 8.1 Enterprise with this qmake command "qmake.exe test.pro -spec win32-msvc2013 "CONFIG+=debug" "CONFIG+=qml_debug""

Here is the code I am using

main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
QGuiApplication app(argc, argv);

QQmlApplicationEngine engine;
engine.load(QUrl(QLatin1String("qrc:/main.qml")));

return app.exec();

}

main.qml
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
id: app
visible: true
width: 640; height: 480
// maximumWidth: width; maximumHeight: height
// minimumWidth: width; minimumHeight: height
title: qsTr("Hello World")

ColumnLayout
{
    spacing: 50
    Rectangle
    {
        width: 100; height: 100; color: "red"
        Text
        {
            text: qsTr("Size 500X500")
        }
        MouseArea
        {
            anchors.fill: parent
            onClicked:
            {
                app.width = 500
                app.height = 500
                app.update()
            }
        }
    }
    Rectangle
    {
        width: 100; height: 100; color: "red"
        Text
        {
            text: qsTr("Size 600X600")
        }
        MouseArea
        {
            anchors.fill: parent
            onClicked:
            {
                app.width = 600
                app.height = 600
                app.update()
            }

        }
    }
}

}

I am new to the forum. I do not know how to attach pictures.

Anthony

[att_]

@att_

Here are more information on this bug. This happens only in Windows 8.1 and all other files removed. Let me elaborate.

Project 1:
Create a "Qt Quick Control 2 Application" with all the default setting.
Do not change anything in the code.
Compile and run.
The resize works fine.

Project 2:
Create a "Qt Quick Control 2 Application" with all the default setting.
Remove Page1.qml, Page1Form.ui.qml, and qtquickcontrols.conf
in main.qml, remove SwipeView and footer sections. So the code just looks like this
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")

}
Compile and run.
The resize does not work.
when the screen gets bigger, the app is not refreshed. "black" area is shown instead of "white".
when the screen gets smaller, the app is repainted correctly.

I created the same project1 and project2 on a Windows 7 Enterprise. Both project1 and project2 work fine.

Anthony