QML对话框控件

only-lucky2026-08-03 10:37

ColorDialog

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3

ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select color"
            onClicked: {
                colorid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        ColorDialog{
            id:colorid
            title: "select color"
            onAccepted: {
                console.log("accept = ",colorid.color);
                rectid.color = colorid.color;
            }
        }
    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}

FileDialog

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3

ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select file"
            onClicked: {
                fileid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        FileDialog{
            id:fileid
            title: "select file"
            nameFilters: ["*.*","*.txt"]
            // fileMode: FileDialog.ExistingFile
            // 选中单个文件触发

            onAccepted: {
                console.log("accept = ",fileid.fileUrl );
            }
        }
    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}

FolderDialog

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3
import Qt.labs.platform 1.1
ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select file"
            onClicked: {
                folderid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        FolderDialog{
            id:folderid
            title: "select file"
            // currentFolder: folderid.currentFolder

            onAccepted: {
                console.log("accept = ",folderid.folder );
            }
        }
    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}

FontDialog

注意：使用这个需要使用QApplication，并且需要链接动态库。

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3
import Qt.labs.platform 1.1
ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select file"
            onClicked: {
                folderid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        FontDialog{
            id:folderid
            title: "select file"

            onAccepted: {
                console.log("accept = ",folderid.currentFont );
            }
        }
    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}

MessageDialog

我这里就一个按钮

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3
import Qt.labs.platform 1.1
ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select file"
            onClicked: {
                messageid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        MessageDialog{
            id:messageid
            title: "dialog"
            text: "这是一个对话框"
            buttons: MessageDialog.Ok |MessageDialog.Cancel

            onAccepted: {
                console.log("accept = " );
            }
            onRejected: {
                console.log("reject")
            }
        }
    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}

自定义对话框

可以参考：gallery 示例

复制代码 
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15//布局模块
import QtQuick.Controls 2.15 //Controls模块
import QtQuick.Dialogs 1.3
import Qt.labs.platform 1.1

import QtQuick 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.12


ApplicationWindow {
    width: 360
    height: 520
    visible: true
    title: qsTr("Qml learn ")
    id:rootid

    Column{
        spacing: 20
        anchors.fill: parent
        Button{
            text: "select file"
            onClicked: {
                messageid.open();
            }
            anchors.horizontalCenter: parent.horizontalCenter
        }
        Rectangle{
            id:rectid
            width: 200
            height: 200
            border.width: 8
            anchors.horizontalCenter: parent.horizontalCenter
        }
        // MessageDialog{
        //     id:messageid
        //     title: "dialog"
        //     text: "这是一个对话框"
        //     // buttons: MessageDialog.Ok |MessageDialog.Cancel
        //     standardButtons: Dialog.Yes | Dialog.No

        //     // parent: Overlay.overlay

        //     onAccepted: {
        //         console.log("accept = " );
        //     }
        //     onRejected: {
        //         console.log("reject")
        //     }
        // }
        Dialog {
            id: messageid

            x: (parent.width - width) / 2
            y: (parent.height - height) / 2
            width: Math.min(page.width, page.height) / 3 * 2
            contentHeight: logo.height * 2
            parent: Overlay.overlay

            modal: true
            title: "Content"
            standardButtons: Dialog.Yes | Dialog.No

            Flickable {
                id: flickable
                clip: true
                anchors.fill: parent
                contentHeight: column.height

                Column {
                    id: column
                    spacing: 20
                    width: parent.width

                    Image {
                        id: logo
                        width: parent.width / 2
                        anchors.horizontalCenter: parent.horizontalCenter
                        fillMode: Image.PreserveAspectFit
                        source: "../images/qt-logo.png"
                    }

                    Label {
                        width: parent.width
                        text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc finibus "
                            + "in est quis laoreet. Interdum et malesuada fames ac ante ipsum primis "
                            + "in faucibus. Curabitur eget justo sollicitudin enim faucibus bibendum. "
                            + "Suspendisse potenti. Vestibulum cursus consequat mauris id sollicitudin. "
                            + "Duis facilisis hendrerit consectetur. Curabitur sapien tortor, efficitur "
                            + "id auctor nec, efficitur et nisl. Ut venenatis eros in nunc placerat, "
                            + "eu aliquam enim suscipit."
                        wrapMode: Label.Wrap
                    }
                }

                ScrollIndicator.vertical: ScrollIndicator {
                    parent: contentDialog.contentItem
                    anchors.top: flickable.top
                    anchors.bottom: flickable.bottom
                    anchors.right: parent.right
                    anchors.rightMargin: -contentDialog.rightPadding + 1
                }
            }
        }

    }


    //Qt5的windows没有focus属性，用以下实现
    Shortcut {
        sequence: "q"
        context: Qt.ApplicationShortcut
        onActivated: Qt.quit()
    }

}
相关推荐
程与留15 小时前
06_Qt 常用数据类型与容器：QString、QList、QVector、QMap 的性能与实现分析
数据结构·qt
zlinear数据采集卡21 小时前
数据采集卡从入门到精通（38）：上位机开发实战——Python/QT/LabVIEW的技术选型与分层架构
python·单片机·嵌入式硬件·qt·fpga开发·开源·labview
skr爱码士1 天前
05_Qt 核心模块概览——Qt Core、Gui、Widgets、Quick 的职责划分
c++·qt·系统架构·客户端
MOONICK1 天前
QT的UI开发框架
qt·ui
郝学胜-神的一滴1 天前
Horse3D 游戏引擎研发笔记（七）：Clydesdale——从流式日志到多输出订阅
c++·qt·unity·游戏引擎·图形渲染·unreal engine·opengl
NO12121 天前
python pyqt5調用攝像頭實時顯示
开发语言·python·qt
丰锋ff1 天前
基于 Qt 的智慧社区物业管理系统
开发语言·qt
程与留2 天前
05_Qt 核心模块概览——Qt Core、Gui、Widgets、Quick 的职责划分
c++·qt
buhuizhiyuci2 天前
【QT-百日筑基篇】修真世界摸爬滚打多年，终于黄天不负有心人，突破炼器中期——常用控件QWight的属性
开发语言·c++·qt·gui·图形化
Littlehero_1212 天前
QT自定义控件之热换站系统（源码开源）
开发语言·qt
热门推荐
01国内可直接用、免费额度/永久免费的大模型API清单（含 SiliconFlow、火山、阿里、智谱、百度、Kimi、DeepSeek、DMXAPI 等）02GitHub 镜像站点03微信历史版本含下载地址（ Windows PC | 安卓 | MAC ）及设置微信不更新042026 国产 AI 大模型横评：DeepSeek、通义千问、Kimi、文心一言、星火、豆包谁更能打？05历年考研数学一、数学二、数学三真题试卷及答案PDF06Agnes AI 免费 API 接入指南：文本、生图、生视频，一套接口全免费072026年7月AI圈大地震：GPT-5.6被政府限制、Claude入驻Slack、Anthropic自研芯片08AI 编程 IDE 全景解析 2026：Agent 全面接管开发链路09VSCode+CodeX扩展，无法启动10如何新建文件夹？ 电脑新建文件夹的4种方法