Gauge with actions and effects 따라하기

Samples

Gauge with actions and effects 따라하기

8. Gauge with actions and effect.xix 샘플 따라하기

1. 샘플 열기 및 기본 페이지 구조

 ① ~(X-SCADA 설치 폴더)\Xisom\X-SCADA\Samples\2. Application Samples

디렉토리로 들어간다

 ② 8. Gauge with actions and effect.xix 파일을 X-SCADA Designer로 연다.

 ③ 아래는 본 샘플의 페이지 구조이다.

  ● page_1

2. 동작 예시

 ① 디자이너에서 실행이나 F5 단축키를 눌러 뷰어를 실행한다.

 ② 다음 수평 슬라이드에는 analog_1 태그가 바인딩 되어있다.

 ③ 또한 아래 객체들은 태그값에 따라 색이 변하게 된다.

 ④ 수평 슬라이드를 조절하면 아래 객체 효과 영역에서 객체들의 변화를 볼 수 있다.

 ⑤ 객체 효과는 크게 3가지 타입으로 볼 수 있다.

  ● 회전 효과

  ● 점멸 효과

  ● 이동 및 크기 변화 효과

 ⑥ 아래 객체들은 회전 효과가 적용되어 있다.

위 객체들은 태그값이 변할 때 특정 이미지가 회전함으로써, 사용자로 하여금 태그값을 직관적으로 파악할 수 있게 한다.

 ⑦ 아래 객체들엔 이동 효과 및 크기 변화 효과가 적용되어 있다.

객체에 크기 변화 효과를 적용시키면 객체의 중심을 기준으로 크기가 커진다.

여기에 이동 효과를 부여하면 마치 객체의 바닥을 중심으로 크기가 변하는 것처럼 꾸밀 수 있다.

위 객체들은 크기 변화 효과에 이동 효과를 추가로 부여함으로써, 태그의 값을 사용자가 직관적으로 파악할 수 있게 했다.

 

  ● 아래 객체엔 추가로 점멸 효과가 적용되어 있다.

태그 값이 100에 도달할 경우 효과가 발생한다.


  ● 아래 객체엔 추가로 면 투명도 변화 효과가 적용되어 있다.

태그값에 따라 불투명도가 변화한다.

 
0 Reply Comment
Title