Menubars in QtQuick Controls 2

Sassan picture Sassan · Jun 17, 2016 · Viewed 7.2k times · Source

How can I have Menubars in QtQuick Controls 2? It used to be like this (in ApplicationWindow):

menuBar: MenuBar {
    Menu {
        title: qsTr('File')
        MenuItem {
            text: qsTr('&Test')
            onTriggered: console.log('test')
        }
        MenuItem {
            text: qsTr('&Exit')
            onTriggered: Qt.quit();
        }
    }
}

But after upgrading to Qt 5.7 it gives this error: Invalid property name "menuBar".(M16)

P.S. it used to use device's native menu system, for example on OS X it used native screen's topbar menubar, on Linux and Windows it used native in application topbar menubar, etc.

Answer

Mitch picture Mitch · Jun 17, 2016

MenuBar is now available, and was added in Qt 5.10. Use QtQuick.Controls version 2.3 or later:

import QtQuick.Controls 2.3

Old answer:

As GrecKo said, desktop is not the focus of the module, and as such, you won't find a MenuBar control as part of the main import. Up until recently, I've been using a RowLayout that contains a bunch of ToolButton controls, each of which opens a Menu, in order to emulate a menu bar for a desktop application.

However, the Qt.labs.platform module was recently added, which adds support for native controls like MenuBar. The types in this module are fully native, at the expense of less customisability. You can already start using these if you clone the dev branch of qtquickcontrols2.git.

By the way, if you're ever unsure what the equivalent type in Qt Quick Controls 2 is, there's a "Type Comparison Table" here (although it's unfortunately currently missing MenuBar).