Animate GIF 사용

Designer

Animate GIF 사용

Animate GIF 사용

이미지를 삽입하고 애니메이션을 활성화할 수 있다.

1. 이미지 삽입 설명

   1) 이미지 삽입

기본 도구에 이미지를 클릭한 후 작화창에 드래그하면 드래그한 크기의 직사각형 이미지를 삽입할 수 있다.

(png, gif, jpg, jpeg, bmp, svg 확장자 지원)

이미지를 성공적으로 삽입했다면, 아래와 같이 이미지 객체가 생성된다.


  2) 이미지 속성 편집


생성된 이미지 객체를 클릭하고 보기 메뉴-> 속성 편집을 클릭하면 속성 편집 창에 이미지 객체의 속성이 위치하는 것을 볼 수 있다.

아래는 이미지 속성에 대한 설명이다.

● Appearance(모양)

    ■ Opacity(불투명도)

    객체의 불투명도를 설정한다. (1~0, 0에 가까울수록 투명함)

● Binding(바인딩)

    ■ Tag(태그)

    gif 이미지의 애니메이션 동작에 관여하는 디지털 태그를 설정한다.

● General(일반)

    ■ Description(설명)

    객체의 설명을 입력한다.

   ■ Name(이름)

    객체의 이름을 입력한다.

● Image(이미지)

    ■ Animated(애니메이션 상태)

    객체의 애니메이션 동작 여부를 설정한다.

    (바인딩된 태그가 있다면 객체의 애니매이션 상태는 태그가 결정한다.)

    ■ ImageHeight(이미지 너비)

    이미지의 실제 높이를 나타낸다.

    ■ ImageWidth(이미지 높이)

    이미지의 실제 너비를 나타낸다.

● Layout(레이아웃)

    ■ Angle(각도)

    이미지 객체의 각도를 설정한다.

    ■ Height(높이)

    이미지 객체의 높이를 설정한다.

    ■ Width(너비)

    이미지 객체의 너비를 설정한다.

    ■ X(가로 위치)

    이미지 객체의 X 좌표를 설정한다.

    ■ Y(세로 위치)

    이미지 객체의 Y 좌표를 설정한다.

● Security(보안)

    ■ Level(등급)

    이미지 객체의 보안 등급을 설정한다.

2. Gif 애니메이션 샘플 만들어보기

(객체를 생성할 때는 도구를 클릭하고 마우스 커서를 Design 영역으로 옮겼을 때 커서가 십자 표시로 되면 생성할 위치에 클릭한 상태로 드래그하면 된다.)

   

  1) 배경을 설정한다.

    (1) 페이지를 클릭하고 속성 편집을 아래와 같이 설정한다.


   (2) 이미지를 클릭하고 작화 화면 전체를 드래그한다.


   (3) 배경으로 사용하고 싶은 이미지를 선택하고 열기를 누른다.


   (4) 생성한 이미지 객체를 객체 탐색기에서 잠근다.


  2) 심볼 라이브러리에서 gif 이미지를 두 개 가져온다.


  3) 좌측 이미지 객체의 속성 편집 창을 아래와 같이 편집한다.


  4) 디지털 태그를 하나 생성한다.


  5) 우측 이미지 객체의 속성 편집 창을 아래와 같이 편집한다.

(생성한 디지털 태그를 바인딩한다.)

   6) 실행이나 F5를 눌러 뷰어를 연다.


  7) 보기 메뉴를 눌러 태그 상태를 클릭한다.

digital 태그값을 변화시킴으로써 오른쪽 이미지의 애니메이션 동작을 확인할 수 있다.

 


 

0 답글
제목