本文作者:StubbornHuang
版权声明:本文为站长原创文章,如果转载请注明原文链接!
原文标题:Duilib – 点击按钮弹出模态对话框
原文链接:https://www.stubbornhuang.com/1831/
发布于:2021年11月16日 10:42:54
修改于:2021年11月16日 10:42:54

1 模态对话框
是指在用户想要对对话框以外的应用程序进行操作时,必须首先对该对话框进行响应。如单击确定或取消按钮等将该对话框关闭。模态对话框垄断了用户的输入。当一个模态对话框打开时,用户只能与该对话框进行交互,而其他用户界面对象收不到输入信息。模态对话框下,用户需要操作目标对话框就必须先操作模态对话框。
2 在Duilib中实现模态对话框
2.1 需求示例
实现以下需求,在主页面中点击一个按钮弹出一个模态对话框,这里以下列例子为例:

点击添加任务,弹出添加任务子模态对话框:
,
整体界面如下:

2.2 界面设计
2.2.1 主界面xml
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<Window size="800,600" roundcorner="0,0" sizebox="6,6,6,6" caption="0,0,0,90" mininfo="800,600" >
<Font id="0" name="微软雅黑" size="36" bold="true"/>
<Font id="1" name="微软雅黑" size="28" bold="false"/>
<Font id="2" name="微软雅黑" size="24" bold="false"/>
<Font id="3" name="微软雅黑" size="72" bold="true"/>
<VerticalLayout bkcolor="0xFFFFFFFF">
<!-- 标题栏 -->
<HorizontalLayout height="32" >
<Control />
<HorizontalLayout width="80">
<Button name="Btn_Min" width="24" height="24" padding="0,0,0,0" normalimage="file='最小化.png'" hotimage="file='最小化悬停.png'"/>
<Button name="Btn_Max" width="24" height="24" padding="0,0,0,0" normalimage="file='最大化.png'" hotimage="file='最大化悬停.png'"/>
<Button name="Btn_Close" width="24" height="24" padding="0,0,0,0" normalimage="file='关闭.png'" hotimage="file='关闭悬停.png'"/>
</HorizontalLayout>
</HorizontalLayout>
<!-- 主要功能区 -->
<VerticalLayout >
<!-- 功能按钮区 -->
<HorizontalLayout height="80">
<Control width="20"/>
<VerticalLayout width="39" height="80">
<Button name="Btn_AddConversionTask" width="39" height="32" padding="0,6,0,0" normalimage="file='添加任务.png'" hotimage="file='添加任务悬停.png'" />
<Control height="5" />
<Text text="添加任务" />
</VerticalLayout>
<Control width="20"/>
<VerticalLayout width="32">
<Button name="Btn_StartConvertTask" width="32" height="32" padding="0,6,0,0" normalimage="file='开始处理任务.png'" hotimage="file='开始处理任务悬停.png'" />
<Control height="5" />
<Text text="运行任务" />
</VerticalLayout>
<Control />
</HorizontalLayout>
</VerticalLayout>
<!-- 状态栏 -->
<HorizontalLayout height="30">
</HorizontalLayout>
</VerticalLayout>
</Window>
2.2.1 子模态对话框xml
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<Window size="640,260" roundcorner="0,0" sizebox="0,0,0,0" caption="0,0,0,90" mininfo="640,260" maxinfo="640,260">
<VerticalLayout bkcolor="0xFFFFFFFF">
<!-- 标题栏 -->
<HorizontalLayout height="32" >
<Control />
<HorizontalLayout width="32">
<Button name="Btn_Close" width="24" height="24" padding="0,0,0,0" normalimage="file='关闭.png'" hotimage="file='关闭悬停.png'"/>
</HorizontalLayout>
</HorizontalLayout>
<!-- 主要功能区 -->
<VerticalLayout height="140">
<HorizontalLayout height="60">
<Text text="选择输入文件夹" width="90" padding="10,8,0,0"/>
<Button name="Btn_Open_Input_Folder" width="24" height="24" padding="10,0,0,0" normalimage="file='打开文件夹.png'" hotimage="file='打开文件夹悬停.png'"/>
<Text name="Text_Input_Folder" height="50" bordercolor="0xFF000000" bordersize="1" padding="20,0,10,0" />
</HorizontalLayout>
<Control />
<HorizontalLayout height="60" >
<Text text="选择输出文件夹" width="90" padding="10,8,0,0"/>
<Button name="Btn_Open_Output_Folder" width="24" height="24" padding="10,0,0,0" normalimage="file='打开文件夹.png'" hotimage="file='打开文件夹悬停.png'"/>
<Text name="Text_Output_Folder" height="50" bordercolor="0xFF000000" bordersize="1" padding="20,0,10,0" />
</HorizontalLayout>
</VerticalLayout>
<HorizontalLayout height="60" >
<Control />
<Button name="Btn_AddTask" width="60" height="40" bkcolor="#0xFF333303" text="添加任务" textcolor="0xFFFFFFFF" hottextcolor="0xFF1ECC94" borderround="3,3"/>
<Control width="20"/>
<Button name="Btn_CancelAdd" width="60" height="40" bkcolor="#0xFF333303" text="取消添加" textcolor="0xFFFFFFFF" hottextcolor="0xFF1ECC94" borderround="3,3"/>
<Control />
</HorizontalLayout>
<Control height="10" />
</VerticalLayout>
</Window>
2.3 代码实现
2.3.1 主界面点击添加任务按钮弹出模态对话框
// 添加任务按钮
else if (_tcsicmp(msg.pSender->GetName(), MainWnd_Btn_AddConversionTask_Name) == 0)
{
AddTaskDialog addTaskDialog;
addTaskDialog.Create(this->m_hWnd, _T("添加任务"), UI_WNDSTYLE_FRAME, WS_EX_WINDOWEDGE);
addTaskDialog.CenterWindow();
if (addTaskDialog.ShowModal() == 0)
{
if (addTaskDialog.IsAddTask())
{
MessageBox(NULL, "a", NULL, NULL);
}
}
}
这里需要注意的是,子模态对话框在创建是需要设置父窗口为主界面,也就是:
addTaskDialog.Create(this->m_hWnd, _T("添加任务"), UI_WNDSTYLE_FRAME, WS_EX_WINDOWEDGE);
然后通过ShowModel()函数弹出模态对话框。
2.3.2 子模态对话框添加任务与取消添加按钮的实现
在子模态对话框中,不管是点击添加任务按钮或者是点击取消添加按钮,都需要主动关闭子模态对话框
// 添加任务
else if (_tcsicmp(msg.pSender->GetName(), AddTaskWnd_Btn_AddTask_Name) == 0)
{
m_bIsAddTask = true;
::SendMessage(this->GetHWND(), WM_CLOSE, NULL, NULL);
}
// 取消添加任务
else if (_tcsicmp(msg.pSender->GetName(), AddTaskWnd_Btn_CancelAdd_Name) == 0)
{
m_bIsAddTask = false;
::SendMessage(this->GetHWND(), WM_CLOSE, NULL, NULL);
}
在模态对话框中的添加任务按钮中增加相关成员变量保存需要在主界面中获取的数据,然后通过成员函数调用访问数据。
当前分类随机文章推荐
- Duilib - RichEdit作为日志输出控件,更新日志内容后并自动跳到最后一行 阅读2018次,点赞2次
- Duilib - duilib应用程序实现文件可拖拽的功能 阅读2315次,点赞1次
- Duilib - 界面出现不可拖动和不可拉伸的问题 阅读113次,点赞0次
- Duilib - Label控件文本换行 阅读1712次,点赞1次
- Duilib - 超链接文本 阅读3436次,点赞0次
- Duilib - 为列表控件UIList添加列表子项右键点击消息响应功能 阅读343次,点赞0次
- Duilib - 点击程序关闭按钮最小化到托盘,点击托盘按钮恢复 阅读1560次,点赞0次
- Duilib - 颜色属性的设置 阅读3169次,点赞1次
- Duilib - CDuiString转换为std::string 阅读1818次,点赞0次
- Duilib - 字体 阅读2953次,点赞0次
全站随机文章推荐
- WebGL/ThreeJS - 相关文档、教程网站 阅读292次,点赞0次
- Pytorch – 使用torch.matmul()替换torch.einsum(‘nkctv,kvw->nctw’,(a,b))算子模式 阅读892次,点赞0次
- 资源分享 - 计算机动画算法与技术,Computer Animation - Algorithms and Techniques(Second Edition)中文版PDF下载 阅读1138次,点赞0次
- C++ - single header跨平台高效开源日志库Easylogging++的配置和使用 阅读395次,点赞0次
- 资源分享 - Handbook of Digital Image Synthesis - Scientific Foundations of Rendering 英文高清PDF下载 阅读1189次,点赞0次
- 资源分享 - Discrete and Computational Geometry 英文高清PDF下载 阅读1533次,点赞0次
- C++ – 字节数组byte[]或者unsigned char[]与long long的相互转换 阅读1450次,点赞0次
- C++ - 获取当前进程内存使用情况 阅读8280次,点赞9次
- 2023年完美货币PerfectMoney提现到国内银行卡以及提现到支付宝/微信账户的保姆级教程 阅读811次,点赞0次
- 资源分享 - The CUDA Handbook - A Comprehensive Guide to GPU Programming 英文高清PDF下载 阅读1366次,点赞0次
评论
167