UI 표준 컨트롤 정리

1. 컨트롤의 정의

1 - 1 컨트롤의 정의


컨트롤(Control) 이란 사용자와의 인터페이스를 이루는 도구이다.

인터페이스를 이룬다는 것은 사용자로부터 명령 , 입력을 받아들이고 출력 결과를 보여준다는 뜻이다.

즉 , 컨트롤은 입출력 도구를 뜻한다.


1 - 2 컨트롤의 종류


컨트롤에는 버튼 , 에디트 , 리스트 박스 , 콤보 박스 , 스크롤 바 , 스태틱 등 여섯가지 표준 컨트롤 이 있다.

이러한 표준 컨트롤을 이용해 수많은 컨트롤들은 만들어 낼 수 있다.


1 - 3 컨트롤의 생성


모든 컨트롤을 이루는 클래스들은 Base 클래스를 상속받는다.

Base 내부에서는 생성과 해제 , 렌더 등을 가지고 있으며 메세지 프로시저를 가지고 있다.

모든 컨트롤이 Base를 상속받아 생성과 해제 등을 처리한다.

(즉 모든 컨트롤에 공통으로 필요한 함수와 플래그값을 base가 가지고 있다.)


1 - 4 컨트롤들의 메세지 관리

체크버튼을 예를 들어 , 버튼이 클릭 되었을때 메세지가 생성된다.

이 메세지는 Base의 메세지 프로시저로 들어가 생성된 메세지의 종류에 따라

그에 맞는 컨트롤의 이벤트가 발생된다.


※ Group

제 프레임워크에는 base와 같이 Group 으로 컨트롤들을 관리하게 되는데

Group도 base를 상속받는다.

그룹은 컨트롤들을 배치하는데 사용하는데,

그룹의 Flag값을 설정해두면 , 그 그룹에 속한 컨트롤들은

모두 그 Flag값을 가지게 된다.(투명처리 , 이벤트 처리 , 이동불가 등)


2. 컨트롤의 종류

앞에 말한대로 컨트롤에는 수많은 종류가 있고 , 주변에서 쉽게 볼 수 있다.

글을 쓰고있는 이 웹 페이지 나 게임등에도 수많은 컨트롤들이 있다.



2 - 1 푸쉬 버튼

푸쉬 버튼은 단순히 사용자로부터 명령을 받아들이기 위해 사용된다.

글을 쓰고있는 바로밑에도 "글쓰기" 라는 푸쉬버튼이 있고,

실생활에서는 전화기의 다이얼버튼 등이 푸쉬버튼의 좋은 예 이다.

평소에는 Rel 상태로 있다가,

마우스가 자신의 Rect안에 들어오면 Over상태로 변하게 되고,

Over상태에서 특정 이벤트(대부분 L버튼)가 들어오게 되면

특정 이벤트를 Base로 보내준다.


2 - 2 체크 버튼

푸쉬버튼이 사용자의 명령을 받아들이기 위해 사용된다면

체크버튼은 참 , 거짓을 입력받을 때 주로 사용된다.

기본적으로 푸쉬버튼과 비슷한 구조로 되어있고,

버튼이 눌리면 상태와 이미지를 바꾸어준다.

게임안에서 예를들면 인벤토리나 상태창 버튼 등을 누르게 되면

그에 맞는 UI 가 나오고 , 한번 더 인벤토리창을 누르게 되면 닫히게 되는 구조이다.


2 - 3 탭 버튼 (라디오 버튼)

탭 버튼은 체크버튼과는 다르게

각 그룹당 한개씩만 선택 할 수 있다.

a라는 그룹에 있는 버튼 1 , 2 , 3 이 있다고 했을 때,

1 이 선택되어있을때 2가 선택 될 경우 1은 해제가 된다.


2 - 4 에디트 컨트롤

에디트는 문자열을 직접 입력받을 때 사용된다.

버튼과 마찬가지로 윈도우에서 가장 흔하게 볼 수 있는 컨트롤이다.

가로로 길쭉하게 생겼으며 여기에 문자열이나 정수를 입력 받을 수 있다.

버튼과 다른점은 주로 키보드 입력을 처리받는다.


2 - 5 리스트 박스

선택 가능한 여러 개의 항목들을 나열해 놓고 하나(또는 여러개)를 선택 할 수 있는

컨트롤 이다. 주로 문자열이 위의 '항목'에 들어가며 , 에디트로 입력하는것이 주관적인 성격이라면

리스트박스는 객관적인 선택을 하게 해준다.


2 - 6 콤보 박스

리스트박스와 마찬가지로 항목을 나열해놓고 선택할 수 있는 컨트롤이지만 차이점이 있다.

리스트박스와 달리 여러개의 항목을 선택 할 수 없으며

드롭다운 형식(누르면 밑으로 리스트가 주르륵)으로 표시한다.

콤보박스 = 리스트박스 + 커멘드버튼


2 - 7 스크롤 바

스크롤 바 는 일정 범위 내의 값을 선택 할 때 사용되는 컨트롤이다.

이전과의 컨트롤에 비해 복잡한 구조로 이루어져 있는데

양 끝의 버튼 과 가운데 값을 나타내는 버튼 , 그리고 스크롤을 이루는 이미지 로 이루어져있다.

여기서 값 이란 스크롤의 틱 값으로 이루어 져 있는데 , 스크롤에서는

최소값 , 최대값 , 그리고 단위를 이루는 틱 값이 있다.

0 ~ 100 의 Min , Max 를 이루고 , 틱이 10인 스크롤 바 가 있고, 현재값이 50이라면

오른쪽 버튼을 눌렀을 때 틱값이 10 이 증가하여 값이 60이 된다.

현재값을 나타내는 가운데 버튼을 직접 움직여 줄 수 있다.

1 2 3 4 5 6