How to style MenuBarItem with mnemonics strings in QML - qt

Question

I want to customize MenuBar (from QtQuick.Controls 2.4) in my Qt application, so I followed the example from Qt website (https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-menubar).
The example does not contain mnemonics, however. Here is my code for the MenuBar which has mnemonics:
import QtQuick 2.9
import QtQuick.Controls 2.4
import QtQuick.Layouts 1.11
import "../singletons"
MenuBar {
Menu {
title: qsTr("&File")
Action { text: qsTr("&Open...") }
Action { text: qsTr("&Save") }
Action { text: qsTr("Save &As...") }
MenuSeparator { }
Action { text: qsTr("&Quit") }
}
Menu {
title: qsTr("&Edit")
Action { text: qsTr("Cu&t") }
Action { text: qsTr("&Copy") }
Action { text: qsTr("&Paste") }
}
Menu {
title: qsTr("&Help")
Action { text: qsTr("&About") }
}
background: Rectangle {
color: Style._ColorPrimaryDark
}
delegate: MenuBarItem {
id: menuBarItem
contentItem: Text {
text: menuBarItem.text
opacity: enabled ? 1.0 : 0.3
color: "white"
verticalAlignment: Text.AlignVCenter
}
}
}
When I run the code, the MenuBar items look like this (the mnemonic shortcuts still work though):
Without the style, the MenuBar items have the mnemonic character underlined as expected:
I couldn't find anything about this problem. Is there any way or workaround so I could keep the mnemonics and customize the looks?

Answer 1

Looks like a bug. The native element uses some private control IconLabel which isn't accessible ( see it here). Using Label also doesn't solve the issue. So the solution is avoiding item customization, or to use some stupid workaround like this:
delegate: MenuBarItem {
id: menuBarItem
function replaceText(txt)
{
var index = txt.indexOf("&");
if(index >= 0)
txt = txt.replace(txt.substr(index, 2), ("<u>" + txt.substr(index + 1, 1) +"</u>"));
return txt;
}
contentItem: Label {
text: replaceText(menuBarItem.text)
color: "white"
verticalAlignment: Text.AlignVCenter
textFormat: Text.RichText
}
}