CODEWITHSUNDEEP
qtqml
Simon
Simon

Reputation: 61

Change UI when button pressed in QML

I am new to QML. For studying, I am writing a basic log-in application. I have two ui.qml files for the design and two qml files for the implementation. What I want to do now is when the user presses the button with the id create_account, the ui should change from signIn.ui.qml to signUp.ui.qml. If needed, here is the whole project. Anyone have an idea how I could do this?

Upvotes: 0

Views: 451

Answers (1)

DaszuOne
DaszuOne

Reputation: 809

The easiest way is to modify the main.qml file:

import QtQuick 2.6
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.12

ApplicationWindow{
    id: root
    width: 600
    height: 480
    visible: true

    StackLayout {
        id: layout
        anchors.fill: parent
        currentIndex: 0

        SignIn {
            create_account.onClicked: {
                layout.currentIndex = 1;
            }
        }

        SignUp {
        }
    }
}

In short:

  1. Choose some layout and place in it your views
  2. Handle the signal from the button, and modify currentIndex of layout

More about layouts here (link)

Upvotes: 1

Related Questions