본문으로 건너뛰기

TabBar (탭바) Widget Control

정보

예제 파일: 07_Work_with_Widgets/tabbar_buttontabbar_objet.lfp

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

정보

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

Widget Control 요약​

Widget Control종류시그니처설명
setTabsMethodsetTabs(tabs): void전체 탭을 목록으로 교체
addMethodadd(tab): void끝에 탭 하나 추가
changeTabMethodchangeTab(index, tab): void특정 위치의 탭 교체
getTextMethodgetText(index): string해당 탭의 라벨 텍스트 반환
indexPropertynumber (읽기/쓰기)현재 선택된 탭 인덱스
onChangedEventonChanged = (index) => { ... }선택 탭이 바뀔 때 실행

Property​

index​

현재 선택된 탭의 인덱스(0부터 시작)입니다. 값을 쓰면 해당 탭으로 전환됩니다.

  • 타입: number
  • 접근: 읽기 / 쓰기

Example

// 2번째 탭으로 전환
tabbarID.index = 1;

// 현재 탭 읽기
const current = tabbarID.index;

Method​

add​

탭 하나를 목록 끝에 추가합니다.

  • Parameters
    • tab: 탭 정의(라벨 텍스트)
  • Returns: 없음 (void)

Example

tabbarID.add("Settings");

setTabs​

전체 탭을 주어진 목록으로 교체합니다. 빈 목록이면 무시됩니다.

  • Parameters
    • tabs: 탭 목록
  • Returns: 없음 (void)

Example

tabbarID.setTabs(["Home", "Chart", "Settings"]);

changeTab​

지정한 위치(index)의 탭을 교체합니다. 범위를 벗어난 index는 무시됩니다.

  • Parameters
    • index (number): 교체할 탭 위치
    • tab: 새 탭 정의(라벨 텍스트)
  • Returns: 없음 (void)

Example

//1번째 인덱스의 탭을 'Chart'로 교체
tabbarID.changeTab(1, "Chart");

getText​

지정한 index 탭의 라벨 텍스트를 반환합니다. 범위를 벗어나면 빈 문자열('')을 반환합니다.

  • Parameters
    • index (number): 읽을 탭 위치
  • Returns: string - 탭의 라벨 텍스트(범위 밖이면 '')

Example

const label = tabbarID.getText(0);

Event​

onChanged​

선택된 탭이 바뀔 때 실행됩니다.

  • 종류: Event
  • 핸들러 인자
    • index (number): 새로 선택된 탭의 인덱스
  • Returns: 없음

Example

tabbarID.onChanged = (index) => {
  // index: 새로 선택된 탭 인덱스
};

공통 Widget Control (모든 위젯)​

노트

모든 위젯은 setProperty(name, value) / getProperty(name) / setStyleProperty(styleName, styleProperty, value) 같은 공통 Widget Control(Method)도 사용할 수 있습니다. 자세한 규칙은 공통 Widget Control 레퍼런스를 참고하세요.