Home > other >  Not able to switch to more than 2 QML files using stackview
Not able to switch to more than 2 QML files using stackview

Time:07-19

I am trying to switch between multiple screens using stackview in QML. I am following this example. It is working fine till switching from screen 1 to screen 2. But while switching from screen 2 to screen 1, the signal is not getting invoked.

main.qml

import QtQuick
import QtQuick.Controls
import '../imports/Test'
import QtQuick.Controls.Material 2.15

ApplicationWindow {
    id: mainframe
    width: Screen.desktopAvailableWidth
    height: Screen.desktopAvailableHeight
    visible: true
    title: qsTr("Dr. T")

    Material.theme: Material.Dark

    StackView {
        id: stack_view
        initialItem: loginWin
        anchors.fill: parent

        Test_interface_dark {
            id: test_screen
            onAnalyzeReport: {
                stack_view.pop()
                stack_view.push('./Report_screen.qml')
            }
        }
        
        Second_screen {
            id: search_screen
            onSearchRegister: {
                console.log('Test signal Invoked')
                // stack_view.pop()
                stack_view.push('./Test_interface_dark.qml')
                stack_view.initialItem = test_screen
            }
        }

        Login_dark {
            id: loginWin
            onLoggedIn: {
                // stack_view.pop()
                console.log(stack_view)
                stack_view.push("./Second_screen.qml")
            }
        }
    }
}

Login_dark.qml

Item {
    id: login_item
    anchors.fill: parent

    signal loggedIn()

    Rectangle {
        id: rectangle
        color: "#494949"
        anchors.fill: parent
        state: ""
        Button {
            if (condition) {
                login_item.loggedIn()
            }
        }
    }
}

similar are Second_screen.qml and Test_interface_dark.qml. But when I try to invoke signal searchRegister from Secondscreen.qml, it does not work, the line console.log('Test signal Invoked') in main.qml also does not get printed.

CodePudding user response:

If you want to override properties or handling signals within components, Don't add them with path to the StackView. Instead create components that incubate your other components with the overridden properties inside your StackView QML file. Example:

import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Material 2.15

ApplicationWindow {
    id: root
    width: 500
    height: 500
    title: qsTr("Dr. T");
    visible: true
    Material.theme: Material.Dark

    StackView {
        id: stack_view;
        initialItem: loginWin;
        anchors.fill: parent;


        Component{ id: loginWin;
            LoginDark {
                onLoggedIn: {
                    console.log("to search_screen");
                    stack_view.push(search_screen);
                }
            }
        }


        Component{ id: search_screen;
            SecondScreen {
                onSearch: {
                    console.log("Test signal Invoked")
                    stack_view.push(interface_)
                }
            }
        }

            Component{ id: interface_;
            InterfaceDark {
                onAnalyzeReport: {
                    stack_view.pop()
                }
            }
        }
    }
}

Full example can be found here.

  • Related