게임/Unity3D

[Unity3D] EZ-GUI

Binceline 2012. 11. 5. 16:46

출처 : http://ncanis.tistory.com/337

------------------------------------------------------------

EZ-GUI


1. 설치
Editor, Plugins 가 설치되는데 디렉토리를 바꾸지 않도록 유의한다.

  UnityEngine 툴에 설치되는것이기때문이다. ( UnityEngine 규칙임)

2. UIManager
- User의 입력을 받고 EZGUI 컨트롤들에 전달하는 매니저
- 모든 Secene에는 반드시 하나의 UIManager가 하나 존재해야 한다.

Perperty
* Pointer Type(mouse, touchpad, ray etc)
 : 어떤 입력장치를 통하는가,  예>AUTO_TOUCHPAD : pc에서는 마우스, 패드에선 터치
* Drag Threshold(Drag 기준값-pixels)
 : 이 값 이상일경우만 드래그로 인식한다.
* Block Input : 컨트롤 입력을 막는다.
* Ray Mask : 어떤 레이어와 충돌체크를 할것인가.
* Action Axis : Fire1  (마우스 왼쪽, 터치 듳듳) 눌림체크 키
* Default Font(컨트롤을 위한 SpriteText)
* Default Font Material

3. Button 추가/ 이벤트 등록하기
- Component > EZ GUI > Controls > Button
- Window/Ui Control Editor  에서 각종 이벤트 텍스쳐를 설정
- State 설정하기(normal, over, active, disabled)
- Material 설정 하기
 빈 머티리얼을 설정한후 Particles/Alpha Blended 를 추가한다.
 버튼 컨트롤에 이 머티리얼을 추가한다.
 해당 머티리얼/설정버튼을 누르면 Build Atlas를 선택하여 Create 한다.
 (위에서 추가된 4개의 이미지를 하나의 머티리얼로 통합 한다.)  
  Force square :  정사각형으로 만들것인가. (아이폰의 경우)

 머티리얼 속성을 GUI로 하거나 Advanced 에서 Mipmap을 꺼야 이미지 리소스 그대로 나올수 있다.

- Play하면 마우스 입력에 따라 버튼 이 바뀐다.
- Button Script(void pressed() ) 를 만들고 이를 Object에 추가한다.
- Button 컴포넌트에서
  Script With method invoke : 이벤트 메소드가 존재하는 스크립트 등록
  method invoke : 호출할 메소드명 등록
  When to Invoke : TAP, Pressed 등 특정 이벤트 종류 설정
                              이 이벤트에 따라 지정한 스크립의 메소드가 호출된다.


*Build Atlas/Trim Image
- 이미지내에 불필요한 Alpha 부분을 Cut 한다.

Property
- Plane : 어떤 축으로 보여줄것인가
- Winding : 카메라 앞쪽/뒤쪽으로 보여줄것인가.
- Bleed Compensation :  끝에 있는 Pixel에 대해 보정
- Pixel Perfect :  실제 이미지 크기만큼 이 컴포넌트 사이즈를 정한다.

----------------------------
4. Control Interactivity
Script 상에서 컨트롤과의 통신
- SetInputDelegate
사용예> 해당 컨트롤에 이벤트 Delegate 를 등록한다.
 void EZInputDelegate(re
f POINTER_INFO ptr)
 control.AddInputDelegate(EZInputDelegate);

- EZValueChangedDelegate
컨트롤에 대한 값이 변경되었을때 호출
사용예> Delegate만큼 사용하는 메소드는 상관없다.
void EZValueChangedDelegate(UIObject obj);
control.AddValueChangedDelegate(MyDelegate);

아래소스는 EZGUI Document/Advanced 에 있다.

void Start()

{

  // Get a reference to our control script:

  IUIObject control = (IUIObject) GetComponent(typeof(IUIObject));

  

  // Tell the control to call our method when it receives input:

  control.AddInputDelegate(MyDelegate);

}

void MyDelegate(ref POINTER_INFO ptr)

{

  // Display a message in the console if

  // the pointer is dragged over the control:

  if(ptr.evt == POINTER_INFO.INPUT_EVENT.DRAG)

     Debug.Log("Dragged!");

}

void MyDelegate(ref POINTER_INFO ptr)

{

  if(ptr.evt == POINTER_INFO.INPUT_EVENT.MOVE)

     ptr.evt = POINTER_INFO.INPUT_EVENT.NO_CHANGE;

}




using UnityEngine;

using System.Collections;


public class Example : MonoBehaviour

{

   // The below references should be populated

   // by dragging the desired controls from

   // scene hierarchy onto these variables in

   // the inspector:


   // Reference to a slider

   public UISlider slider;


   // Reference to a radio button

   public UIRadioBtn radioBtn;


   void Start()

   {

       // Register our delegate with both controls:

       slider.AddValueChangedDelegate(MyDelegate);

       radioBtn.AddValueChangedDelegate(MyDelegate);

   }


   // The delegate itself

   void MyDelegate(IUIObject obj)

   {

       if(obj == slider)

           Debug.Log("The slider's value is: " + slider.Value);

       else if(obj == radioBtn)

           Debug.Log("The radio button's value is: " + radioBtn.Value);

   }

}



5. Toggle 버튼
Control Editor에서 여러개의 State를 추가 할 수 있다.

- StateNum : 현재 선택된 state 값
- StateName : 현재 선택된 state 이름
- SetToggleState : 특정 state로 변경
- ToggleState - 다음 state로 값 변경
- Hide At Start : UI컨트롤이 감춰진 상태로 시작
- Default State : 설정된 State 순서 값

6. Radio 버튼
- 게임 오브젝트에 여러개의 라디오 버튼이 포함
- 그룹 인덱스를 지정하는 방법

- Use Parent For Grouping : 체크되면 상위 게임오브젝트로 그룹핑이 된다.
- Default Value: 시작시 선택 여부 값
- Radio Group : 지정한 그룹을 지정한 라디오 버튼들끼리 그룹핑 된다.

7. ProgressBar
0.0~ 1.0 Rkwl
유저의 Input을 받지 않고 스크립트로 컨트롤 한다.  Value Property 사용

public class ProgressBarController : MonoBehaviour {
public UIProgressBar progressBar;
// Use this for initialization
void Start () {

}

// Update is called once per frame
void Update () {
// if(progressBar.Value<1) {
// this.progressBar.Value +=0.01f;
// }
progressBar.Value = Mathf.Abs(Mathf.Sin(Time.time));
}
}


8. slider
Default Value : 0~1  (슬라이더 위치)
Stop Knob From Edge : 끝으로 부터 knob 위치
Knob Collider Size Factor : Knob의 이벤트 영역 크기 조정 factor 만큼(x만큼)
                                           예> 2  => 영역 2배

9. Scroll List
스크롤 가능한 컨트롤을 ScrollList에 넣고 이를 선택/조절하는 컨트롤 이다.
List Item, List Button, List Item Container등을 이용한다.
List Item : Toggle Button같은것들
List button : Button
List Item Container : 여러 컨트롤들이 등록된 컨테이너들이 아이템으로 추가 가능

Property

Orientation : 종횡 움직임 여부
Direction : Top to Bottom_ Left to Right 등 방향 설정 가능
*ViewableArea : 실제 Scroll List가 보여질 영역 지정, 이 Area 이외는 보이지 않는다.
Item Spacing : 컨트롤 들의 간격
Spacing At Ends : 맨 처음과 끝의 아이템과 이를 둘러싼 프레임간의 간격을 띄울것인지 설정
Activate When Adding : SM을 위해 사용

clip contents : Viewable Area 넘을때 보여줄지 말지 ( 성능이슈)
clip when moving : 움직일때 clip 할것인가. (성능 이슈)

Drag Threshold : Nan ( UIManager의 값을 따른다.)

Scene Items : 오브젝트로 추가 가능
      참고>  => prefab 아이템이 추가된 이후로 scene item 이 추가된다.

Prefab Items : prefab으로 추가 가능

10. 폰트 생성하기
- Sprite 방식의 Font를 사용하여 생성한다.
 Bitmap Font Generator 윈도우용
 material을 생성할때 sprite/vertex colored 를 선택해야 한다.

비트맵 폰트는 Hiero Tool을 사용하도록 한다. ( 윈도우용은 제대로 작동되지 않는다.)

11. Label
Font만을 표시한다.
Property
max Width : Label 와 가로 길이 지정
password, masking

12. TextField
- Single & MultiLine 제공
- Text 프로퍼티로 접근가능
- SetCommitDelegate : Enter or Done 키를 누를경우 호출되는 이벤트

- Offset 카메라와 얼마나 가까운가.
- Caret  size, anchor, offset 설정
* Text 의 위치가 이상한경우는 TextField/Sprite Text 를 조절한다.





13. Transition
EzGUI 컨트롤을 상태에 따라 동적으로 움직일수 있도록 해준다.
* 설정방법
- Control Editor 에러 Transitions을 설정할 수 있다.
Type 종류
Animclip : SM2 에서 제공하는 애니메이션 사용
FadeSprite : 점점 사라지는
FadeMaterial : 색상을 변경
FadeText : 라벨을 Fade
Translate : 움직임
PunchPosition : 현재 위치에서 점프
Crash : 충돌 효과
SmoothCrash
Shake
Scale
PunchScale : 앞뒤오 왔다갔다 하며 Scale
Rotate
PunchRotation: 고무줄 같은 효과
ShakeRotation
CrashRotation
FadeAudio
TuneAudio

Easing : 컨트롤을 움직이는 형태(선형, 원형, 바운스 등등)

*Mode
By: 현재 위치에서 증가
To: 절대값으로 이동( 계속 이벤트를 발생시켜도 이 크기를 넘을 수 없다.
FromTo : 지정하는 값으로 부터 이동 효과

Use Current : 실제 위치값을 현재 상태값으로 설정한다.
Set as Current : 현재 설정된 위치로 실제 위치값을 변경한다.

magnitude : 규모값
oscillation : 진동,진폭값

*duration 을 minus값을 준경우
Rep.Delay : 리플레이 한다.
pingpong : 왔다갔다 한다.

* clone 의미
transition을 복사할경우 (prefab과 비슷하다. 원본이 바뀌면 사본도 바뀌게 된다.)

* copy/paste Transition
A&B Software / Copy,Pate Transition 을 이용하면 특정 컴포넌트의 모든 Transition을 그대로 복사할 수 있다.

14. Panel
여러가지의 EzGUI의 컨트롤을 그룹으로 관리한다.
- Interactive Panel : 유저의 Input을 받는 패널
- Bi-State Interactive Panel : 팝업 State 같은 패널
- Panel : Panel Manager에 관리되는 일반적인 패널

Property
- Index : 0~ 수 : 낮을수록 제일 앞에 보인다.
- Deactivate All On dismiss :  dismiss 상태에서는 모든 컨트롤들이  diable 된다.
- Detarget On disable : disable 상태에서는 유저 인풋 전달 안된다.
- Draggable : 드래그 가능 여부
- Constrain Drag Area : 드래그 영역을 제한한다.


* Interactive Panel
- Panel의 UI 컴포넌트를 등록한후 이 Panel을 담당할 Box colider를 등록한다.
 즉 얇은 box colider 앞에 버튼들이 위치한다.

* Panel Editor를 통해 Transition을 적용가능하다.

15. Panel Manager
- Initial Panel : 디폴트로 선택할 패널 설정
- Deactivate All but Initial At Start : 시작시에 초기 패널을 제외하고 모두 deactivate 한다.
- Linear : 순서대로 이동
- Circular : 끝에 가면 다시 처음으로 이동
- Advanced past end

* Panel
Index: 낮은 인덱스일경우 높은 인덱스보다 우선순위가 높다.
deactivate All on dismiss : dismiss 이벤트가 올경우 모두 deactivate 할것인가.

* Change Panel Button
- Pannel Manger : 매니저 지정
- Change Type :패널 이동 종류 지정
- Panel : 이동할 패널 지정

반응형