Search code examples
pythonqtqmlpyside6

Not able to switch to more than 2 QML files using stackview


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.


Solution

  • 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.