Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. QML ToolBar with Overflow menu ...
Forum Updated to NodeBB v4.3 + New Features

QML ToolBar with Overflow menu ...

Scheduled Pinned Locked Moved General and Desktop
1 Posts 1 Posters 1.2k Views 1 Watching
  • 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.
  • M Offline
    M Offline
    mandragora
    wrote on last edited by
    #1

    Hello everyone,

    For a little prototype I'm doing I need a toolbar with the possibility to show an overflow menu that contains all the tools within the toolbar that are outside the visible area.

    So my question is : How do you tell to the QML toolbar to show an overflow menu that contains all the tools that can't be show due to the lack of space ?

    This is the code I'm using (I'm using Qt 5.4):

    @
    //main.qml
    import QtQuick 2.4
    import QtQuick.Window 2.2

    Window {
    visible: true
    MainForm {

        CustomHeader {
            id: customHeader
        }
    
        mouseArea.onClicked: {
            Qt.quit();
        }
    
        Text {
            anchors.centerIn: parent
            text: "Hello World"
        }
    
    }
    

    }

    //MainForm.qml
    import QtQuick 2.4

    Rectangle {
    property alias mouseArea: mouseArea

    width: 360
    height: 360
    
    MouseArea {
        id: mouseArea
        anchors.fill: parent
    }
    
    Text {
        anchors.centerIn: parent
        text: "Hello World"
    }
    

    }

    //CustomHeader.qml
    import QtQuick 2.4
    import QtQuick.Controls 1.3
    import QtQuick.Layouts 1.1

    ToolBar {
    RowLayout {
    anchors.fill: parent
    spacing: 6
    ToolButton {
    text: "Button 1"
    }
    ToolButton {
    text: "Button 2"
    }
    ToolButton {
    text: "Button 3"
    }
    ToolButton {
    text: "Button 1"
    }
    ToolButton {
    text: "Button 2"
    }
    ToolButton {
    text: "Button 3"
    }
    Item { Layout.fillWidth: true }
    CheckBox {
    text: "Enabled"
    checked: true
    Layout.alignment: Qt.AlignRight
    }
    }
    }

    @

    Thanks in advance for the help in something I though was as simple as setting up a flag to true.

    Kind regards,

    Ben

    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