Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

How to create a button that opens another window without needing to open several?



  • I want to create a button that when we click gives the possibility to open other screens without needing to open several, it is all only in a main screen.


  • Qt Champions 2017

    Not very clear about the question. Did you try something which did not work ? Can you give more details.



  • @dheerendra I tried this but with this code it opens many pages, I want it to work on the same page.

        Item {
            width: 200; height: 200
    
            Loader { id: pageLoader }
    
            MouseArea {
                anchors.fill: parent
                onClicked: pageLoader.source = "main.qml"
            }
        }
    
    

  • Qt Champions 2017

    It should not. It should create only one. What is the code in main.qml ?



  • @dheerendra What I want is the following, when I click on button 1's tab it displays the information on tab 1 on the right side and with the other buttons too, you have the possibility to do this?

        Row {
            anchors.fill: parent
    
            TabBar {
                id: tabBar
                width: 150
    
                contentItem: Column {
    
                TabButton {
                    text: qsTr("Tab 0")
                }
                TabButton {
                    text: qsTr("Tab 1")
                }
                TabButton {
                    text: qsTr("Tab 2")
                }
    
                }
            }
    
            Item {
                id: contentArea
                width: parent.width - tabBar.width
                height: parent.height
    
                Item {
                    id: tabContent0
                    anchors.fill: parent
                    visible: tabBar.currentIndex == 0
    
                    Label {
                        text: qsTr("Tab 0 content")
                        anchors.centerIn: parent
                    }
                }
    
                Item {
                    id: tabContent1
                    anchors.fill: parent
                    visible: tabBar.currentIndex == 1
    
                    Label {
                        text: qsTr("Tab 1 content")
                        anchors.centerIn: parent
                    }
                }
    
                Item {
                    id: tabContent2
                    anchors.fill: parent
                    visible: tabBar.currentIndex == 2
    
                    Label {
                        text: qsTr("Tab 2 content")
                        anchors.centerIn: parent
                    }
                }
            }
        }
    


  • People, I did many experiencs but almost nothing worked until I found this post https://evileg.com/en/post/191/ that helped me and I used to turn the menu horizontal to vertical. below is the code I used.

    Thank you very much!

    // Layer with buttons that will change the fragments
    RowLayout {
        id: rowLayout
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.margins: 15
    
        Button {
            id: button1
            anchors.left: rowLayout.left
            text: qsTr("Fragment 1")
            // Download the component from a file
            onClicked: loader.source = "Fragment1.qml"
        }
    
        Button {
            id: button2
            anchors.left: rowLayout.left
            anchors.top: button1.bottom
            text: qsTr("Fragment 2")
            // Loading setSource component through the method of installing the fragment parameters
            onClicked: loader.setSource("Fragment2.qml")
        }
    
        Button {
            id: button3
            anchors.left: rowLayout.left
            anchors.top: button2.bottom
    
            text: qsTr("Fragment 3")
            // Loading setSource component through the method of installing the fragment parameters
            onClicked: loader.setSource("Fragment3.qml")
        }
    
        Button {
            id: button4
            anchors.left: rowLayout.left
            anchors.top: button3.bottom
    
            text: qsTr("Fragment 4")
            // Installing a fragment from the Component
            onClicked: loader.sourceComponent = fragment4
        }
    
        Button {
            id: button5
            anchors.left: rowLayout.left
            anchors.top: button4.bottom
    
            text: qsTr("Fragment 5")
            // Installing a fragment from the Component
            onClicked: loader.sourceComponent = fragment5
        }
    }
    
    Loader {
        id: loader
        anchors.top: rowLayout.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        anchors.topMargin: -40
        anchors.leftMargin: 63
        source: "Fragment1.qml"
    }
    

Log in to reply