메뉴 닫기

Axure RP로 커스텀 아이콘 버튼 만들기

개요

Axure RP로 아이콘과 사각형 조합의 커스텀 아이콘 버튼을 만드는 방법입니다. 이 내용은 Axure RP 공식 홈페이지에 올라온 내용을 제가 이해한대로 옮겨적은 글입니다.

 

실습 예제 파일 다운로드

실습을 위해 공식 홈페이지에 있는 예제 파일을 다운로드하시기 바랍니다.
예제 파일 다운로드

 

커스텀 스타일 적용하기

예제 파일 중 Custom Icon Button이란 페이지를 엽니다. 캔버스에 SUBMIT이라고 쓰여있는 사각형과 봉투 아이콘이 놓여져 있을 것입니다.

SUBMIT 사각형을 선택한 후, 인스펙터 영역에서 STYLE 탭을 엽니다. 현재 BOX 1 스타일이 적용된 것으로 나올텐데, 스타일 리스트 중에서 Custom Button을 선택합니다.

다음으로 봉투 아이콘을 선택한 후, 스타일에서 Custom Button Icon을 선택합니다.

 

위젯 그룹핑

봉투 아이콘과 SUBMIT 사각형을 모두 선택한 후 그룹핑합니다(command + G). 그룹 이름은 Custom Submit Button이라고 짓습니다.

 

인터랙션 추가하기

이런 식으로 여러 개의 위젯을 하나로 그룹핑하면 마치 하나의 위젯처럼 동작하게 됩니다. 예를 들어 그룹을 선택하고 OnClick Case를 적용하면 Submit 사각형을 클릭하던지, 봉투 아이콘을 클릭하던지 동일한 OnClick Case가 적용됩니다.

또한 그룹 중에 한 위젯이라도 마우스가 위치했을 때, 모든 위젯에 마우스 인터랙션 스타일이 적용되도록 할 수 있습니다. 이를 위해 그룹을 선택한 상태에서 Properties탭에서 Trigger Mouse Interaction Styles에 체크하시기 바랍니다.

댓글 남기기