第2章：ColorDialogQML基本コンポーネントのColorDialog

ColorDialog

公式紹介：https：//doc.qt.io/qt-5/qml-qtquick-dialogs-colordialog.html

効果：

 

例：

import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.3
import QtQuick.Dialogs 1.2

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    color: "black";
    title: "颜色对话框";
    id: root;
    property var colorDlg: null;
    menuBar: MenuBar{
        Menu {
            title: "设置";
            MenuItem {
                action: Action {
                    id: textColorAction;
                    text: "文字颜色";
                    onTriggered: root.selectColor(root.onTextColorSelected);
                }
            }
        }
    }

    function selectColor(func){
        if(colorDlg == null){
            colorDlg = Qt.createQmlObject(
                        'import QtQuick 2.2;import QtQuick.Dialogs 1.1;ColorDialog{}',
                        root, "colorDlg");
            colorDlg.accepted.connect(func);
            colorDlg.accepted.connect(onColorDlgClosed);
            colorDlg.rejected.connect(onColorDlgClosed);
            colorDlg.visible = true;
        }
    }
    function onColorDlgClosed(){
        colorDlg.destroy();
        colorDlg = null;
    }
    function onTextColorSelected(){
        console.log("You chose　color: " +  colorDlg.color)
    }

}