QML MessageDialog on macOS/OSX

[VRHans]

On Windows and Linux the message dialog looks just fine; however on macOS it looks terrible (e.g. there's no title bar) - which I presume means it's using the fallback qml implementation (which I can customize.)

On macOS does the qml engine always use the qml implementation or is there some characteristic of my application which is preventing the native message dialog/box from being used?

Thanks!

[SGaist]

Hi,

Can you post a picture of what you get exactly ?
What version of Qt are you using ?
What exact version of macOS are you running ?

[VRHans]

@SGaist Sorry it took so long to reply:

macOS version: 10.13.6 (High Sierra)
Qt Version: 5.11.1

This is the code I use to reproduce this trivially:

import QtQuick 2.11
import QtQuick.Window 2.11
import QtQuick.Controls 1.4
import QtQuick.Dialogs 1.3


Window {
	visible: true
	width: 640
	height: 480
	title: qsTr("Hello World")

	MessageDialog {
		id: messageDialog
		title: "May I have your attention please"
		text: "It's so cool that you are using Qt Quick."
		onAccepted: {
			console.log("And of course you could only agree.")
			Qt.quit()
		}
	}

	Button {
		text: "Button"

		onClicked: {
			messageDialog.open();
		}
	}
}

The results look like this:

[shaan7]

That looks right to me, Mac apps normally show child message boxes like this. If you want a separate window, then don't make the MessageBox a child of your Window, like this-

Item {
    Window {
    }

    MessageBox {
    }
}

[VRHans]

@shaan7 That change makes the simple sample above non-functional. It runs but the main window is not visible.

[VRHans]

@shaan7 - also, creating a very quick sample XCode app NSAlert doesn't seem to exhibit this limitation.

macOS apps show child dialogs without a titlebar, but not message boxes.

[shaan7]

@VRHans Ah I didn't complete the example, you'll still need to set visible: true and/or Component.onCompleted: show() on the Window element for it to be visible. (I don't use a Mac anymore so can't really verify if that works, just pointing out what I remember).

import QtQuick 2.11
import QtQuick.Controls 2.3
import QtQuick.Window 2.11
import QtQuick.Dialogs 1.3

Item {
    Window {
        width: 640
        height: 480

        Button {
            text: "Button"

            onClicked: messageDialog.open()
        }

        Component.onCompleted: show()
    }

    MessageDialog {
        id: messageDialog
        title: "May I have your attention please"
        text: "It's so cool that you are using Qt Quick."
        onAccepted: {
            console.log("And of course you could only agree.")
            Qt.quit()
        }
    }
}

[VRHans]

@shaan7 said in QML MessageDialog on macOS/OSX:

Component.onCompleted: show()

That worked - cheers. It does mean that all of my qml code (I have a plugin based system and those plugins need to be able to generate message boxes) will need to make use of a global root based (outside the hosting window) messagedialog.

The plugins just won't be able to use messagedialog directly (but that's a stipulation I can probably live with.)

Thanks!

[shaan7]

@VRHans said in QML MessageDialog on macOS/OSX:

The plugins just won't be able to use messagedialog directly

Well if you do this in the root Item-

Item {
    property alias messageDialog: messageDialog

then messageDialog should become available to the Window and all its children's contexts (even the ones that you load dynamically afaik).

[VRHans]

@shaan7 - yes, but that means changes to the plugin hosting qml code could break plugins, so I'll be abstracting that behind an function/method.