Relay 识别打包组件上定义的 Figma 组件属性。从概念上讲,Figma 组件属性类似于 Relay 参数,但存在一些差异。
通常,Figma 组件属性不需要 Relay 插件来配置和使用,因此在存在重叠时,最好在 Relay 参数中使用它们。但是,请注意,Relay 参数允许使用描述性注释,该注释会传递到生成的代码中;Figma 组件属性则不会。
请参阅以下内容,了解有关不同组件属性类型以及 Relay 如何解释它们的更多详细信息。
布尔属性
布尔属性控制是否在特定设计中显示元素。它们可以极大地减少组件需要定义的变体数量。例如,带可选图标的按钮不需要为图标显示状态和图标隐藏状态分别定义变体。
Relay 尊重打包组件中的布尔参数,并生成相应的 @Composable 函数签名。
文本属性
文本属性几乎与 Relay 文本内容参数相同;唯一的区别是支持文档注释。如果在同一图层上声明了 Relay 参数和文本属性,则 Relay 使用参数定义以允许注释。但是,在这种情况下,应注意使用一致的命名以避免混淆。
如果特定参数不需要注释,我们建议为了简单起见使用 Figma 文本属性。
实例交换属性
实例交换属性允许组件的客户端交换子级内部的实例。从概念上讲,这类似于 Relay 子级参数,但存在一些关键差异
适用性:实例交换属性只能应用于实例图层。但是,Relay 子级参数可以应用于实例、框架或组。因此,使用实例交换属性要求交换的内容本身是一个组件,而 Relay 允许内容是任何图层子层次结构。
范围:实例交换属性只能在其值在组件层次结构中的顶级组件中设置。相比之下,Relay 子级参数是在层次结构中的任何级别设置的,在该级别参数不会公开到父级。
Relay 识别打包组件上声明的实例交换属性,并尽可能将其视为等同于子级参数(例如,在生成的代码中发出相同的函数签名)。如果在实例图层上声明了 Relay 子级参数,则其定义优先于在该图层上声明的实例交换属性(如果有)。
与文本属性一样,如果命名不一致,则在同一图层上同时使用 Figma 组件属性和 Relay 参数可能会导致混淆。但是,由于子级参数在功能上与实例交换属性存在重大差异,因此我们没有关于在何处使用哪一个的一般性建议。两者都是可能性。组件的预期用途将决定此决策。
变体属性
变体属性 在组件具有多个变体时隐式创建。Relay 通过将它们转换为生成的代码中的枚举值来支持变体属性。
设计师还可以声明公开打包组件中实例图层变体属性的 Relay 参数。