전체 강좌 목록:
http://semicolon1.kr/appinventor.html

이번에는 슬라이더 컴포넌트에 대해서 알아보도록 하겠습니다.
0. 개요
슬라이더 컴포넌트는 가로로 기다란 막대기 위에 썸(섬네일)이 붙어있어 좌우로 조절이 가능한 컴포넌트 입니다.
최댓값이 설정되어있으면 사용자가 움직인 정도를 최댓값에 대해서 나타낼 수 있습니다.
흔히 휴대폰 볼륨 조절시에 쓰이죠.
만약 최댓값이 100인 상태에서 썸을 중앙까지 이동시키면 현재값(섬네일 위치)은 50이 되고,
정중앙이더라도 최댓값이 200이면 섬네일 위치는 100이 됩니다.
1. 형태

디자이너에 두었을 때 모습은 위와 같습니다.
보이기 속성 같은게 아닌 이상 속성을 건드려도 미리보기 상태에서는 변화가 없습니다.
1. 속성
이름(Name) 속성 | |
속성명 | 설명 |
왼쪽 색상(ColorLeft) | 썸의 왼쪽에 위치한 부분의 색상을 지정합니다. |
오른쪽 색상(ColorRight) | 썸의 오른쪽에 위치한 부분의 색상을 지정합니다. |
너비(Width) | 슬라이더의 너비를 지정합니다. |
최댓값(MaxValue) | 슬라이더의 최댓값을 지정합니다. |
최솟값(MinValue) | 슬라이더의 최솟값을 지정합니다. |
섬네일 활성화(ThumEnabled) | 기본값은 참입니다. 거짓이면 썸네일이 없어지고, 사용자가 임의로 움직여서 값을 변경할 수 없습니다. |
섬네일 위치(ThumPosition) | 썸네일의 기본 위치를 지정합니다. 위치가 최댓값, 최솟값 범위를 벗어나면 벗어난 값에 따라 둘 중 하나로 지정됩니다. ex) 최댓값이 10인데 섬네일 위치가20이면 실제로는 10이됨 최솟값이 0인데 섬네일 위치가 -10이면 실제로는 0이됨 |
보이기(Visible) | 보이기를 지정합니다. |
2. 블록
슬라이더(Slider) 속성 지정 블록 | ||
블록 | 입력형식 | 설명 |
색상 | 썸의 왼쪽에 위치한 부분의 색상을 지정합니다. | |
색상 | 썸의 오른쪽에 위치한 부분의 색상을 지정합니다. | |
숫자 | 컴포넌트의 높이를 현재 스크린의 높이에 대한 비율(%)로 지정합니다. | |
숫자 | 최댓값을 지정합니다. | |
숫자 | 최솟값을 지정합니다. | |
논리 | 기본값은 참입니다. 거짓이면 썸네일이 없어지고, 사용자가 임의로 움직여서 값을 변경할 수 없습니다. | |
숫자 | 썸의 기본 위치를 지정합니다. | |
숫자 | 너비를 픽셀(px) 단위로 지정합니다. | |
숫자 | 컴포넌트의 너비를 현재 스크린의 너비에 대한 비율(%)로 지정합니다. | |
논리 | 컴포넌트의 보이기 여부를 지정합니다. |
3. 예제
슬라이더의 기능과 속성을 테스트 해볼 수 있는 간단한 예제입니다.
댓글