-
设计环境
创建或打开本机应用程序对话框设计器文件时,设计器将在设计文档中显示其外观。以下是我们编辑此文件时 Visual Studio 的总体视图:
我们可以获取如下相关功能:
-
设计文档,其中对话框以图形方式编写。该文档像任何源文件一样集成在解决方案资源管理器中。
-
包含可放置在对话框中的小部件的工具箱。
-
显示所选小部件的属性和回调的属性窗口。
-
可以修改两个 C++ 生成文件以自定义生成的代码。
-
创建小部件
widget的创建过程取决于创建的widget父容器。基本上,在工具箱中选择要创建的小部件类型后,开发者可以单击容器以选择组件的第一个角,然后拖动以选择第二个角以定义组件的大小。如果容器没有网格布局,则无法调整其大小,并且会在第一次单击时创建。同时可以随时通过右键单击或使用退出键来中止小部件创建过程。我们针对每种类型的容器描述此过程。
带布局的容器
仅当父容器是 CATDlgDialog、CATDlgFrame 或 CATDlgTabPage 时,才会应用此行为。
1.在工具箱中选择所需的小部件。
2.将小部件移动到其边框之一。
设计者尝试将创建的小部件放置在鼠标光标处最深的容器中。该容器周围有一个黑色框架,向用户展示将要使用的容器。然后,计算与容器上的鼠标位置相对应的行和列。
如果鼠标光标位于行/列边框上,设计器会自动在该位置创建新的行/列。
如果某个小部件已位于鼠标位置,则创建的小部件将以红色阴影线表示,以向用户表明在此位置无法创建小部件。
3.单击向下确认第一个边框。
如果当前鼠标位置被另一个小部件占据,则过程返回到步骤2。
4.将鼠标拖动到小部件的第二个边框。
设计者计算第一个点所在的容器上最接近光标位置的行和列。该小部件占据第一个选定点和当前计算点之间的位置。如果某个小部件与创建的小部件相交,则该小部件会以红色阴影显示,以向用户表明在此位置不可能创建小部件。
5.释放鼠标单击以确认小部件尺寸。
如果当前鼠标位置被另一个小部件占据,则过程返回到步骤 4。
如果该过程成功,新的小部件将集成在对话框中并被选中。
没有布局的容器
仅当父容器是 CATDlgContainer 或 CATDlgSplitter 时,才会应用此行为。没有布局的容器中插入的小部件没有大小。该过程在 3 个步骤后停止,即第一次单击鼠标时:
1.在工具箱中选择所需的小部件。
2.将小部件移动到其位置。
3.单击向下确认位置。
选项卡容器
选项卡容器是用一个选项卡页创建的。
该标签页是一个具有网格布局的容器,可以填充其他小部件。可以通过单击选项卡容器的内部来选择和编辑它。这对于更改选项卡页标题或删除它特别有用。
它还显示一个灰色页面,可用于生成新标签页。只需单击该虚拟页面即可指示设计者应创建一个新页面。创建新页面时,它会自动显示为活动选项卡。
一旦创建了多个选项卡页面,用户只需单击相应的选项卡项即可选择显示的页面。只需单击要移动的页面并将其拖动到新位置即可修改页面顺序。单击鼠标右键可以取消该命令,移动的选项卡将被放置到其原始位置。
-
操作现有的小部件
移动小部件
可以拖动小部件来定义新位置,或更改其容器。当拖动小部件时,它的大小将被保留,除非将其拖动到没有布局的容器中。拖动的小部件将放置在鼠标光标下方最深的容器中。
对于此操作,不会自动创建行/列,如果移动的小部件覆盖了现有的小部件,则会以红色阴影显示,并且该操作无法进行。如果用户在小部件相交时释放鼠标单击,则操作将被取消,并且移动的小部件将返回到其原始位置。
开发者可以随时通过右键单击来中止小部件创建过程。
CATDlgDialog 和 CATDlgTabPage 无法拖动。
调整小部件的大小
当选择一个小部件时,会出现一个大小调整手柄。可以通过选择然后拖动大小调整手柄来调整小部件的大小。
开发者可以随时通过右键单击来中止小部件创建过程。小部件返回到其原始大小。
CATDlgDialog 和 CATDlgTabPage 无法调整大小。
删除小部件
任何选定的小部件(对话框除外)都可以通过按“Del”键或使用小部件上下文菜单来删除。删除容器也会删除其子窗口小部件。
复制粘贴
可以使用 Ctrl+C 键或上下文菜单项“复制”来复制任何选定的小部件。然后,该小部件被放置在剪贴板上,并且可以使用 Ctrl+V 键或上下文菜单项“粘贴”粘贴到任何本机应用程序对话框设计器文档中。粘贴小部件时,小部件不会立即放置在设计的对话框中。开发者仍然必须使用与从 Visual Studio 工具箱创建新小部件相同的交互技术来验证其位置。特别是,可以使用 Esc 键或单击鼠标右键来取消粘贴命令。如果复制一个容器,设计者也会复制它的所有子容器。
某些容器无法按原样复制并放置在对话框内(例如 CATDlgDialog 或 CATDlgTabPage 小部件)。这些小部件在粘贴之前会转换为 CATDlgFrame。然而,它们的内容在操作中被保留。
快速复制
开发者可以通过在按住 Ctrl 键的同时移动小部件来执行小部件的快速复制。如果在释放鼠标左键时仍然按下 Ctrl 键,设计器会将选定的小部件复制到指定的位置。
多重选择
开发者可以通过在单击小部件时按住 Ctrl 键来选择多个小部件。如果已选择某个小部件,则单击该小部件将取消选择它。
多重选择可用于同时删除多个小部件或编辑所有选定小部件的通用属性。但是,移动、调整大小和复制命令不能在多选上下文中使用。
- 编辑小部件属性
选择小部件后,可以在 VS 属性窗口中编辑其属性。某些属性对设计视图有直接的视觉影响,例如小部件标题或其方向(如果有)。这种视觉反馈有助于用户创作其对话框,而无需不断使用模拟应用程序。
可以使用小部件上下文菜单打开属性窗口。
图标属性
Native Apps Dialog Designer 应用程序中的图标使用标准 V6 流程进行处理:在运行时视图的串联、resources\graphic\icons 或 resources\graphic\icons\normal 目录中搜索图标。开发者可以直接输入图标的名称(没有路径和扩展名)。将在当前串联路径的每个图标资源路径中搜索该图标。我们还提供了一个特定的工具,可以轻松找到图标,并强制用户定义当前运行时视图串联中存在的图标。
在属性窗口中,每个图标属性都有一个浏览按钮,该按钮将启动图标研究对话框:
这打开了以下对话框:
此对话框列出了当前串联中的每个可用路径,并包含一个附加项“全部”,它将列出当前串联中的所有可用图标。
可以过滤图标以更快地查找特定图标。此搜索功能使用类似通配符的语法:
过滤器不区分大小写。
锚定小部件
如果小部件放置在具有网格布局的容器中,则可以使用锚点上下文菜单访问其锚点:
然后,选定的小部件将被锚点编辑器包围:
附加的侧面用黑线标记,并且可以通过鼠标左键单击小部件边框旁边的按钮来切换附加的方面。
编辑器还允许对小部件的恒定大小方面进行编辑。绿线表示小部件的大小可以变化,橙色线表示其大小是固定的。可以通过在线上单击鼠标左键来切换此方面。
当选择一个小部件时(但不是在编辑锚点时),该小部件的锚点状态会有直接的视觉反馈。连接的侧面在相应的边框上显示有一条蓝线。如果小部件尺寸固定在某个方向上,则会在相应方向上绘制一条红线。
开发者还可以在属性窗口中编辑小部件锚点。每个锚点参数都可以作为单独的属性进行编辑。特别是,可以在选择多个小部件的情况下编辑这些属性。例如,开发者可以选择必须附加到其左侧的多个小部件,并同时为所有选定的小部件设置此属性。
控制布局
尽管小部件创建过程可以修改布局以将创建的组件包含在新行/列上,但可能需要重新定义布局方面。如果一列在一些约束修改后变得无用,我们必须能够销毁它。此外,我们必须能够定义哪些行/列可以调整大小,哪些行/列的大小是固定的。
如果选择带有布局的容器,我们将在设计窗口边缘绘制布局形式,用户可以使用上下文菜单与其交互,以定义上一段中指定的每个方面。
控制一行:
控制行边框:
Insert row/column 命令可以随时实现。
Split row/column 命令自动调整行/列中包含的组件的大小,以便它们在拆分后占据两行/列。
如果 Merge rows/columns 和 Delete row/column 命令导致小部件破坏,则它们将被禁用。仅当行/列完全空闲时才可能破坏行/列。对于合并操作,要合并的两列中的同一行中不能有两个不同的小部件,或者要合并的两行中的同一列中不能有两个不同的小部件。
最后,可调整大小的行/列在边距中突出显示,以便用户可以看到它们。可以使用上下文菜单或直接右键单击边缘线来切换可调整大小的方面,以显示行/列是否可调整大小。对话框边框旁边的一条线指示其可调整大小状态:如果可调整大小,则为绿色,否则为橙色。
编辑回调
小部件回调位于 Visual Studio 属性窗口中的特殊属性选项卡中。
此选项卡显示为所选小部件定义的回调列表。可以使用以下 3 种方法指定回调名称:
- 直接输入回调名称。
如果未定义回调,则会在文档的代码部分中创建一个新函数。编辑器自动切换到对话框的代码视图,并指向回调函数代码的可编辑部分。
- 请求一个新生成的名称。
每个回调属性都有一个包含选项 generate new 的下拉列表。这会自动生成一个新的唯一方法名称(两个回调永远不会具有相同的名称)。但是,不会检查用户指定的类成员和方法,并且这些成员和方法仍然可能发生名称冲突。生成回调后,将打开代码视图,并将光标置于回调的用户代码上。
- 重用先前定义的回调。
下拉列表还显示所有已创建的回调的列表。如果选择现有名称之一,则在小部件事件和编码函数之间建立关联。
- 模拟应用程序
设计器显示的对话框的渲染图与其真实外观很接近。然而,故意留下了一些差异,以帮助设计者更快地创建其对话框(例如,小部件之间的一些空格)。此外,我们希望能够看到调整对话框大小时的行为。为了快速准确地测试设计的应用程序,我们创建了一个应用程序,该应用程序将使用对话框框架的真实 C++ 代码动态创建对话框(无需编译)。
要模拟对话框,请使用设计图面上的上下文菜单:
有时,模拟器不会出现在 Visual Studio 之上。如果几秒钟后模拟器窗口不可见,则意味着它很可能位于当前 Visual Studio 窗口下方。
警告:
有时,模拟器不会出现在 Visual Studio 之上。如果几秒钟后模拟器窗口不可见,则意味着它很可能位于当前 Visual Studio 窗口下方。
如果打开工作区时未计算运行时环境,则会出现以下提示。
在这种情况下,请再次打开工作区,然后在 Open Options 中取消选中 Disable Run Time Environment Computing 。
- 访问生成的代码
设计器创建两个从设计器文件 (.DSGen) 生成的代码文件:C++ 头文件 (.h)和C++ 实现文件 (.cpp),每个文件都可以从设计界面上的上下文菜单访问:
创建后,它们将添加到 C++ 项目中,并且可以直接从 Visual Studio 解决方案资源管理器打开:
这些文件显示了 mkmk 将生成的代码,以实现图形设计的对话框。此生成的代码呈灰色且只读。这些视图还包括一些具有白色背景的可写部分,用户可以在其中自定义生成的代码。
在标头中,用户可以指定:类依赖、类成员(字段或方法)。并在实现文件中:额外includes、构造函数中的代码、析构函数中的代码、必须在对话框构造之前或之后执行的代码、标头中声明的自定义方法的实现、各个回调方法的代码。
- 编译设计的对话框
实现对话框的最终 C++ 代码的生成完全集成在 mkmk 中。只需在包含对话框文件(.DSGen 文件)的模块上启动 mkmk,编译器就会自动将其翻译为 C++ 代码,然后编译并将其链接到位于该模块中的其他文件。
设计工具不会更新Identity card和定义包含对话框的模块的先决条件的 Imakefile。开发者必须手动编辑它们,以添加包含对话框中使用的小部件实现的框架(在Identity card中)或模块(在 Imakefile 中)。每个小部件所需的框架和模块都在文档中描述,位于每个小部件描述的顶部。
- 使用对话框作为命令
将对话框用作简单的、基于对话框的交互式命令非常简单。
唯一需要做的就是将对话框的“IsCommand”属性设置为 true,如下图所示。
这将触发生成 3 个重写方法,这些方法继承自 CATCommand(通过 CATDlgDialog):Activate、Desactivate 和 Cancel。还会生成 CATCreateClass 宏的调用和默认构造函数。
评论