GUI 위젯

3. 역사

1980년대 프로젝트 아테나가 최초로 GUI 요소를 위젯이라고 부르기 시작했다. 다른 비슷한 용어에는 적절하지 못한 뜻이 포함될 수도 있었기 때문에 이 낱말이 선택되었다. 또 이 프로젝트의 Xt 라이브러리는 X 윈도 시스템 위에서 창과 각 위젯을 연결시켰기 때문에 창과 같은 접두어가 선택되었다고 한다.^[8]

1920년경, "위젯(widget)"은 유용한 장치, 특히 판매를 위해 제조된 제품을 지칭하는 일반적인 용어로 미국 영어에 등장했다. 이는 가제트와 유사한 의미로 사용되었다.

1988년, "위젯"이라는 용어는 아테나 프로젝트와 X 윈도 시스템과 관련하여 사용된 기록이 있다. 조엘 맥코맥과 폴 아센트의 "X 툴킷 개요"에서는 다음과 같이 언급한다:^[2]

> 툴킷은 텍스트 레이블, 스크롤 바, 명령 버튼 및 메뉴와 같은 사용자 인터페이스 구성 요소("위젯")의 라이브러리를 제공하며, 프로그래머가 새로운 위젯을 작성할 수 있도록 하고 위젯을 완전한 사용자 인터페이스로 조립하는 데 필요한 연결을 제공합니다.

같은 해, 랄프 R. 스윅과 테리 와이즈먼의 매뉴얼 "X 툴킷 위젯 - C 언어 X 인터페이스"에서는 다음과 같이 설명한다:^[3]

> X 툴킷에서 위젯은 X 윈도우 또는 하위 윈도우와 관련 입력 및 출력 의미론의 결합입니다.

같은 해 랄프 R. 스윅과 마크 S. 애커먼은 "위젯"이라는 용어의 유래에 대해 다음과 같이 설명했다:^[4]

> 다른 모든 일반적인 용어에는 부적절한 의미가 있었기 때문에 이 용어를 선택했습니다. 회의적인 사람들에게 위젯의 주요 구현은 관련 X 윈도우이고 공통 초기 문자가 쓸모없지 않다는 점을 제시합니다.

4. 다양한 위젯

위젯은 여러 가지 종류가 있지만, 작업 표시줄은 여러 운영 체제에서 쓰이는 공통 위젯에 속하지 않는다.

4. 1. 선택

• 버튼: 특정 동작을 실행하기 위해 클릭하는 컨트롤이다.
• 토글 버튼: 누를 때마다 상태가 바뀌는 버튼이다.
• 체크 상자: 여러 옵션 중 하나 이상을 선택할 수 있는 컨트롤이다. 라디오 버튼과 비슷하지만, 여러 개를 동시에 선택할 수 있다는 차이점이 있다.
• 라디오 버튼: 여러 옵션 중에서 하나의 옵션만을 선택할 수 있는 컨트롤이다.
• 슬라이더: 핸들을 움직여 값을 선택하는 컨트롤이다.
• 목록 상자: 목록에서 하나 이상의 항목을 선택할 수 있는 GUI 요소이다.
• 스핀 단추: 값 범위를 단계별로 처리하는 작은 위, 아래 버튼이 있는 컨트롤이다.
• 드롭다운 목록: 선택할 항목 목록을 보여주는 컨트롤이다. 일반적으로 특정 버튼이나 표시기를 클릭해야 목록이 나타난다.
• 메뉴: 선택 가능한 여러 동작이 있는 컨트롤이다.
• 도구 모음: 화면 버튼, 아이콘, 메뉴 또는 기타 입력 또는 출력 요소가 배치되는 그래픽 컨트롤 요소이다.
• 리본: 탭 인터페이스를 통해 시각적 레이아웃에서 대규모 명령 모음을 표시하는 메뉴와 툴바의 하이브리드이다. 마이크로소프트 오피스 2007에 도입된 인터페이스이다.
• 콤보 상자: 텍스트 상자와 메뉴 또는 목록 상자가 결합된 형태이다. 사용자는 값을 직접 입력하거나 목록에서 선택할 수 있다.
• 아이콘: 소프트웨어 도구, 기능 또는 데이터 파일을 빠르게 이해할 수 있는 기호이다.
• 트리 보기: 정보의 계층적 보기를 표시하는 그래픽 컨트롤 요소이다.
• 격자 보기: 숫자 또는 텍스트를 행과 열에 입력할 수 있는 표 형식 데이터 보기이다. 스프레드시트와 유사하다.

4. 2. 탐색

• 탭 - 여러 문서나 패널을 단일 창 안에 포함할 수 있는 그래픽 제어 요소. 폴더의 탭을 모방한 위젯으로, 화면 상의 동일한 영역에 다양한 내용을 전환하여 표시한다.
• 스크롤 막대 - 연속적인 텍스트, 그림 또는 기타 콘텐츠를 미리 정해진 방향(위, 아래, 왼쪽 또는 오른쪽)으로 스크롤할 수 있는 그래픽 제어 요소. 화면 상의 특정 영역에 그 이상의 큰 정보를 표시하는 데 사용된다.
• 링크 - 클릭하면 다른 화면이나 페이지로 이동한다는 것을 나타내는 일종의 표시(보통 밑줄 및/또는 색상)가 있는 텍스트.

4. 3. 문자 입력

4. 4. 출력

• 레이블 - 다른 위젯을 설명하는 텍스트이다.
• 툴팁 - 마우스가 다른 컨트롤 위로 이동할 때 나타나는 정보 창이다.
• 풍선 도움말 - 툴팁과 유사한 위젯이다.
• 상태 표시줄 - 일반적으로 창 하단에 위치한 정보 영역을 나타내는 그래픽 컨트롤 요소이다.
• 진행 표시줄 - 다운로드, 파일 전송, 설치 등 확장된 컴퓨터 작업의 진행 상황을 시각화하는 그래픽 컨트롤 요소이다.
• 정보 표시줄 - 많은 프로그램에서 사용자에게 중요하지 않은 정보를 표시하는 데 사용되는 그래픽 컨트롤 요소이다. 브라우저에서 툴바 아래에 표시되며, 대화 상자와 유사하지만 사용자 작업을 방해하지 않는다.

4. 5. 컨테이너

• 윈도우 – 프로그램의 GUI 요소 중 일부를 포함하는 시각적 영역으로 구성된 그래픽 제어 요소이다.^[6]
• 접이식 패널 – 위젯의 탭을 클릭하여 숨기거나 표시할 수 있는 내용을 압축하여 저장할 수 있는 패널이다.^[6]
• 아코디언 – 각 항목을 "확장"하여 관련 콘텐츠를 표시할 수 있는 레이블 또는 축소판 그림과 같은 항목의 수직으로 쌓인 목록이다.^[6]
• 모달 윈도우 – 응용 프로그램의 기본 윈도우에 종속된 그래픽 제어 요소로, 기본 윈도우를 사용할 수 없는 모드를 생성한다. 사용자가 어떤 응답을 반환하지 않으면 부모 윈도우에 제어를 반환하지 않는 자식 윈도우이다.^[6]
• 대화 상자 – 사용자에게 정보를 전달하고 응답을 요청하는 작은 윈도우이다. 오류 메시지 등의 정보를 사용자에게 전달하는 윈도우로, 모달 윈도우인 경우가 많다.^[6]
• 팔레트 윈도우 – "유틸리티 윈도우"라고도 하며, 모든 일반 윈도우 위에 떠 있으며 현재 응용 프로그램에 대한 도구, 명령 또는 정보에 대한 즉시 액세스를 제공하는 그래픽 제어 요소이다. 각종 기능을 나타낸 자식 윈도우 (유틸리티 윈도우라고도 함)이다.^[6]
• 검사기 윈도우 – 선택한 객체의 현재 속성 목록을 표시하고 이러한 매개변수를 즉시 변경할 수 있는 대화 윈도우 유형이다.^[6]
• 프레임 – 그래픽 제어 요소 모음을 시각적으로 관계를 표시하는 방식으로 그룹화할 수 있는 상자 유형이다.^[6]
• 캔버스 – 그래픽 정보를 나타내는 일반적인 그리기 요소이다.^[6]
• 커버 플로우 – 문서 스냅샷, 웹사이트 북마크, 앨범 아트 또는 사진을 시각적으로 넘겨보는 애니메이션, 3차원 요소이다.^[6]
• 버블 플로우 – 사용자가 토론 스레드의 전체 트리 보기를 탐색하고 상호 작용할 수 있는 애니메이션, 2차원 요소이다.^[6]
• 캐러셀 (컴퓨팅) – 웹사이트와 모바일 앱 모두에서 사용자가 빠르게 탐색할 수 있도록 시각적 카드를 표시하는 데 사용되는 그래픽 위젯이다.^[6]

참조

_[1] 웹사이트 Microsoft: Graphic elements https://msdn.microso[...] Microsoft 2015-04-27
_[2] 서적 Proceedings of the 1st annual ACM SIGGRAPH symposium on User Interface Software 1988
_[3] 서적 X Toolkit Widgets - C Language X Interface https://archive.org/[...] 1988
_[4] 간행물 The X Toolkit: More Bricks for Building User-Interfaces –or– Widgets for Hire http://www-ftp.lip6.[...] 2022-11-20
_[5] 웹사이트 What is widget? - Definition from WhatIs.com https://whatis.techt[...] 2020-06-03
_[6] 웹사이트 Drawer React component - Material-UI https://material-ui.[...]
_[7] 간행물 The X Toolkit: More Bricks for Building User-Interfaces, or, Widgets for Hire http://www-ftp.lip6.[...] 2007-01-03
_[8] 웹인용 The X Toolkit: More Bricks for Building User-Interfaces, or, Widgets for Hire (USENIX Winter) http://www-ftp.lip6.[...] 2007-01-03