TabBar (탭바) Widget Control

備考

サンプルファイル: 07_Work_with_Widgets/tabbar_buttontabbar_objet.lfp

TabBarウィジェットをスクリプトから制御するときに使用するWidget Control（Property・Method・Event）の一覧です。ウィジェットの紹介と使い方はTabBarドキュメントを参照してください。

備考

以下の例のtabbarIDは、キャンバスでTabBarウィジェットに指定した名前（ID）です。スクリプトではwidgetID.memberの形式でアクセスします。

Widget Control一覧

Widget Control	種類	シグネチャ	説明
setTabs	Method	setTabs(tabs): void	タブ全体をリストで置き換える
add	Method	add(tab): void	末尾にタブを1つ追加する
changeTab	Method	changeTab(index, tab): void	特定の位置のタブを置き換える
getText	Method	getText(index): string	該当タブのラベルテキストを返す
index	Property	number（読み取り/書き込み）	現在選択されているタブのインデックス
onChanged	Event	onChanged = (index) => { ... }	選択タブが変わったときに実行する

Property

index

現在選択されているタブのインデックス（0から開始）です。値を書き込むと、そのタブに切り替わります。

• 型: number
• アクセス: 読み取り / 書き込み

Example

// 2番目のタブに切り替え
tabbarID.index = 1;

// 現在のタブを読み取る
const current = tabbarID.index;

Method

add

タブを1つリストの末尾に追加します。

• 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リファレンスを参照してください。