变体Variants是属性Propertie下的其中一种属性类型，在Figma早期的变体组件中只能添加这一种属性类型。

随着Figma的更新和迭代，目前 Propertie下包含了四种属性类型，分别是：

• Variants：变体，用于关联不同属性值和组件样式
• Text：文本，内置预设可关联的文本信息
• Boolean：布尔，用于开启和关闭某些图层
• Instance Swap：切换实例，可以让下级组件进行快速切换

除了变体外，Text、Boolean、Instance Swap主要是作用在下级图层中，在子组件应用中可以在不切换组件变体时针对下级图层进行调节，提高组件应用的灵活性。

Text属性的认识

Text 文本属性，在添加后包含命名和值两个输入设置。命名即这个文本属性的名字，在添加多个文本属性后便于区分，值则是这个文本属性下添加的默认文本，用于在图层内展示。

创建完文本属性后对组件本身是没有影响的，需要在原始组件内实现文本图层和文本属性的关联，才能让它发挥作用。

添加关联的做法在选中组件下级的文本图层后，点击右上方的 Apply Variable/Property 按钮，关联该Text属性。之后该文本图层内的文本，就会被这个Text属性的值替换。

Figma增加这个功能，就为了让用户在引用子组件后，在属性面板中编辑文本，而不是直接在画布内编辑文本。所以该组件内有多少文本是需要引用子组件后变更的（比如价格、用户名、文章标题名等），就创建多少个Text 属性关联上，最终只在右侧属性栏内编辑即可。

Boolean 属性的认识

Boolean 布尔属性，包含命名和开关设置。它主要的作用就是让组件内的图层，可以用开关控制显示或隐藏。

创建完布尔属性后，也需要将图层关联到布尔上才能发挥作用，需要从下级图层属性中的Appearance面板中点击关联 Apply Variable/Property，选择对应的布尔属性。

之后创建子组件，那么右侧的属性栏中就会包含布尔的开关，可以控制特定图层的显示或隐藏。

值得注意的是，变体和布尔都有开关但它们不是相同的功能，所以尽量用命名来区分它们。

Instance Swap 属性的认识

Instance Swap 切换实例属性，包含命名和默认组件两个设置。它主要的作用是让用户可以快速将指定组件切换成其它组件。

切换实例属性的创建需要满足一定的条件。

例如我们相对组件 1 创建切换实例属性，那么第一在文件中需要存在其他组件 (组件 2、组件 3)，这时创建切换实例时才能将组件 2 或组件 3 选择为默认组件和偏好组件；第二则是组件 2 或组件 3 的子组件需要成为组件 1 内的子元素，只有选中这些子元素，才能在它们的属性面板上关联切换实例属性。

完成关联时，可以选择多个组件对象作为切换实例。比如一个卡片下的标签元素，可能是一般标签组件，也可能是活动标签组件，我们就可以用切换实例把这些组件提前选择筛选出来，在后面创建的子组件属性栏中直接进行选择。

如果没有创建切换实例，子组件也可以通过属性面板中的组件选择实现组件的切换。一般组件切换可以选择整个组件库中所有组件，而切换实例提前做过筛选，可以提升选择的效率。

这里还有一个需要注意的地方，想要达成切换实例的组件筛选效果，需要在 Preferred Value 中至少选中两个值，否则与一般组件切换没有区别。

总结起来，Figma中的组件属性Property，就是为创建出来的子组件提供样式变更的方法。变体 Variant 用于切换组件的不同状态和样式，文本Text、布尔Boolean、切换实例Instance Swap用于控制不同状态和样式下级的图层元素。

该功能的设计目标是将针对子组件的调节都集中到右侧的属性面板（类似Sketch），但这个操作过程非常复杂，维护成本也很高，所以并不是在所有组件中应用就一定能带来效率的提升。设计师需要自己考虑每个组件的属性创建需要，尽量精简属性使用的数量，才能最大化它们的使用价值。