Unity - Image

RawImage 컴포넌트와 비슷하지만 주로 작은 이미지에 사용한다.
(여기서 작은 이미지란, 아이콘 또는 버튼 등의 UI요소들을 말한다.)
NGUI로 치면 UISprite와 같다.
Image에 사용되는 이미지는 Sprite 타입이여야 사용할 수 있으며 Atlas에 포함시켜 사용한다.
또한, Canvas 하위에서 사용해야한다.

1. 주요 옵션들
Source Image
- 사용될 이미지를 연결한다. 
(Sprite 타입)
Color
- 색상을 지정한다. 색상은 기본 색상에 지정한 색상이 섞이는 식이다.
(Color를 빨간색으로 지정했다고 해서 노란 이미지가 빨갛게 되는건 아니다.)
Meterial
- 이미지의 재질을 연결한다.
(간단하게 테스트 하려면 메탈 재질의 Meterial을 연결하여 이미지가 메탈 재질이 된 것을 확인할 수 있다.)
RaycastTarget
- 레이캐스팅에 영향을 받을지 체크한다.
(레이캐스팅은 터치, 클릭, 충돌 들의 감지를 하는 보이지 않는 레이저를 말한다.)
Image Type
- 아래의 타입들을 지정할 수 있다.
ㄱ. Simple
이미지 원본 그대로다.
ㄴ. Sliced
- SpriteEditor를 통해 Slice할 영역을 지정하고 이미지의 크기를 확대,축소할 때 Slice 영역에 따라
UI의 크기를 자유자재로 사용할 수 있게 해준다.
- UI 요소를 그릴 때 굉장히 많이 사용된다.
예를들어 문양이 있는 팝업의 프레임(width 600, height 200)을 그린다고 치자. 
일반적인 이미지 한장으로 사용한다면 600x200짜리의 큰 이미지가 사용된다.
그러나 이는 비효율적인 방법이기에 특별한 이미지가 아닌 이상은 이렇게 사용하지 않는다.
좀 더 효율적으로 이미지를 그리기 위해 늘려도 깨지지 않을 문양의 100x100짜리 이미지에
Slice 영역을 잡고 크기를 600x200으로 늘리면 효율적으로 이미지를 그릴 수 있다.
ㄷ. Tiled
- 타일 형식의 이미지를 그리기 위해 사용된다.
예를들어 체크패턴의 이미지가 있는데 그냥 크기를 늘리면 큰 체크무늬가 될 뿐이다.
Tiled Type으로 설정하고 크기를 늘리면 체크 패턴이 커지지 않고 연결되어 그려진다. 
ㄹ. Filled
- 차오르는 연출을 표현할 수 있다.
== Filed의 옵션들 ==
FillMathod
- 채우는 방식을 설정한다.
ㄱ. Radial 360
- 이미지의 중심을 기준으로 360도 회전하며 이미지가 차오르는 것 처럼 한다.
(예를들어 타이머 이미지에서 게이지가 차오르는 것 처럼 또는 쿨타임 이미지 같은 느낌)
ㄴ. Radial 180
- 한쪽 변을 기준으로 180도 회전하면서 이미지가 차오르게 한다.
ㄷ. Radial 90
- 한쪽 변을 기준으로 90도 회전하면서 이미지가 차오르게 한다.
ㄹ. Vertical
- 이미지를 위 또는 아래에서 차오르게 만든다.
ㅁ. Horizontal
- 이미지를 왼쪽 또는 오른쪽에서 차오르게 한다.
Fill Origin
- Top, Bottom, Left, Right 등 채우는 방식을 바꿀 수 있다.
Fill Amount
- 0이면 아무것도 그리지 않고 1에 가까울수록 이미지를 채운다.

2. 기타 옵션들
Use Sprite Mesh
- 사각형 영역으로 그릴 것인지 이미지의 알파 영역을 무시하고
최대한 그림의 형태에 맞게 그릴 것인지 결정한다.
Preserve Aspect
- 원본 비율을 지켜서 그릴 것인지 결정한다.
- NGUI의 UISprite로 보면 width, height의 비율을 맞춰주는 것과 비슷하다.
Fill Center
- Sliced로 잡은 영역의 가운데를 채울 것인지 비울 것인지를 결정한다.
- 체크 해제하면 Sliced 영역 가운데를 그리지 않게 된다.
Pixel Per Unit
- 이미지의 1Pixel을 화면에서 어떤 크기로 그릴 것인지를 결정한다.  
Set Native Size
- 이미지의 원래 사이즈로 맞춰준다.

 

 

다람쥐와 포동포동이

 

 

RememberCook 9월 28일 정식 출시!