Animation 효과 적용하기

조건이 만족되면 미리 설정한 연속적인 과정들을 애니메이션처럼 볼 수 있다.

1. 배경 설정

1) Designer 상단 도구모음에서 Image 클릭 후 작화 화면 전체를 드래그하고 배경화면 이미지를 선택한다.

​

2) 작업 중 배경이 움직이지 않도록 Object Explorer에서 배경화면을 객체 잠금한다.

2. 태그 생성하기

1) Tag Explorer에서 Group Tag를 1개 추가한 뒤 Properties에서 이름을 “Animation”으로 변경한다.

​

2) 생성한 “Animation” Group 안에 Digital Tag를 1개 추가한다.

3. 화면 구성하기

1) 애니메이션 시작 버튼 객체를 생성한다.

(1) 버튼 객체 생성을 위해 Symbol Library - (svglink)에서 “button” 검색 후 객체를 드래그해서 적용시킨다..

​

(2) 도구모음 – 텍스트 객체 생성 후 속성에서 “START”로 텍스트를 변경한 뒤 버튼과 겹치게 배치한다.

(3) 버튼 이미지 객체와 텍스트 객체를 함께 선택하고 마우스 오른쪽 클릭 후 그룹화한다.

(4) 그룹화한 객체를 더블클릭 후 Click – Tag Value 체크선택 후 아래와 같이 설정한다.

​

2) Symbol Library - (svglink)에서 “logistics” 검색 후 객체를 드래그해서 아래와 같이 적용시킨다.

3) 비전 검사 효과를 위해 도구모음의 타원 객체를 생성한 뒤 면 색상 변경을 한다

(1) 도구모음에서 Ellipse(타원) 객체를 생성한다.

​

(2) 타원 객체 선택 후 Properties에서 FillColor(면 색상)와 FillOpacity(면 불투명도)를 설정한다.

4) View – Animation Editor 클릭을 통해 우측의 애니메이션 편집 창을 활성화한다.

5) Animation Editor - Conditions에서 [ + ]를 눌러 애니메이션 조건을 아래와 같이 추가한다.

· Animation.digital_1 태그의 값이 true가 되었을 때 애니메이션 조건이 만족되어 실행한다.

6) 애니메이션 효과를 부여할 Box 객체를 선택한 뒤 Effects에서 Translation(이동 효과)을 추가한다.

7) Translation 설정 창에서 아래와 같이 설정한다.

· Effects에서 이동 효과를 설정한다. X축으로 235만큼 움직인다는 설정이다.

· Timing에서 실행 시간과 관련된 설정을 한다. Effects의 설정을 2.5초동안 실행하겠다는 설정이다.

8) 비전 효과를 위한 Ellipse 객체 선택 후 Effects에서 Blink(출몰 효과)를 추가한다.

· 이전의 애니메이션 실행 후 1초의 Delay를 가진 뒤 0.4초의 속도로 10번 깜박인다는 설정이다.

9) 다시 Box 객체를 선택하고 Translation(이동 효과)를 추가 뒤 아래와 같이 설정한다.

· Effects에서 이동 효과를 설정한다. X축으로 235만큼 움직인다는 설정이다.

· Effects의 설정을 2.5초동안 실행하겠다는 설정이다.

10) Box 객체를 선택한 상태에서 Visible(출몰 효과)을 추가한 뒤 아래와 같이 설정한다.

· Effects – Visible을 false로 설정하면 사라지는 효과를 줄 수 있다.

· 이전 애니메이션 종료 후 1초 뒤에 실행한다는 설정이다.

11) Truck 객체 선택 후 Translation(이동 효과)을 추가하고 아래와 같이 설정한다.

· 왼쪽으로 400만큼 이동한다는 설정이다. X축에 ( - )값 입력 시 왼쪽으로, Y축에 ( - )값 입력 시 위쪽으로 이동한다.
· 전 애니메이션 종료 후 1초 뒤에 -400만큼의 거리를 3초동안 이동하겠다는 설정이다.

​

4. 실행하기

1) 저장 후 시작 버튼 또는 F5를 눌러 뷰어를 실행한다.

· START 버튼을 눌러 애니메이션이 이상없이 실행하는지 확인한다.

· 설정한 애니메이션의 순서와 설정대로 동작하는지 확인한다.

​