让我们从“常规”库菜单中添加一个矩形开始。单击矩形形状(左上角的形状),将其拖到图表上的某个位置,然后松开。形状将出现在您的图表中,突出显示。 只要突出显示了图表元素,右侧的“格式面板”就会被新面板替换。这是“形状格式”面板。 “形状格式”面板上有三个选项卡:样式,文本和排列。 样式选项 “样式”选项卡的第一部分处理形状颜色。单击任何颜色块将选择的形状设置为指定的颜色。通过单击“填充” 复选框右侧的色块按钮,我们可以从更广泛的颜色中进行选择。这将显示一个颜色图表屏幕。 您可以使用精细分级的色表或背景色下的较粗颜色为背景选择一种颜色。如果您使用颜色分级精细的色卡,请注意,一旦做出选择,就可以使用主色卡右侧的滑块非常精确地调整颜色。 文本字段将显示当前所选颜色的三个原色分量(红色,绿色,蓝色)的十六进制表示,并且字段背景也将更改为所选颜色。默认选择为白色。 对选择感到满意后,按“应用”将填充设置为该颜色。下面我们选择了棕色背景。请注意,填充色块按钮将更改颜色以反映您的选择。 如果您想要一个没有颜色的形状,只需取消选中“填充”复选框即可删除颜色填充。 您不必使用一种纯色填充。您可以改为使颜色在两种颜色之间逐渐变化。为此,您需要选中“渐变”复选框。这将导致另一个色块按钮出现,并且您可以执行与“填充颜色”相同的过程。一旦选择了两种颜色,就可以决定希望颜色渐变的方向。在下面,我们保留了填充色,并添加了浅黄色的渐变色,并且具有朝南的渐变。 默认情况下,形状周围有黑线边框。要更改线条颜色,请单击“线条”复选框右侧的色块按钮,然后再次执行相同的颜色选择过程。在下面,我们选择了一条红线边框。 还有其他用于自定义线条的选项:您可以选择虚线或虚线,更改线条粗细或完全删除线条。也可以在线条周围设置周长空间,这将在形状和任何连接的连接器之间创建白色空间(此效果纯粹是视觉上的-连接器将照常运行)。 下一个样式选项允许您更改形状的不透明度,这与透明度相反。不透明度为100%的形状根本不是透明的,而不透明度为0%的形状是完全透明的。这是在相同的白色背景上显示与以前相同的形状,但不透明度为30%。 下一个样式选项将各种效果应用于形状。有多少种效果取决于形状。对于矩形,这三个均可用。它们: 圆角:圆角形状 阴影:这会在形状上施加阴影 玻璃:这会增加形状表面的反射效果 我们可以按列出的顺序在下面看到所有这三种效果。中间效果阴影很淡,在draw.io之外很难看到。 使用样式 为形状选择的所有选项-或保留为默认设置-一起定义形状的显示方式。这称为形状的样式。此信息可以存储,更改,甚至可以转换为其他形状。 尽管您可以通过将样式应用于特定形状来定义样式,但是无法仅针对单个形状甚至是相同形状的所有实例(即所有矩形)定义单独的样式。样式信息是全局的,将样式应用于不同的形状时,它就是相同的样式:上一次保存的样式。 在“样式”选项卡的底部,有许多按钮与图表中样式的使用有关。我们将通过一个例子来演示它们的用法。我们将从上一张图中的形状之一开始:左侧的圆角矩形。 编辑样式 让我们从选择矩形开始,然后按下“编辑样式”按钮,这将弹出一个窗口,显示与该形状的样式相对应的XML信息。 请注意,我们已将周长间距设置为10(默认值为1)。这样的效果将在以后变得很明显。 将不同的格式声明与形状的不同属性关联起来非常简单。例如,阴影和玻璃效果都关闭,而四舍五入则打开。不同的颜色具有与选择颜色时完全相同的十六进制表示形式。 我们可以更改此处给出的值,然后按Apply,形状将调整其样式(并因此调整其外观)。样式选项卡控件也将更改以反映在此所做的任何编辑。 例如,让我们将填充颜色从棕色更改为绿色。十六进制值00FF00将给出绿色,因此我们将fillColor更改为该值(请参见下面的突出显示部分)。 当我们按Apply时,我们可以立即看到更改。填充颜色现在是绿色,而不是棕色。样式的所有其他方面均保持不变。 我们已经看到样式中的所有颜色都是可选的。如果需要,可以将其关闭。因此,如果要从样式中删除颜色渐变,可以通过删除设置gradientColor的部分来实现。 矩形现在充满了绿色的实心块。 复制样式和粘贴样式 现在,我们将讨论一种在形状之间传递样式设置的方法。让我们将圆柱体从“常规”符号菜单拖到我们的工作空间中。 因为我们刚刚添加了此形状,所以它仅具有默认的样式信息。如果我们希望它与矩形共享相同的样式,则请遵循以下过程:
  • 单击矩形,然后按“复制样式”按钮。
  • 单击圆柱体,然后按“粘贴样式”按钮。
  • 圆柱体现在具有与矩形相同的样式信息。
实际上,样式信息并不完全相同,因为圆柱形状可用的效果选项与矩形不一样,所示。 仅阴影选项可用;圆柱体既不能放置玻璃,也不能放置圆形。我们为矩形设置的舍入设置尚未传送,尽管由于圆柱体没有任何边缘,所以无论如何我们都不会注意到差异。 设置为默认样式并清除默认样式 让我们删除圆柱体,并用之前的棕色矩形替换它。 现在,让我们选择绿色矩形,然后按“设为默认样式”按钮。这会使所有新添加的形状自动具有与绿色矩形相同的样式设置。 现在让我们从“常规符号”菜单中添加一个三角形。 正如我们所期望的,三角形与绿色矩形的样式匹配。现在让我们选择棕色矩形,然后通过单击形状右侧的蓝色+符号在连接上执行复制。 此新矩形是第一个棕色矩形的精确副本,并从其父级(而不是当前设置的样式设置)中获取所有样式设置。 顺便说一句,即使箭头连接到两个形状,箭头也似乎不会碰到任何一个形状,并且会随着它们的移动而移动。这是因为我们将形状的周长间距从默认值1设置为10。 最后,我们可以取消选择所有形状,这会导致“格式”面板重新出现在屏幕的右侧。 按底部的“清除默认样式”按钮将清除所有全局样式设置。新添加的形状将不再使用保存的样式设置(当前为绿色矩形的样式设置),而是使用默认设置。 文字选项 该文本标签用于配置文本设置。第一部分,字体,介绍字体,文本对齐方式和文本大小,以及常用的粗体,斜体和下划线选项。 下一节将介绍文本颜色。勾选相应的框即可启用每个选项,这时将出现一个色块按钮。按下此按钮将弹出颜色图表屏幕。 您可以使用精细分级的色表或背景色下的较粗颜色为背景选择一种颜色。如果您使用颜色分级精细的色卡,请注意,一旦做出选择,就可以使用主色卡右侧的滑块非常精确地调整颜色。 文本字段将显示当前所选颜色的三个原色分量(红色,绿色,蓝色)的十六进制表示,并且字段背景也将更改为所选颜色。默认选择为白色。 对选择感到满意后,按“应用”设置该颜色。请注意,色块按钮将更改颜色以反映您的选择。 下一个选项是自动换行和文本格式设置。启用自动换行意味着,当文本到达文本框的边缘(面的虚线所示)时,它将自己移到下一行。与此相反,上面的文本已禁用自动换行。 格式化的文本意味着您设置的任何格式设置都将应用于文本。如果禁用此选项,那么您将看到以下内容: 格式设置数据与文本一起显示,而不是转换为文本格式。您甚至可以更改此格式数据;如果您随后重新启用“格式化的文本”,则文本格式将反映您所做的任何更改。 下一个文本选项允许您更改文本的不透明度,这与透明度相反。不透明度为100%的文本根本不是透明的,而不透明度为0%的文本是完全透明的。在这里,我们以相同的黄色背景显示与以前相同的文本,但是不透明度为30%。 最后,我们有间距。这使我们可以相对于文本框以各种偏移显示文本。在下面,我们在默认文本框的上方和右侧看到30磅的偏移量。 安排选项 的安排与对象的位置和定向标签的交易。我们可以使用提供的功能来移动形状,旋转形状,调整大小或翻转形状。 顶部是“向前”和“向后”按钮。默认情况下,最近创建的形状将与较旧的形状重叠。在这里,我们有一个与矩形重叠的椭圆,因为椭圆是在矩形之后创建的。 我们可以通过突出显示椭圆来反转此顺序,以便我们可以访问“形状格式”面板,选择“排列”选项卡,然后按“返回”按钮(或者右键单击椭圆,然后从菜单选项中选择“返回”。 通过突出显示矩形,选择“排列”选项卡,然后按“到最前面”按钮,或者右键单击矩形并选择“到最前面”,可以实现相同的目的。 接下来是“大小”选项。可以更改“高度”和“宽度”字段,以在垂直或水平方向上调整形状的大小。如果要保留高宽比,也可以勾选约束比例复选框。突出显示形状时,也可以通过单击并拖动一个角点来完成此操作。如果选中此框,则在单击和拖动时将无法更改该比例,尽管在“高度”和“宽度”框中更改值将绕过此比例。 在“高度”和“宽度”框的左侧是一个“自动调整大小”按钮。按下此按钮将调整形状的大小,使其足够大以容纳其中的任何文本标签。 在这里,我们以30磅的字体大小输入了一些文本。当前对于矩形来说太大了,因此我们单击矩形,转到“排列”选项卡,然后按“自动调整大小”按钮。 接下来,我们有了Position,其中有两个字段:一个用于形状左侧的x坐标,一个用于形状op的y坐标。更改这些字段中的值将更改形状的位置。 接下来我们有角度。这些功能处理形状的旋转。我们可以单击“旋转”每次将形状旋转90度,也可以在“角度”字段中键入一个值,然后形状将按顺时针方向旋转该值。 接下来是翻转。这会绕着中心轴翻转形状,即Horizontal或Vertical。如果形状关于该轴心对称,则执行翻转时将不会有明显变化,除非该形状具有渐变色填充或其他区分不同方向的方式。用来演示此问题的一个好形状是三角形,它在垂直翻转后看起来是一样的,但在水平翻转后看起来就不一样了。