프로그래머 관점의 GUI
PGUI 요소들
- device independent graphics
- a windowing system
- event-driven programming
- using mouse, keyboard, and other input devices
- widgets, controls, UI components
- design patterns and model-view-controller
동일한 함수와 메소드들로 다양한(screen, printer 등등) 출력장치에서 그래픽결과물을 만들어내는 것을 말한다.
- DIG를 위한 공통인터페이스의 구현체
Java의 Graphics(java.awt.graphics)
Window의 DC(device context)
.NET의 Graphics
- DIG 인터페이스의 구성요소
그래픽표현을 위한 모델 (pixel model, stroke model, region model)
좌표시스템(논리적좌표와 물리적좌표를 맵핑해주는 역할을 한다.)
기타오브젝트(colors, brushes, pens, fonts 등등)
Windowing System
동일한 스크린에서 윈도우를 통해 인터렉티브한 응용프로그램이 동시에 동작할 수 있도록 해준다.
- Window의 종류
root window (각 스크린은 하나의 root window를 가진다.)
top level windows (응용프로그램은 하나이상의 top level windows를 가질 수 있다.)
child windows (top level windows는 자식 windows를 포함한다.)
- UI 는 보통 windows내에서 UI Components의 계층구조로 이루어진다.
- windowing system은 윈도우 내부내용을 관리하기 위한 기반(infrastructure)를 구현하고 있다. 내부내용이 다시 그려질 필요가 있을 경우 update 이벤트가 window에 보내지고 응용프로그램이 실제 내용을 그리도록 한다.
Event-driven programming
입력장치, 윈도우 시스템, GUI 응용프로그램 자체가 이벤트를 발생시킨다.
사용자 인터렉션에 의해 이벤트가 발생하며 응용프로그램은 이벤트처리과정에 의해 사용자의 액션에 반응한다.
- 이벤트처리과정
1. 이벤트 큐에 큐잉됨(queued)
2. 적절한 다른 이벤트로 번역됨 (translated)
3. 타겟윈도우로 전달됨 (dispatched)
Input devices
대상 환경은 입력이벤트의 세트를 갖는 입력장치들의 장치독립핸들링을 제공한다.
- 마우스 이벤트들은 항상 마우스 좌표를 윈도우에 전달한다. 드래깅같은 특별한 이벤트는 특정 윈도우에 capture될수 있다.
- 키보드 이벤트들은 윈도우에 입력포커스를 전달한다. 입력포커스는 마우스클릭이나 '탭'등으로 바뀔 수 있다.
Widget, controls, components
GUI에서 위젯, 컨트롤, 컴포넌트 는 동일한 의미로 사용된다.
위젯은 정보를 보여주거나 사용자액션에 응답하는 스크린의 (일반적으로) 사각 영역이다.
- 위젯은 자식 윈도우로 구현된다. 위젯을 구현하는 다른 방법은 부모 창의 일부 영역을 확보하여 만들어진다. 자바Swing의 경우 후자를 사용한다.
- 그래픽 환경은 미리정의된 위젯들을 포함한다.(예.standard Windows Controls)
- 위젯은 component나 container가 될 수 있다. container는 다른 컴포넌트를 포함할 수 있는 컴포넌트로 계층 UI 구조를 구현하는데 사용될 수 있다.
- 위젯의 종류 (panels, labels, buttons, text fields, lists, ...)
Designing patterns with MVC
디자인 패턴은 간단하거나 복잡한 GUI 컴포넌트, 그리고 완전한 응용프로그램을 구현하는데 사용된다.
- 가장 유용한 디자인패턴들
Observer (이벤트 핸들러, model-view notification 을 구현하는데 사용)
Composite (계층구조의 컴포넌트들을 구현한거나 그래픽 정보(drawings)의 계층구조를 관리하는데 사용)
Strategy (input handling같이 변경가능한 컴포넌트 특성을 만드는데 사용)
Decorator (GUI 컴포넌트에 scrolling 같은 추가 기능을 덧붙이는데 사용)
- MVC(Model-View-Controller) 구조
데이터(model, component)와 데이터의 표현(views)을 분리하기 위해 다양한 디자인패턴에서 사용된다. 컨트롤러는 사용자입력을 처리하는 역할을 함.
출처 : 핀란드의 Tempere라는 대학의 전산과 강의 노트
