Mutually exclusive menu items in Qt Quick Controls 2

Question

I want to specify mutually exclusive items in a submenu, using Qt Quick Controls 2. How to accomplish this? I suspect it somehow involves ActionGroup, but I don't see how a submenu can reference ActionGroup. In the following main.qml I've defined an ActionGroup "shadeActions", and a sub Menu called "Shading". How to incorporate the shadeActions ActionGroup into the Shading menu? Or is there another way to do it with Qt Controls 2?

main.qml:

import QtQuick 2.9
import QtQuick.Controls 2.5

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("mbgrdviz")


    ActionGroup {
        id: shadeActions
        exclusive: true
        Action {checkable: true; text: qsTr("Off") }
        Action {checkable: true; text: qsTr("Slope") }
        Action {checkable: true; text: qsTr("Illumination") }
    }


    menuBar: MenuBar {
       Menu {
           title: qsTr("&File")
           Action { text: qsTr("&Open overlay grid...") }
           Action { text: qsTr("&Open site...") }
           Action { text: qsTr("&Open route...") }
           Action { text: qsTr("&Open navigation...") }
           MenuSeparator { }
           Action { text: qsTr("&Exit") }
       }
       Menu {
           title: qsTr("&View")
           Action { checkable: true; text: qsTr("&Map") }
           Action { checkable: true; text: qsTr("&Topography") }
           Action { checkable: true; text: qsTr("&Slope") }
           Action { checkable: true; text: qsTr("&Histograms") }
           Action { checkable: true; text: qsTr("&Contours") }
           Action { checkable: true; text: qsTr("&Sites") }
           Action { checkable: true; text: qsTr("&Routes") }
           Action { checkable: true; text: qsTr("&Vector") }
           Action { checkable: true; text: qsTr("&Profile window") }
           MenuSeparator {}
           Menu {
               title: "Shading"    // menu items should be exclusively selectable
               Action {checkable: true; text: qsTr("Off") }
               Action {checkable: true; text: qsTr("Slope")}
               Action {checkable: true; text: qsTr("Illumination") }
           }
       }
       Menu {
           title: qsTr("&Help")
           Action { text: qsTr("&About") }
       }
   }


    SwipeView {
        id: swipeView
        anchors.fill: parent
        currentIndex: tabBar.currentIndex

        Page1Form {
        }

        Page2Form {
        }
    }

    footer: TabBar {
        id: tabBar
        currentIndex: swipeView.currentIndex

        TabButton {
            text: qsTr("Page 1")
        }
        TabButton {
            text: qsTr("Page 2")
        }
    }
}

Answer 1

By doing this:

    ActionGroup {
        id: shadeActions
        exclusive: true
        Action {checkable: true; text: qsTr("Off") }
        Action {checkable: true; text: qsTr("Slope") }
        Action {checkable: true; text: qsTr("Illumination") }
    }

You are duplicating you actions and the ones in you menu are not grouped. So, create your group without actions:

ActionGroup {
        id: shadeActions
}

Then, assign your actions to the group:

Menu {
   title: "Shading"    // menu items should be exclusively selectable
       Action {checkable: true; text: qsTr("Off"); ActionGroup.group: shadeActions  }
       Action {checkable: true; text: qsTr("Slope"); ActionGroup.group: shadeActions }
       Action {checkable: true; text: qsTr("Illumination"); ActionGroup.group: shadeActions }
}