이해하기 쉽도록 애니메이션 버튼 선택

페이지 업데이트 :
페이지 생성 날짜 :

검증 환경

윈도우
  • 윈도우 11
유니티 에디터
  • 2020.3.25에프1

이 팁의 전제 조건

이 팁을 설명하기 위한 전제 조건으로 다음 설정이 미리 이루어졌습니다.

참조

처음에

버튼을 선택하면 기본적으로 약간 어두워집니다.

그러나 혼란스러울 수 있으므로 인스펙터에서 선택 영역의 색상을 변경할 수 있습니다.

여기서는 버튼을 추가 요소로 선택할 때 버튼이 더 크게 보이도록 하고 싶습니다. 버튼이 커지면 애니메이션에서 서서히 커지는 등의 움직임도 추가됩니다.

버튼 배치

버튼을 정상적으로 배치합니다. 버튼이 더 커질 수 있으므로 잠시 멈춥니다.

애니메이션 설정

버튼을 선택한 상태에서 Button 구성 요소에서 "Transition"을 "Anime"으로 변경합니다.

그러면 "Auto Generate Animation"이라는 버튼이 나타나므로 클릭하십시오.

Save Anime Controller 대화 상자가 나타납니다. 위치는 임의적이지만 이번에는 장면과 같은 폴더에 Scenes 저장됩니다. 파일 이름은 ButtonSelected 입니다.

프로젝트에서 다음 파일이 만들어집니다. 애니메이션의 유형은 버튼의 동작과 관련이 있습니다.

애니메이션 창을 표시합니다.

방금 애니메이션을 생성한 버튼을 선택합니다.

그러면 anime 탭의 내용이 활성화되므로 anime 유형 Selected 에서 선택하십시오.

녹음 버튼을 클릭합니다. 이 상태에서 인스펙터의 각 값을 변경하면 애니메이션 중에 파라미터로 등록됩니다.

이 상태에서 Rect Transform 컴포넌트 스케일(Component Scale) 을 1.25 로 설정합니다.

덧붙여서 구성 요소의 색상도 선택할 때의 색상으로 하늘색으로 Image 설정되어 있습니다.

완료되면 녹음 버튼을 클릭하여 중지합니다. scale과 Image.Color가 설정된 것을 볼 수 있습니다.

게임을 실행하고 움직이십시오. 버튼을 선택하면 애니메이션하는 동안 스케일과 색상이 바뀌는 것을 볼 수 있다고 생각합니다.

애니메이션 설정은 이전에 만든 ButtonSelected.controller 에 저장되기 때문에, 같은 애니메이션을 다른 버튼에 적용하고 싶은 경우는이 파일을 버튼에 첨부하여 같은 애니메이션을 적용 할 수 있습니다.

전환을 애니메이션으로 만드는 것을 잊지 마십시오.

애니메이션의 시간 변경

만든 애니메이션의 기본 작동 시간은 0.25초로 설정되어 있습니다. 이것이 빠른지 늦은지, 아니면 딱 맞는지는 사람에 따라 다를 수 있습니다.

이 애니메이션의 시간을 변경하려면 아래 단계에 따라 변경할 수 있습니다.

프로젝트에서 만든 애니메이션 컨트롤러(ButtonSelected.controller)를 두 번 클릭합니다.

anime 탭이 선택되면 다음과 같은 화면이 표시되므로 Any State 연결하는 Selected 선을 선택하고 .

인스펙터의 설정을 확장하면 "전환 간격(s)"이 있으므로 이번에는 로 설정합니다 0.1 .

애니메이션이 빨라지고 있는지 확인하십시오.