Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Access a StackView from a different QML file
QtWS25 Last Chance

Access a StackView from a different QML file

Scheduled Pinned Locked Moved Solved QML and Qt Quick
qmlexportaccessmodule
3 Posts 2 Posters 1.9k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • L Offline
    L Offline
    LorenDB
    wrote on 18 Feb 2021, 19:41 last edited by
    #1

    I'm building an app that's using a QQmlApplicationEngine for the root view (don't know if that's of any help). It's a StackView based interface (generated by Qt Creator). Therefore, the StackView is in one file (MainWindow.qml, in my case) and the home page is in another (HomePage.qml). I'd like to be able to push an item to the StackView when the user clicks a button in HomePage.qml. Some skeleton code of what I'm trying to do is below.

    MainWindow.qml:

    import QtQuick 2.12
    import QtQuick.Controls 2.5
    
    ApplicationWindow {
        id: root
    
        visible: true
        width: 1024
        height: 768
        title: qsTr("Hello world")
    
        header: ToolBar {
            contentHeight: toolButton.implicitHeight
    
            ToolButton {
                id: toolButton
                text: stackView.depth > 1 ? "\u25C0" : "\u2630"
                font.pixelSize: Qt.application.font.pixelSize * 1.6
                onClicked: {
                    if (stackView.depth > 1) {
                        stackView.pop()
                    } else {
                        drawer.open()
                    }
                }
            }
    
            Label {
                text: stackView.currentItem.title
                anchors.centerIn: parent
            }
        }
    
        Drawer {
            id: drawer
            width: window.width * 0.66
            height: window.height
    
            Column {
                anchors.fill: parent
                }
                ItemDelegate {
                    text: qsTr("Settings")
                    width: parent.width
                    onClicked: {
                        stackView.push("SettingsPage.qml")
                        drawer.close()
                    }
                }
            }
        }
    
        StackView {
            id: stackView
            initialItem: "HomePage.qml"
            anchors.fill: parent
        }
    }
    

    HomePage.qml:

    import QtQuick 2.12
    import QtQuick.Controls 2.12
    
    Page {
        id: pageRoot
    
        title: qsTr("Home")
    
        Button {
            anchors.centerIn: parent
            onClicked: ; // MainWindow.stackView.push("myQmlFile.qml");
    }
    
    

    Is this even possible or will I need to invent some new kludgery to achieve this effect?

    I'm using Qt 5.12.8, although I can test on 5.15.1 and 6.0.0 if needed.

    1 Reply Last reply
    0
    • S Offline
      S Offline
      sierdzio
      Moderators
      wrote on 19 Feb 2021, 06:58 last edited by
      #2

      ApplicationWindow's id is in scope in the whole application, so it should be possible to do this:

      onClicked: root.stackView.push("myQmlFile.qml");
      

      You may need to expose stackView as a property, like this:

      ApplicationWindow {
        id: root
        property alias stack: stackView
      

      If this approach fails, you can always add a signal in HomePage and react to it elsewhere:

      Page {
        id: pageRoot
        signal buttonClicked(string path)
      
        Button {
          onClicked: pageRoot.buttonClicked("myQmlFile.qml")
      

      (Z(:^

      L 1 Reply Last reply 19 Feb 2021, 13:16
      0
      • S sierdzio
        19 Feb 2021, 06:58

        ApplicationWindow's id is in scope in the whole application, so it should be possible to do this:

        onClicked: root.stackView.push("myQmlFile.qml");
        

        You may need to expose stackView as a property, like this:

        ApplicationWindow {
          id: root
          property alias stack: stackView
        

        If this approach fails, you can always add a signal in HomePage and react to it elsewhere:

        Page {
          id: pageRoot
          signal buttonClicked(string path)
        
          Button {
            onClicked: pageRoot.buttonClicked("myQmlFile.qml")
        
        L Offline
        L Offline
        LorenDB
        wrote on 19 Feb 2021, 13:16 last edited by
        #3

        @sierdzio setting an alias for the StackView and then calling root.stack.push worked for me. Thanks!

        1 Reply Last reply
        1

        3/3

        19 Feb 2021, 13:16

        • Login

        • Login or register to search.
        3 out of 3
        • First post
          3/3
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved