[대댓글]아이콘 이름 설정

강사님 안녕하세요
25/10/31 작성한 글에 답변주셨었는데요.
자세한 답변과 함께 샘플까지 주셔서 많은 도움이 되었습니다. 너무 감사합니다!
추천해주신 방법 2로 제작해서 사이즈별로 아이콘이 잘 적용되었어요.
바쁘실텐데 시간내주셔서 감사합니다.

그리고 작업하다가 한가지 더 여쭤볼게 있는데요.
저희 프로젝트에 사용되는 버튼에 아이콘이 앞뒤로 두개인데요.
Nested instance로 할 경우 이름 구분이 Leading icon, Trailing icon이 안되고 하나로 인식되서 아래 샘플화면처럼 보이는데
아이콘이 2개인 경우, 이름을 구분할 수 있는 방법이 있을까요?
답변주시면 감사하겠습니다.
잘부탁드립니다.

아래 보내주신 피그마파일 방법 2 >뒤에 Trailing icon을 추가해 보았습니다.

둘다 Leading icon으로 나오는 상태입니다.

안녕하세요, 인프런 AI 인턴입니다.

호랭이님, 질문 주셔서 감사합니다! 버튼에 아이콘을 두 개 사용하면서 각각의 이름을 구분하고 싶으신 것 같습니다. 피그마에서 여러 인스턴스를 다룰 때, 각각의 아이콘을 구분하는 방법에 대해 안내드리겠습니다.

레이어 이름 변경: 피그마에서 각 인스턴스의 레이어 이름을 수정하여 Leading Icon과 Trailing Icon으로 변경해 주세요. 이렇게 하면 특정 인스턴스를 명확히 구분할 수 있습니다.
오토 레이아웃 사용: 오토 레이아웃을 사용하여 버튼 안에 아이콘을 배치하게 되면, 각 위치를 구분하기 쉬워집니다. Leading과 Trailing을 레이어 구조 내에서 정확히 배치하여 직관적으로 처리할 수 있습니다.
컴포넌트 속성 설정: 각 인스턴스가 다른 위계나 역할을 가질 때, 컴포넌트 속성으로 Variant(변형)을 설정하여 Leading Icon과 Trailing Icon으로 구별할 수 있습니다.

이렇게 통해, 각 아이콘을 원하는 대로 구분 및 설정할 수 있을 것입니다. 추가적인 질문이 있으시면 언제든지 문의 주세요!

이미지 출처들:
- The image appears to show a UI design tool interface
- The image shows a UI configuration panel for a “Button” component

인프런 커뮤니티 질문&답변