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. Changing Toolbar dynamically (solved)

Changing Toolbar dynamically (solved)

Scheduled Pinned Locked Moved QML and Qt Quick
6 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.
  • J Offline
    J Offline
    jimcad
    wrote on last edited by jimcad
    #1

    I'd like to change Toolbar content dynamically depending on page. The main toolbar has been set in the main qml file.

    ApplicationWindow {
      id: appWindow
      ...
        toolBar: ToolBar {
            id: mainToolbar
            RowLayout {
                anchors.fill: parent
                ToolButton {
                    text: "Back"
                }
                Label {
                    text: "Title"
                }
                Item { Layout.fillWidth: true }
            }
        }
        StackView {
            ...
        }
    }
    

    The pages are handled using StackView and the content of toolbar should be changed when to changing page.

    I know that I can show or hide parts of content, but can I replace the whole toolbar and how?

    p3c0P 1 Reply Last reply
    0
    • J jimcad

      I'd like to change Toolbar content dynamically depending on page. The main toolbar has been set in the main qml file.

      ApplicationWindow {
        id: appWindow
        ...
          toolBar: ToolBar {
              id: mainToolbar
              RowLayout {
                  anchors.fill: parent
                  ToolButton {
                      text: "Back"
                  }
                  Label {
                      text: "Title"
                  }
                  Item { Layout.fillWidth: true }
              }
          }
          StackView {
              ...
          }
      }
      

      The pages are handled using StackView and the content of toolbar should be changed when to changing page.

      I know that I can show or hide parts of content, but can I replace the whole toolbar and how?

      p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      Hi @jimcad,
      Assign a Loader to toolBar and load the Component's as required. The Component can contain any Item.
      Eg:

      toolBar: Loader {
          id: loader
          sourceComponent: comp1
      }
      
      Component {
          id: comp1
          ToolBar {
              RowLayout {
                  anchors.fill: parent
                  ToolButton {
                      iconSource: "new.jpg"
                  }
              }
          }
      }
      
      Component {
          id: comp2
          ToolBar {
              RowLayout {
                  anchors.fill: parent
                  ToolButton {
                      iconSource: "new.jpg"
                  }
                  ToolButton {
                      iconSource: "edit.jpg"
                  }
              }
          }
      }
      
      ...
      loader.sourceComponent = comp2
      

      157

      1 Reply Last reply
      0
      • J Offline
        J Offline
        jimcad
        wrote on last edited by
        #3

        Thank you very much! It works... only problem seems to be Layout.fillWidth. ToolButton is not displayed if fillWidth is used. Any ideas?

        ToolButton {
           iconSource: "new.jpg"
           Layout.fillWidth: true // <-- doesn't work with loader
        }
        
        p3c0P 1 Reply Last reply
        0
        • J jimcad

          Thank you very much! It works... only problem seems to be Layout.fillWidth. ToolButton is not displayed if fillWidth is used. Any ideas?

          ToolButton {
             iconSource: "new.jpg"
             Layout.fillWidth: true // <-- doesn't work with loader
          }
          
          p3c0P Offline
          p3c0P Offline
          p3c0
          Moderators
          wrote on last edited by
          #4

          @jimcad Not sure. Try adding some width for Loader.

          157

          J 1 Reply Last reply
          0
          • p3c0P p3c0

            @jimcad Not sure. Try adding some width for Loader.

            J Offline
            J Offline
            jimcad
            wrote on last edited by
            #5

            @p3c0 yep, so simple. Thanks again :)

            p3c0P 1 Reply Last reply
            0
            • J jimcad

              @p3c0 yep, so simple. Thanks again :)

              p3c0P Offline
              p3c0P Offline
              p3c0
              Moderators
              wrote on last edited by
              #6

              @jimcad Glad that it worked :)

              157

              1 Reply Last reply
              0

              • Login

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