第1章中介绍了如何设置图形的填充颜色、边缘线的颜色和文字的颜色。本节将介绍颜色菜单界面。
单击各个颜色按钮旁边的下三角按钮,会弹出颜色窗口,如图2-1所示。
图2-1 颜色窗口
在颜色窗口中,可以通过多种方式设置颜色:
·直接单击色盘选择颜色。
·单击历史记录里的颜色选择颜色。
·输入色值设置颜色。
·通过取色器,获取其他图片、元件上的颜色。
下面介绍更多高级样式的设置方法。
颜色窗口中有一个“不透明”选项,是用来设置透明效果的,如图2-2所示。不透明度是指元件填充颜色的不透明程度。不透明度为0时,则元件完全透明。
图2-2 设置不透明度
透明效果有很多用处。例如,希望在复杂的背景图片上写字,则可以在图片上添加一个黑色矩形,将不透明度设为70。加上这层矩形透明遮罩,可以让图片上的文字更易阅读,如图2-3所示。
图2-3 透明遮罩
图形和边缘线可以设置两种填充类型,即单色和渐变,可以在下拉菜单中选择其中一种填充类型。设置渐变的窗口如图2-4所示。
图2-4 渐变窗口
选中渐变范围上红圈中的小光标,可以在色盘中改变渐变颜色、调整不透明度。
例如图2-5中,a图顶部有一个透明渐变效果,加强了文字的可辨识度,同时在文字与图片间也形成了自然的过度。这个效果就是用渐变做的,渐变色值从46%的黑色到0%的黑色。
图2-5 透明渐变效果
如图2-6a所示为一个运动类APP的原型。页面地图上显示用户的跑步轨迹,绿色为快速,黄色为中速,红色为慢速。一根线上需要3种颜色,这种情况就需要设置多个色值的渐变。设置多个色值的渐变的方法如下:
(1)在两个小光标之间单击,可以添加一个小光标。
(2)左右拖曳小光标可以改变每个渐变色值所占的范围。
(3)将小光标移到另一个小光标上可以删除小光标。
图2-6 多色渐变