预订演示
前页 后页

对话框工具箱

“对话框线框”图表工具箱页面提供了用于对屏幕对话框的物理设计、外观和操作进行建模的模板。您可以通过将“对话框模式”图标拖到图表上来查看和构建对话界面模型的示例。

Example Dialog Wireframing diagram created in Sparx Systems Enterprise Architect

访问

功能区

设计> Search工具箱图表“查找工具箱项”对话框中指定“线框 -对话框”

键盘快捷键

Ctrl+Shift+3 : Search > 在“查找工具箱项”对话框中指定“线框 -对话框”

其它

您可以通过单击Chevron Right Chevron Left图表工具箱显示或隐藏图形图表视图。

屏幕类型

物品

描述

也见

对话框

生成一个代表轮廓的元素,带有标题(元素名称)。这有几个组件,您可以在“元素”属性中公开和定义,一些使用“常规”页面的“线框”选项卡上的标记值,一些使用对话框的“线框”页面。

标记值:

  • 关闭按钮 - 默认为True以在对话框的右上角显示“关闭对话框”图标;单击下拉箭头并选择False以省略图标
  • 最大化按钮 - 默认为False以省略对话框右上角的“最大化对话框”图标;单击下拉箭头并选择True以显示图标
  • 最小化按钮 - 默认为False以省略对话框右上角的“最小化对话框”图标;单击下拉箭头并选择True以显示图标
  • ScrollbarH - 默认为“ <none> ”以省略对话框上的水平滚动条;单击下拉箭头并选择“底部”或“顶部”以在相应位置显示滚动条
  • ScrollbarV - 默认为“ <none> ”以省略对话框上的垂直滚动条;单击下拉箭头并选择“左”或“右”以在相应位置显示滚动条
  • 状态栏 - 使用“状态栏”页面定义状态栏的显示
  • 用户图标 - 输入与图像管理器中列出的图标完全相同的名称,以在对话框(元素)名称之前的对话框左上角显示该图标
线框页面:

双击元素时默认显示。使用对话框底部修改状态栏的选项。

单击元素名称。

  • 状态栏- 默认为True以在状态栏的右手端描绘一个缩放栏;单击下拉箭头并选择False以省略缩放栏
  • Resize Handle - 默认为True以在状态栏的右下角描绘一个调整大小图标(点三角形);单击下拉箭头并选择False以省略图标
单击“标签” - 这定义了状态栏栏左端进度条的第一部分。
  • 名称——如有必要,用进度条的另一个名称改写文本;此文本不显示,但该字段不能为空
  • 文本- 如有必要,用不同的文本改写默认文本以显示在进度条旁边
  • 类型- 默认为“文本”以显示“文本”字段中包含的string ;如有必要,单击下拉箭头并选择:
    - 填充进度条 - 用部分填充替换文本
    矩形(用一部分描绘进度条的一部分
    处理完成),或
    -块进度条 - 用包含的矩形替换文本
    块(用于描述进度条的一部分,其中处理
    行动)
单击“进度条” - 这定义了进度条的第二段。除了没有默认的“文本”和“类型”默认为“填充”之外,属性与第一个段相同。

如果要向进度条添加另一个段,请单击元素名称,单击添加按钮并为该段提供名称。像以前一样为“文本”和“类型”属性提供值。

如果要从进度条中删除段,请单击段名称,然后单击“删除”按钮。如果您删除所有段以及“缩放栏”和“调整手柄大小”,则状态栏本身将被删除。

您可以通过单击段名称和序列按钮来更改段的Up and down hand icons

使用图像管理器

客户专区

生成代表设备客户区的框架元素。

标记值:

  • BorderStyle - 单击下拉箭头并选择将边框呈现为“实线”或“虚线”,或者根本没有边框(“无”)
  • ScrollbarH - 单击下拉箭头并选择在客户区的“顶部”或“底部”放置水平滚动条,或者没有水平滚动条(' <none> ')
  • ScrollbarV - 单击下拉箭头并选择在客户区的“左”或“右”放置垂直滚动条,或者没有垂直滚动条(' <none> ')

控件

物品

描述

也见

按钮

生成一个表示简单按钮的元素,元素名称作为按钮文本。

标记值:

  • 状态- 单击下拉箭头并为按钮选择状态:
    - Normal - 简单的矩形,用于正常显示按钮所在的位置
    刚刚可用
    - Focused - 突出显示的内边框,例如,指示,
    该按钮是默认选择
    - 选中 - 填充矩形,表示按钮是
    选择
    -禁用- 淡色文字和边框,表示按钮是
    无法使用

选择框

生成一个带标签的复选框元素,标签文本是元素的名称。

标记值:

  • 状态- 单击下拉箭头并选择要描绘的状态- “选中”(勾选图标)或“未选中”(轮廓框)

单选按钮

生成一个带标签的单选按钮元素,标签文本是元素的名称。

标记值:

  • 状态点击下拉箭头并选择要描绘的状态- '选中'(填充)或'未选中'(轮廓)

组合框

生成一个表示下拉组合框的元素。

标记值:

  • DropDownState - 单击下拉箭头并选择“打开”以描述正在使用的组合框,显示所有值,或“关闭”以描述具有单个选定值的组合框
  • 项- 单击下拉箭头并在组合框中选择要描述为当前选择的项目,如果项目列表已展开,则在列表中突出显示
    您可以更改项目的文本,并在列表中添加或删除项目,通过编辑标记值注记中的“值:”列表
将注释分配给注记标记值

标签

生成一个标签文本元素,标签文本是元素的名称。

标记值:

  • 对齐文本- 单击下拉箭头并选择将文本对齐到元素框的左侧、中心或右侧
  • 多行 - 单击下拉箭头并选择True以允许文本环绕到多行(自动增加元素深度),或False以仅显示适合当前元素宽度内的一行的文本

列表

生成一个列表框元素。

标记值:

  • 项- 单击下拉箭头并选择要在列表中突出显示的项目
    您可以通过编辑标记值注记中的“Values:”列表来添加、删除和重命名项目
  • ListType - 单击下拉箭头并选择将列表显示为“简单”、“编号”或“项目符号”

库表

生成带有标记的列、行和单元的库表元素。

双击表格,在“表”页面显示元素“属性”对话框,提供功能编辑表(添加、重命名和删除列和行,更改列宽和编辑单元)上下文菜单选项和按钮。请注记,编辑器不会提供表格在屏幕上的表图像。

标记值:

  • 划- 单击下拉箭头并选择True以显示单元表之间的水平和垂直线,或False以隐藏线
  • 突出显示标题 - 单击下拉箭头并选择True以突出显示每列的标题,或选择False使表列保持统一颜色

图像

生成一个占位符以指示图像将放置在手机或平板电脑上的哪个位置。

您可以通过将替代图像分配给元素来显示实际图像。

使用图像管理器

对话框控件

物品

描述

也见

复选框列表

生成一个描述清单的元素,其中每个项目的左侧都有一个复选框。

双击该表以在“线框”页面上显示元素“属性”对话框,您可以使用该对话框来维护此元素。

对于每个“复选框”项目,完成这些字段:

  • 名称- 键入项目的名称或文本
  • 选中 - 单击下拉箭头并选择True以显示对项目的勾选复选框,或False以显示已清除的复选框
要将另一个项目添加到列表中,请单击元素名称并单击“添加”按钮,然后为该项目提供名称。

要从列表中删除项目,请单击该项目,然后单击“删除”按钮。

您可以通过单击项目名称和序列按钮来更改项目的Up and down hand icons

格式栏

生成一个表示文本格式栏的简单元素。

如果要表示包含已定义图标的工具栏,请使用“工具栏”图标。

列表视图

生成一个元素,表示文本项的水平、矩形或垂直列表(取决于元素的大小),有或没有关联的图像。

双击表格,在“表”页面显示元素“属性”对话框,您可以使用该对话框添加、删除或更改项目及其图标。对于每个项目,完成这些字段:

  • 名称——输入项目的名称或文本;此字段不能留空
  • 图像-输入图像的名称,或单击下拉箭头并选择名称,如图像管理器中所列
  • 选中 - 单击下拉箭头并选择True以突出显示项目的名称,或False以省略任何突出显示;一次可以突出显示多个项目
要将另一个项目添加到列表中,请单击元素名称并单击“添加”按钮,然后为该项目提供名称。

要从列表中删除项目,请单击该项目,然后单击“删除”按钮。

您可以通过单击项目名称和序列按钮来更改项目的Up and down hand icons

如果您减小元素的大小,以便无法显示所有项目,则滚动条会自动显示在元素的右边缘:

Vertical scroll

使用图像管理器

状态栏

生成与“对话框”元素上自动生成的状态栏相同的元素状态栏,但您可以根据元素独立于对话框定位它。

工具栏

生成一个元素来表示图标工具栏,已经设置了一些标准工具栏图标。

双击元素以显示“属性”对话框的“线框”页面,您可以使用该页面添加、删除或更改项目及其图标。对于每个项目,完成这些字段:

  • 名称——输入项目的名称或文本;此字段不能留空
  • 图像-输入图标图像的名称,或单击下拉箭头并选择名称,如图像管理器中所列
要将另一个项目添加到列表中,请单击元素名称并单击“添加”按钮,然后为该项目提供名称。您可以将一个或多个称为“分隔符”的项目添加到显示为 | 的列表中,以划分工具栏中相关图标的组。如果您将图像添加到此项目,图像将被 | 覆盖。

要从列表中删除项目,请单击该项目,然后单击“删除”按钮。

您可以通过单击项目名称和序列按钮来更改项目的Up and down hand icons

音频播放器

生成一个简单的元素来指示音频播放器控件。

日历

生成一个表示基本日历的元素,显示从系统日期派生的今天日期。

标记值:

  • 日期 - 要么:
    - 改写此字段中显示的日期或
    - 单击下拉箭头以显示活动日历
    页面并选择日期;点击今天按钮
    将日期重置为系统日期
  • 突出显示日期 - 单击下拉箭头并选择True以突出显示日历图标上的设置日期,或选择False省略突出显示

标题

生成一个表示对话框上的标题或标题文本的元素。文本本身就是元素名称。

元素可以反映一系列标题级别中的一个,每个级别都有不同的字体样式。您可以使用元素中的“HeaderType”标记值指定要显示的标题级别。

双击元素以显示“属性”对话框的“线框”页面,您可以使用该页面添加、删除或更改标题级别和样式。对于每个项目,完成这些字段:

  • 名称——类型标题级别的名称;此字段不能留空
  • 颜色 - 单击下拉箭头并从调色板中选择适当的颜色
  • 字体大小 - 输入字体大小,或单击下拉箭头并从列表中选择字体大小
  • 字体系列 - 单击下拉箭头并从列表中选择字体类型
  • 字体样式 - 单击下拉箭头并从列表中选择样式;选择空白表示未应用样式
  • 文本对齐 - 单击下拉箭头并选择将文本左对齐、右对齐或居中对齐
  • 文本装饰 - 单击下拉箭头并选择是否显示下划线或直通,或两者都不显示(空白)
要向列表中添加另一个标题级别,请单击元素名称和添加按钮,然后为级别提供名称。

要从列表中删除一个级别,请单击该项目并单击“删除”按钮。

您可以通过单击级别名称和序列按钮来更改标题级别的Up and down hand icons

标记值:

  • HeaderType - 单击下拉箭头并选择要显示的标题级别

超链接

生成表示处于以下三种状态之一的超链接的元素:“链接”、“已访问”和“悬停”(鼠标悬停)。超链接文本是元素名称。

双击元素,显示“属性”对话框的“线框”页面,您可以使用该页面添加、删除或更改超链接状态。对于每个状态,完成这些字段:

  • 名称——输入状态的状态;此字段不能留空
  • 颜色 - 单击下拉箭头并从调色板中选择适当的颜色
  • 字体大小 - 输入字体大小,或单击下拉箭头并从列表中选择字体大小
  • 字体系列 - 单击下拉箭头并从列表中选择字体类型
  • 字体样式 - 单击下拉箭头并从列表中选择样式;选择空白表示未应用样式
  • 文本对齐 - 单击下拉箭头并选择将文本左对齐、右对齐或居中对齐
  • 文本装饰 - 单击下拉箭头并选择是否显示下划线或直通,或两者都不显示(空白)
要将另一个超链接状态添加到列表中,请单击元素名称和添加按钮,然后为状态提供名称。

要从列表中删除状态,请单击该项目并单击“删除”按钮。

您可以通过单击状态名称和序列按钮来更改状态Up and down hand icons

标记值:

  • 状态——点击下拉箭头,选择要在状态上表示的状态

菜单栏

在屏幕顶部生成一个表示标准菜单栏的元素,最初具有三个选项(“文件”、“编辑”和“视图”),“文件”选项扩展为子菜单。

双击元素以显示“属性”对话框的“线框”页面,您可以使用它来添加、删除或更改顶层、子菜单以及 - 如果您愿意 - 进一步的子级别中的菜单选项.

对于每个菜单选项 - 在任何级别 -完成这些字段:

  • '名称' - 输入此菜单项的名称
  • '展开的' - 单击下拉箭头并选择True以显示此选项的子菜单(如果有),或False以隐藏子菜单
  • “突出显示” - 单击下拉箭头并选择True以在菜单中突出显示此选项,或选择False使其不突出显示;如果 '展开的' 设置为True ,该选项会自动突出显示
要在任何级别添加菜单子选项,请单击父选项名称和添加按钮,然后为子选项提供名称。您可以将一个或多个称为“分隔符”的项目添加到列表中,该列表显示为列表中的水平线,以划分菜单中相关选项的组。

要从列表中删除选项,请单击该项目并单击“删除”按钮。

您可以通过单击选项名称和序列按钮来更改选项的Up and down hand icons

要在两级菜单之间移动选项,请单击选项名称和Left and right hands icons.按钮。

段落

生成一个没有边框的文本元素,但它可以包含具有基本 HTML 格式的多行文本。

标记值:

  • 对齐文本- 单击下拉箭头并选择将文本对齐到元素框的左侧、中心或右侧
  • 文本——点击Browse.按钮,编辑“标记值注记”界面,可以创建文字在图表上描绘;这可以使用 HTML 格式标记,例如 <b> </b> 用于粗体或 <u> </u> 用于下划线 - 并非所有 HTML 格式都受支持

进度条

生成一个状态元素,代表一个进程的进度。

标记值:

  • 填充百分比 - 默认为 30%完成;键入要描述的完成百分比(进度条的填充量)
  • 填充样式 - 单击下拉箭头并选择:
    - 'Filled' 表示完成百分比
    实心条,或
    - '块' 表示完成百分比
    一系列块或垂直条

评级控件

生成一个描述星级的元素。元素总是显示五颗星,填充的星数表示评级。

标记值:

  • 评分 - 单击下拉箭头并选择要显示的星数(评分)
您只能水平调整元素的大小;垂直尺寸会自动调整以始终描绘五颗形状均匀的星星。

滚动条 - 水平

生成一个表示水平滚动条的元素。

滚动条 - 垂直

生成一个表示水平滚动条的元素。

选项卡控件

生成一个表示一系列选项卡或页面的元素。您可以命名选项卡并将它们标记为选中;但是,在更改选项卡时,子元素不会“切换”(也就是说,将不同的选项卡设置为选定的选项卡仍会在选项卡空间中显示相同的子项)。

标记值:

  • 选项卡 - 单击下拉箭头并单击要突出显示为选中的选项卡
    您可以通过编辑标记值注记中的“值:”列表来命名选项卡,并添加更多到列表中
如果您减小元素的大小以使所有选项卡都无法显示,则滚动图标 ( Horizontal scroll icon ) 会自动显示在元素的右上角。
将注释分配给注记标记值

文本字段

生成一个带有浅边框的文本元素,该文本是元素名称,表示一个简单的数据输入字段。

视频播放器

生成一个表示视频播放器控件的元素。

日期/时间选择

生成一个表示 Microsoft 日期/时间选择的元素。

标记值:

  • CustomFormat - 使用这些区分大小写的代码(按字母顺序列出),为任何或所有日期、日期、月份、年份、小时、分钟和秒组件键入自定义格式:
    - d - 使用一位或两位数字显示月份中的日期
    - dd - 使用两位数字显示月份中的日期,数字1到 9
    前面有一个 0
    - ddd - 将星期几显示为三个字符
    缩写
    - dddd - 完整显示当天的名称
    - h - 使用一位或两位数字显示小时,以 12 小时为单位
    时钟格式
    -hh - 使用两位数字显示小时,数字1到 9 前面
    一个 0,12 小时制格式
    - H - 使用一位或两位数字显示小时,24 小时制
    时钟格式
    - HH - 使用两位数字显示小时,数字1到 9 前面
    一个 0,24 小时时钟格式
    - m - 使用一位或两位数字显示分钟
    - mm - 使用两位数字显示分钟,数字1到 9
    前面有一个 0
    - M - 使用 1 或
    两位数
    - MM - 使用两位数显示月份的数字,数字
    1到 9 前面有一个 0
    - MMM - 将月份名称显示为三个字符
    缩写
    - MMMM - 完整显示月份名称
    - s - 使用一位或两位数字显示秒数
    - ss - 使用两位数字显示秒数,数字1到 9
    前面有一个 0
    -t - 用单个字符识别上午或下午( A表示
    上午,P 代表下午)
    - tt - 用两个字符识别上午或下午
    缩写 AM 或 PM
    -y - 使用一位数显示年份(2022 显示为 2)
    - yy - 使用两位数显示年份(2022 显示为 22)
    - yyyy - 完整显示年份(例如,2022)
  • 日期 - 改写日期,或单击下拉箭头以显示日历,您可以从中选择要显示的日期;默认为今天的日期 - 如果您将其更改为固定日期并希望返回当前(系统)日期,请单击“今天”按钮
  • 格式 - 单击下拉箭头并选择用于显示日期和时间的格式代码:
    - Long - 全天名称,日期,全月名称,
    全年(例如:2022 年 2 月 17 日,星期三)
    - 短 - 以个位数/两位数表示的月份中的某天,
    以两位数表示的月份,完整的年份(例如:
    17/02/2022)
    -时间- 12 小时格式的小时、分钟和秒(对于
    例如下午 12:59:34)
    - 自定义 - 应用您在
    'CustomFormat'标记值

树控件

生成一个表示层次结构或节点树的元素,用虚线连接兄弟节点,并在具有子节点的节点旁边有一个扩展框(+ 或 -)。

双击元素以在“线框”页面显示“元素属性”对话框,您可以使用该对话框添加、删除或更改顶级、子级别以及 - 如果您愿意 - 进一步子级别的树节点水平。

对于每个节点 - 在任何级别 -完成这些字段:

  • 名称- 输入此节点的名称
  • 展开的- 点击下拉箭头并选择True显示该节点的下级节点(如果有),或False隐藏下级节点
  • 选中 - 单击下拉箭头并选择True以突出显示此节点,或选择False使其不突出显示
要在任何级别添加子节点,请单击父节点名称并单击“添加”按钮,然后为子节点提供名称。

要从层次结构中删除节点,请单击节点名称并单击“删除”按钮。

您可以通过单击节点名称和序列按钮来更改节点的Up and down hand icons

要在层次结构的两个级别之间移动节点,请单击节点名称和Left and right hands icons.按钮。

您也可以在属性窗口的“线框”选项卡上直接编辑元素的 XML。

组框

生成一个表示元素的元素,该元素的名称在左上角。您可以使用此元素来包围和组合对话框的其他元素。

模式

物品

描述

也见

对话框

此模式生成一个小对话框,其中包含三个带有数据输入字段和单选按钮的面板以及两个按钮,如本主题开头所述。您可以将此作为示例,或作为类似对话框设计的基础。

了解更多