PageView (페이지뷰) Widget Control
PageView(페이지뷰) 위젯을 스크립트에서 제어할 때 사용하는 Widget Control(Property · Method · Event) 목록입니다. 위젯 소개와 사용법은 PageView 문서를 참고하세요.
아래 예시의 pageviewID는 캔버스에서 PageView 위젯에 지정한 이름(ID)입니다. 스크립트에서는 위젯ID.멤버 형태로 접근합니다.
Widget Control 요약
| Widget Control | 종류 | 시그니처 | 설명 |
|---|---|---|---|
add | Method | add(): number | 새 아이템을 끝에 추가 |
clear | Method | clear() | 모든 아이템 제거 |
count | Property | count (get/set, number) | 반복 렌더링할 아이템(페이지) 개수 |
current | Property | current (get/set, number) | 바인딩 스코프로 쓰는 현재 아이템 인덱스 |
select | Property | select (get/set, number) | 선택된 아이템 인덱스 |
getCurrentPage | Method | getCurrentPage(): number | 현재 표시 중인 페이지 인덱스 반환 |
goToPage | Method | goToPage(page, duration?) | 지정 인덱스의 페이지로 이동 |
insert | Method | insert(index) | 지정 위치에 아이템 삽입 |
nextPage | Method | nextPage(duration?) | 다음 페이지로 이동 |
onPageChanged | Event | onPageChanged = () => { ... } | 표시 페이지가 바뀔 때 실행 |
onSelected | Event | onSelected = (index) => { ... } | 아이템을 탭했을 때 실행 |
previousPage | Method | previousPage(duration?) | 이전 페이지로 이동 |
remove | Method | remove(index) | 지정 아이템 제거 |
setState | Method | setState(index, callback) | 특정 아이템만 갱신 |
Property
count
반복 렌더링할 아이템(페이지) 개수를 읽거나 설정합니다. 값을 설정하면 바인딩된 데이터 리스트가 해당 개수에 맞게 늘거나 줄고 다시 그려집니다.
- 종류: Property (get/set)
- 타입:
number(정수)
Example
pageviewID.count = 5;
const n = pageviewID.count;
current
바인딩 스코프로 사용할 현재 아이템 인덱스를 읽거나 설정합니다. 설정하면 이후 속성 쓰기가 해당 아이템(행)을 대상으로 적용됩니다.
- 종류: Property (get/set)
- 타입:
number(정수, 설정되지 않았으면-1반환)
Example
pageviewID.current = 2;
select
선택된 아이템 인덱스를 읽거나 설정합니다.
- 종류: Property (get/set)
- 타입:
number(정수, 선택된 것이 없으면-1반환)
Example
pageviewID.select = 1;
Method
getCurrentPage
현재 표시 중인 페이지 인덱스(0부터 시작)를 반환합니다. 뷰가 아직 화면에 붙지 않았으면 설정된 초기 페이지 값을 반환합니다.
- 종류: Method
- Parameters: 없음
- Returns:
number- 현재 페이지 인덱스(0-based)
Example
const page = pageviewID.getCurrentPage();
goToPage
지정한 인덱스의 페이지로 이동합니다.
- 종류: Method
- Parameters:
page(number) - 이동할 페이지 인덱스(0-based)duration(number, 선택, 기본300) - 스크롤 애니메이션 시간(밀리초).0이하이면 애니메이션 없이 즉시 이동합니다.
- Returns: 없음
Example
pageviewID.goToPage(2, 300);
nextPage
다음 페이지로 애니메이션하며 이동합니다.
- 종류: Method
- Parameters:
duration(number, 선택, 기본300) - 스크롤 애니메이션 시간(밀리초) - Returns: 없음
Example
pageviewID.nextPage(300);
previousPage
이전 페이지로 애니메이션하며 이동합니다.
- 종류: Method
- Parameters:
duration(number, 선택, 기본300) - 스크롤 애니메이션 시간(밀리초) - Returns: 없음
Example
pageviewID.previousPage(300);
add
새 빈 아이템을 끝에 추가하고 다시 그립니다.
- 종류: Method
- Parameters: 없음
- Returns:
number- 새로 추가된 아이템의 인덱스
Example
const i = pageviewID.add();
insert
지정한 인덱스에 새 빈 아이템을 삽입하고 다시 그립니다.
- 종류: Method
- Parameters:
index(number) - 삽입할 위치 - Returns: 없음
Example
pageviewID.insert(0);
remove
지정한 인덱스의 아이템을 제거하고 다시 그립니다. 인덱스가 범위를 벗어나면 아무 동작도 하지 않습니다.
- 종류: Method
- Parameters:
index(number) - 제거할 아이템 인덱스 - Returns: 없음
Example
pageviewID.remove(0);
clear
모든 아이템을 제거하고 다시 그립니다.
- 종류: Method
- Parameters: 없음
- Returns: 없음
Example
pageviewID.clear();
setState
지정한 아이템에 바인딩 스코프를 맞춘 상태로 콜백을 실행한 뒤 해당 아이템만 다시 그립니다. 특정 아이템의 바인딩 속성을 갱신할 때 사용합니다.
- 종류: Method
- Parameters:
index(number) - 갱신할 아이템 인덱스callback(function) -index가 활성 아이템인 동안 실행할 콜백
- Returns: 없음
Example
pageviewID.setState(0, () => { /* 0번 아이템의 바인딩 속성 갱신 */ });
Event
onPageChanged
표시 중인 페이지가 바뀔 때(스와이프 또는 스크립트 이동) 실행됩니다.
- 종류: Event
- 핸들러: 인자 없는 콜백 함수
- Returns: 없음
Example
pageviewID.onPageChanged = () => {
// 페이지 전환 시 실행할 코드
};
onSelected
사용자가 아이템을 탭했을 때 실행됩니다.
- 종류: Event
- 핸들러:
index(탭한 아이템 인덱스)를 받는 콜백 함수 - Returns: 없음
Example
pageviewID.onSelected = (index) => {
// 선택된 index 처리
};
공통 Widget Control (모든 위젯)
모든 위젯은 setProperty / getProperty / setStyleProperty 같은 이름 기반 공통 Widget Control(Method)을 사용할 수 있습니다. 공통 레퍼런스 문서(작성 예정)를 참고하세요.