「QMLの基礎 - カスタムQMLタイプ」の版間の差分

📢 Webサイト閉鎖と移転のお知らせ
このWebサイトは2026年9月に閉鎖いたします。
新しい記事は移転先で追加しております。(旧サイトでは記事を追加しておりません)

132行目: 132行目:
<br><br>
<br><br>


== ダイアログの例 ==
ダイアログは、カスタムQMLタイプとして定義することができない。<br>
ただし、<code>Window</code>タイプまたは<code>ApplicationWindow</code>タイプを定義したカスタムQMLタイプを、<code>createComponent</code>関数を使用して読み込むことにより実現できる。<br>
<br>
また、ダイアログから戻り値を取得する場合は、カスタムQMLタイプに<code>property</code>を定義して、<code>Connections</code>タイプから取得する。<br>
<syntaxhighlight lang="qml">
// main.qmlファイル
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtQuick.Window 2.15
// ...略
Button {
    text: "Popup MessageDialog"
    onClicked: {
      var component = Qt.createComponent("MessageDialog.qml");
      if (component.status === Component.Ready) {
      var messageDialog = component.createObject(parent, {someValue1: 1, someValue2: 2});
      messageDialogConnection.target = dlg
      messageDialog.show();
    }
}
Connections {
    id: messageDialogConnection
    onVisibleChanged: {
      if(!target.visible) {
          console.log(target.returnValue);     
      }
    }
}
// ...略
</syntaxhighlight>
<br>
<syntaxhighlight lang="qml">
// MessageDialog.qmlファイル
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
ApplicationWindow {
    property int someValue1:  0
    property int someValue2:  0
    property int returnValue: 0
    id: messageDialog
    title: "Some Title"
    width: 600
    height: 450
    flags: Qt.Dialog
    modality: Qt.WindowModal
    onVisibleChanged: {
        messageDialogBtnCancel.focus = true
    }
    ColumnLayout {
        id: messageColumn
        width: parent.width
        spacing: 20
        Label {
            text: "Some Message"
            width: parent.width
            font.pointSize: 12
            wrapMode: Label.WordWrap
            horizontalAlignment: Label.AlignHCenter
            verticalAlignment: Label.AlignVCenter
            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.topMargin: 20
            Layout.bottomMargin: 20
        }
        RowLayout {
            x: parent.x
            width: parent.width
            Layout.alignment: Qt.AlignHCenter
            Layout.bottomMargin: 20
            spacing: 20
            Button {
                id: messageDialogBtnOK
                text: "OK"
                Connections {
                    target: messageDialogBtnOK
                    function onClicked() {
                        returnValue = 0
                        messageDialog.close()
                    }
                }
            }
            Button {
                id: messageDialogBtnCancel
                text: "Cancel"
                focus: true
                Connections {
                    target: messageDialogBtnCancel
                    function onClicked() {
                        returnValue = 1
                        messageDialog.close();
                    }
                }
            }
        }
    }
}
</syntaxhighlight>
<br><br>


__FORCETOC__
__FORCETOC__
[[カテゴリ:Qt]]
[[カテゴリ:Qt]]