본문으로 건너뛰기

WrapList (랩리스트) Widget Control

WrapList(랩리스트) 위젯을 스크립트에서 제어할 때 사용하는 Widget Control(Property · Method · Event) 목록입니다. 위젯 소개와 사용법은 WrapList 문서를 참고하세요.

정보

아래 예시의 wraplistID는 캔버스에서 WrapList 위젯에 지정한 이름(ID)입니다.
스크립트에서는 위젯ID.멤버 형태로 접근합니다.

Widget Control 요약

Widget Control종류시그니처설명
addMethodadd()number빈 아이템을 끝에 추가
clearMethodclear() → 없음모든 아이템 제거
countPropertycount (get/set, number)반복 아이템 개수를 읽거나 설정
currentPropertycurrent (get/set, number)바인딩 스코프가 되는 현재 아이템 인덱스
insertMethodinsert(index) → 없음지정 위치에 빈 아이템 삽입
lineCountPropertylineCount (get, number)현재 배치된 줄(run) 수
onLineCountChangedEventonLineCountChanged = (lineCount) => { ... }배치된 줄 수가 바뀔 때 실행
onOverflowChangedEventonOverflowChanged = (count) => { ... }잘린 아이템 수가 바뀔 때 실행
onSelectedEventonSelected = (index) => { ... }아이템을 탭했을 때 실행
overflowCountPropertyoverflowCount (get, number)maxLines 초과로 잘린 아이템 수
removeMethodremove(index) → 없음지정 인덱스 아이템 제거
selectPropertyselect (get/set, number)선택된 아이템 인덱스
setStateMethodsetState(index, function) → 없음지정 아이템만 갱신 후 다시 그림

Widget Control 상세

add

빈 아이템을 목록 끝에 추가하고 다시 그립니다.

  • 종류: Method
  • Parameters: 없음
  • Returns: number - 새로 추가된 아이템의 인덱스

Example

const i = wraplistID.add();

clear

모든 아이템을 제거하고 다시 그립니다.

  • 종류: Method
  • Parameters: 없음
  • Returns: 없음

Example

wraplistID.clear();

count

반복 렌더링하는 아이템 개수입니다. 읽으면 현재 개수를 반환하고, 값을 설정하면 바인딩된 데이터 목록을 그 개수에 맞게 늘리거나 줄인 뒤 다시 그립니다.

  • 종류: Property (get/set)
  • 타입: number

Example

const n = wraplistID.count;
wraplistID.count = 5;

current

바인딩 스코프가 되는 현재 아이템 인덱스입니다. 설정하면 이후의 속성 쓰기가 해당 아이템 행을 대상으로 합니다. 지정된 값이 없으면 -1을 반환합니다.

  • 종류: Property (get/set)
  • 타입: number (없을 때 -1)

Example

wraplistID.current = 2;
const cur = wraplistID.current;

insert

지정한 인덱스 위치에 빈 아이템을 삽입하고 다시 그립니다.

  • 종류: Method
  • Parameters: index (number) - 삽입할 위치
  • Returns: 없음

Example

wraplistID.insert(0);

lineCount

현재 배치된 줄(run) 수입니다. maxLines가 설정된 경우에만 갱신됩니다. 읽기 전용입니다.

  • 종류: Property (get)
  • 타입: number

Example

const lines = wraplistID.lineCount;

onLineCountChanged

배치된 줄 수가 바뀔 때 실행됩니다.

  • 종류: Event
  • 핸들러: (lineCount) => { ... } - lineCount는 새로 배치된 줄 수
  • Returns: 없음

Example

// 전제: wraplistID에 maxLines가 설정돼 있어야 발화됨
wraplistID.onLineCountChanged = (lineCount) => {
// 현재 몇 줄로 배치됐는지에 따라 UI 조정
moreButton.visible = (lineCount >= wraplistID.maxLines);
};

onOverflowChanged

잘린(초과한) 아이템 수가 바뀔 때 실행됩니다.

  • 종류: Event
  • 핸들러: (count) => { ... } - count는 새로 잘린 아이템 수
  • Returns: 없음

Example

wraplistID.onOverflowChanged = (count) => { /* ... */ };

onSelected

사용자가 아이템을 탭했을 때 실행됩니다.

  • 종류: Event
  • 핸들러: (index) => { ... } - index는 탭한 아이템의 인덱스
  • Returns: 없음

Example

wraplistID.onSelected = (index) => { /* ... */ };

overflowCount

maxLines를 초과해 잘린(숨겨진) 아이템 수입니다. 잘린 것이 없거나 maxLines가 설정되지 않았으면 0을 반환합니다. 읽기 전용입니다.

  • 종류: Property (get)
  • 타입: number

Example

const hidden = wraplistID.overflowCount;

remove

지정한 인덱스의 아이템을 제거하고 다시 그립니다. 인덱스가 범위를 벗어나면 아무 동작도 하지 않습니다.

  • 종류: Method
  • Parameters: index (number) - 제거할 아이템의 인덱스
  • Returns: 없음

Example

wraplistID.remove(0);

select

선택된 아이템 인덱스입니다. 선택된 것이 없으면 -1을 반환합니다.

  • 종류: Property (get/set)
  • 타입: number (선택 없을 때 -1)

Example

wraplistID.select = 0;
const sel = wraplistID.select;

setState

바인딩 스코프를 지정한 인덱스의 아이템으로 설정한 채 콜백을 실행한 뒤, 해당 아이템만 다시 그립니다. 한 아이템의 바인딩 속성을 갱신할 때 사용합니다.

  • 종류: Method
  • Parameters: index (number) - 갱신할 아이템의 인덱스 / function (콜백 함수) - 해당 인덱스가 활성 아이템인 동안 실행됨
  • Returns: 없음

Example

wraplistID.setState(0, () => {
$item.title = "변경된 제목"; // 0번 item에 바인딩된 속성 갱신
$item.selected = true;
});

공통 Widget Control (모든 위젯)

노트

모든 위젯은 setProperty / getProperty / setStyleProperty 같은 이름 기반 공통 Widget Control(Method)을 사용할 수 있습니다. 공통 레퍼런스 문서(작성 예정)를 참고하세요.