DropDown
DropDown(드롭다운) 위젯은 누르면 선택지 목록이 펼쳐지고, 그중 하나를 고르는 선택 위젯입니다. 언어 선택, 카테고리 선택 등에 사용합니다.
정보
예제 파일: 07_Work_with_Widgets/dropdown_objet.lfp
정의 / 역할
DropDown 위젯은 현재 선택값을 보여주는 콤보 영역을 그려주고, 누르면 항목 목록이 나타납니다. 항목을 고르면 onChanged 동작이 실행됩니다. 펼침 방식(콤보 목록/바텀시트), 색·크기를 설정할 수 있습니다.
- 카테고리: Contents
- 기본 펼침 방식: 콤보(
combo) - 기본 너비:
200
기능
| 기능 | 설명 |
|---|---|
| 항목 선택 | 목록에서 한 항목을 선택하면 현재 값이 그 항목의 value로 바뀝니다. |
| 펼침 방식 | comboType으로 콤보 목록(combo) 또는 바텀시트(sheet) 방식을 선택합니다. |
| 선택 변경 감지 | 선택이 바뀌면 onChanged가 실행되며 선택된 값을 전달합니다. |
| 모양 설정 | 너비·높이·모서리·최대 표시 개수와 여러 색상을 조정합니다. |
사용 방법
- 왼쪽 위젯 팔레트에서 Contents 카테고리를 엽니다.
- DropDown 항목을 캔버스로 끌어다 놓습니다.
- 속성 패널에서 선택 항목(
items)과 초기 선택값(value)을 설정합니다. onChanged에 선택이 바뀔 때 실행할 동작을 연결합니다.- 필요하면 펼침 방식(
comboType)·색·크기를 조정합니다.
속성 (Property)
| 속성 | 설명 | 기본값 | 값 / 타입 |
|---|---|---|---|
comboType | 펼침 방식 | combo | combo, sheet |
sheetTitle | 바텀시트 방식일 때 시트 제목 | 빈 문자열 | 문자열 |
items | 선택 항목 목록 (각 항목: 제목·부제·값) | 없음 | 목록 |
value | 초기 선택 값 (항목의 값 중 하나) | 없음 | 문자열 |
width | 콤보 너비 | 200 | 숫자(0 이상) |
comboHeight | 콤보 높이 | 26 | 숫자(0 이상) |
itemHeight | 각 항목의 높이 | 24 | 숫자(0 이상) |
boxRadius | 모서리 둥글기 | 4 | 숫자(0 이상) |
maxShowItem | 한 번에 보이는 최대 항목 수 | 10 | 정수(0 이상) |
comboboxBgColor | 콤보 배경색 | #000000 | 색상 |
comboboxBorderColor | 콤보 테두리 색 | #666666 | 색상 |
titleColor | 선택값 글자색 | #FFFFFF | 색상 |
subtitleColor | 선택값 부제 색 | #A5A5A5 | 색상 |
itemTitleColor | 목록 항목 제목 색 | #A5A5A5 | 색상 |
itemSubtitleColor | 목록 항목 부제 색 | #666666 | 색상 |
unsetTextColor | 미선택(unset) 표시 색 | #F44336 | 색상 |
arrowColor | 화살표 색 | #FFFFFF | 색상 |
itemBgColor | 목록 배경색 | #333333 | 색상 |
itemBorderColor | 목록 테두리 색 | #666666 | 색상 |
selectedItemColor | 선택된 항목 배경색 | #151515 | 색상 |
itemHoverColor | 항목 호버 색 | #623BEB | 색상 |
enable | 사용 가능 여부 | 켜짐(true) | 참 / 거짓 |
주의 / 팁
팁
항목(items)의 value를 생략하면 title이 값으로 사용됩니다. value에는 항목의 값 중 하나를 지정해 초기 선택을 맞춥니다.
팁
모바일에서 목록을 화면 아래에서 올라오는 시트로 보여주려면 comboType을 sheet로 설정하고 sheetTitle을 지정합니다.
더 알아보기
팁
이 위젯을 스크립트로 제어하는 Widget Control(Property·Method·Event) 전체는 DropDown (드롭다운) Widget Control 문서에서 확인하세요.