Figma 구성요소 속성

Relay는 패키징된 구성요소에 정의된 Figma 구성요소 속성을 인식합니다. 개념적으로 Figma 구성요소 속성은 Relay 매개변수와 비슷하지만 몇 가지 차이점이 있습니다.

다이어그램: 벡터 레이어에서 VectorDrawable, 이미지로

일반적으로 Figma 구성요소 속성은 Relay 플러그인을 구성하여 사용할 필요가 없으므로 겹치는 경우 Relay 매개변수에 사용하는 것이 좋습니다. 하지만 Relay 매개변수는 설명 코멘트를 허용하며 이 주석은 생성된 코드로 전달됩니다. Figma 구성요소 속성은 그렇지 않습니다.

다양한 구성요소 속성 유형과 Relay에서 이를 해석하는 방법에 관한 자세한 내용은 아래를 참고하세요.

불리언 속성

불리언 속성은 요소가 특정 디자인에서 표시될지를 제어합니다. 구성요소에서 정의해야 하는 변형의 수를 크게 줄일 수 있습니다. 예를 들어 선택적 아이콘이 있는 버튼에는 아이콘 표시 상태와 아이콘 숨김 상태에 관한 별도의 변형이 필요하지 않습니다.

Relay는 패키징된 구성요소의 불리언 매개변수를 고려하고 적절한 @Composable 함수 서명을 생성합니다.

텍스트 속성

텍스트 속성은 Relay 텍스트 콘텐츠 매개변수와 거의 동일합니다. 유일한 차이점은 문서 주석 지원입니다. Relay 매개변수와 텍스트 속성이 모두 동일한 레이어에서 선언된 경우 Relay는 매개변수 정의를 사용하여 주석을 허용합니다. 그러나 이 경우 일관된 이름을 사용하여 혼란을 피하도록 주의해야 합니다.

특정 매개변수에 주석이 필요하지 않으면 편의상 Figma 텍스트 속성을 사용하는 것이 좋습니다.

인스턴스 전환 속성

인스턴스 전환 속성을 사용하면 구성요소의 클라이언트가 하위 요소 내의 인스턴스를 교체할 수 있습니다. 개념적으로 이는 Relay 하위 매개변수와 비슷하지만 몇 가지 중요한 차이점이 있습니다.

적용 대상: 인스턴스 스왑 속성은 인스턴스 레이어에만 적용할 수 있습니다. 하지만 Relay 하위 매개변수는 인스턴스, 프레임 또는 그룹에 적용할 수 있습니다. 따라서 인스턴스 전환 속성을 사용하려면 교체된 콘텐츠 자체가 구성요소여야 하는 반면, Relay는 콘텐츠가 레이어의 모든 하위 계층 구조가 되도록 허용합니다.

범위 지정: 인스턴스 전환 속성은 구성요소 계층 구조의 최상위 구성요소에만 값을 설정할 수 있습니다. 반면에 Relay 하위 매개변수는 계층 구조에서 매개변수가 상위 수준에 노출되지 않는 모든 수준에 설정됩니다.

Relay는 패키징된 구성요소에 선언된 인스턴스 스왑 속성을 인식하고 가능한 한 하위 매개변수와 동일하게 취급합니다 (예: 생성된 코드에서 동일한 함수 서명을 내보내는 경우). Relay 하위 매개변수가 인스턴스 레이어에서 선언되면 정의가 해당 레이어에 선언된 인스턴스 전환 속성 (있는 경우)보다 우선합니다.

텍스트 속성과 마찬가지로 동일한 레이어에서 Figma 구성요소 속성과 Relay 매개변수를 모두 사용하면 이름이 일관되지 않으면 혼란이 발생할 수 있습니다. 하지만 하위 매개변수는 인스턴스 전환 속성의 기능에 큰 차이가 있으므로 어떤 항목을 어디에서 사용할지에 대한 포괄적인 권장사항은 없습니다. 둘 다 가능성이 있습니다. 구성요소의 용도에 따라 결정하게 됩니다.

대안 속성

구성요소에 변형이 2개 이상 있는 경우 변형 속성이 암시적으로 생성됩니다. Relay는 변형 속성을 생성된 코드의 enum 값으로 변환하여 지원합니다.

디자이너는 패키징된 구성요소의 인스턴스 레이어의 변형 속성을 노출하는 Relay 매개변수도 선언할 수 있습니다.