品牌型号：联想GeekPro 2020
系统：Windows 10 64位专业版
软件版本：Figma入门版
Figma拥有优秀的矢量图形设计功能，能帮助设计师轻松在线设计产品。同时，Figma也提供了丰富的现成UI组件资源，一键就能应用在设计面板中，可大大提升设计师的工作效率。接下来，一起来学习下Figma怎么使用现成的UI组件，Figma怎么使用剪贴蒙版的相关内容。
一、Figma怎么使用现成的UI组件
Figma在设计面板中内置了丰富的资源，其中包括各种现成的UI组件，可快速添加各种常用的图形、图标等。接下来，本文会简单演示Figma怎么使用现成的UI组件。
首先，如图1所示，点击左侧面板的草稿添加按钮，选择添加“设计文件”。
图1：创建设计文件
创建设计文件后，如图2所示，左侧工具栏会默认显示文件面板。如果要使用现成的UI组件资源，需要在左侧工具栏中切换“资源”面板。
图2：资源
在资源面板中，如图3所示，包含了搜索栏以及各种组件库列表。将所需的组件关键字输入搜索栏，即可快速检索所需的UI组件。当然，我们也可以打开列表中的组件库，选择合适的组件使用。
图3：组件库
比如打开简单的系统设计元素组件库，如图4所示，可添加各种简单的按钮图标组件。将组件从库拖入设计面板，即可快速添加图标。
图4：添加组件
添加了图标组件后，选中组件，如图5所示，可在右侧工具栏对组件的属性进行调整，比如调整图标的填充颜色、填充透明度、描边效果、边距等。
图5：属性调整
二、Figma怎么使用剪贴蒙版
Figma的剪贴蒙版能隐藏部分的图层内容，起到控制图层显示范围的作用。Figma的剪贴蒙版也常作为遮罩使用，图层内被遮挡的区域会隐藏，而未被遮挡的区域则会显示出来。下面一起来看看Figma怎么使用剪贴蒙版。
首先，使用底部的插入图形工具绘制图形以及插入图片。
图6：绘制矩形
如图7所示，在设计面板中绘制一个椭圆形，并插入一张图片，以制作椭圆形的剪贴蒙版。在椭圆形蒙版的作用下，图片仅会显示局部的图像。
图7：绘制圆形与导入图片
完成对象的插入后，如图8所示，在Figma左侧的图层面板中，会自动新增两个图层，分别是椭圆形图层与图片图层。
接下来，我们需要将椭圆形设置为剪贴蒙版，右击椭圆形图层，在弹出的右键快捷菜单中选择“设为蒙版”即可。
图8：设为蒙版
完成蒙版的设置后，如图9所示，椭圆形图层的上一级会出现一个蒙版组，此时，将图片所在的图层拖到椭圆形图层上方，注意图片图层需添加在蒙版组内。
图9：移动图层
图层调整效果如图10所示，可以看到，在左侧图层面板中，图片与椭圆形所在的图层均包含在蒙版组内。按照以上图层设置，设计面板中会呈现出椭圆形的遮盖效果，在椭圆形区域的图像会显示出来，反之则会隐藏。
图10：蒙版效果
三、小结
以上就是关于Figma怎么使用现成的UI组件，Figma怎么使用剪贴蒙版的相关内容。Figma提供了丰富的组件库资源，可以直接使用到产品设计中，以减少图形绘制的时间，提高工作效率。另外，Figma可利用剪贴蒙版制作局部遮盖的效果，让产品的设计更具变化与多样性。
承担因您的行为而导致的法律责任，
本站有权保留或删除有争议评论。
参与本评论即表明您已经阅读并接受
上述条款。