タブページ

​

機能概要

タブページコンポーネントは、限られたスペースで関連性のある独立したデータビューや分析テーマを整理して表示する 用途に適しています。タブで切り替えてコンテンツを階層化し、情報を構造化しつつページスペースを有効活用できます。 典型的な利用シーン：

• 業務軸での比較：同じ中核指標（売上など）を 異なる軸（製品、地域、期間など）で分析・横比較する。
• マルチビュー表示：同一ダッシュボードで、異なる業務部門 やユーザー役割（経営層、運用部、マーケ部など）に専用のデータビューを提供する。
• コンテンツのナビゲーションと組織化：ダッシュボードアプリやデジタルサイネージで、「総覧」「トレンド」「明細」など複雑なコンテンツモジュールをタブで区分し、ユーザーが必要な情報に素早くアクセスできるようにする。

​

操作手順

​

タブページコンポーネントを追加する

1. AI テーブルのアプリケーションモジュールに入ります。
2. 左側ナビゲーションでコンポーネントを追加するページを選びます。
3. ページ左下の + コンポーネントを追加 をクリックし、タブページ を選択します。

​

基本設定

コンポーネント追加後、右側パネルの 基本設定 で以下を設定します。

• プリセットスタイル
  • タブページの表示スタイルを設定でき、3 種類のプリセットから選択可能です。
• タブ管理
  • タブページを追加： + タブページを追加 をクリックすると新規追加でき、最大 20 個まで増やせます。
  • タブページにコンポーネントを追加： 2 つの方法で実現できます。1 つ目は組み合わせレイアウトと同じ使い方で、コンポーネントを対応するタブページに直接ドラッグ＆ドロップします。2 つ目はタブページでクリックして「コンポーネントを追加」を選び、現在のページのコンポーネントを一括選択してタブページに追加します。
  • タブページを削除： タブページでクリックして 削除 を選ぶと、対応するタブページを削除できます。
  • タブページの名称変更： タブページ名をクリックすると名称を変更できます。タブページ名は空にできません。
  • タブページの位置調整： タブページ左側のハンドルを上下にドラッグすると、複数タブページの順序を調整できます。
• 切り替え操作
  • タブの表示位置を設定でき、3 種類のスタイル（左寄せ、中央、右寄せ）から選択可能です。

​

カスタム設定

右側パネルの カスタム設定 で、コンポーネントの視覚効果やインタラクションをさらに調整できます。

• 背景色： コンポーネントの背景色を設定できます。
• 枠線色： プルダウンのカラーパレットで枠線の色を選択できます。
• 枠線の太さ： プルダウンで枠線の太さを選択できます。
• 選択時の色： カラーパレットでタブが選択された時の表示色を設定します。
• 未選択時の色： カラーパレットでタブが未選択時の既定表示色を設定します。

​

コンポーネント管理

• 操作メニュー コンポーネントを選択し、右上のアイコンをクリックすると操作メニューが展開され、以下を実行できます。
  • 設定：コンポーネントのプロパティ設定パネルをすばやく開きます。
  • コピー：現在のページに同じコンポーネントを複製します。
  • コピー先指定：本アプリ内の他の指定ページにコンポーネントをコピーします。
  • 削除：現在のページからコンポーネントを取り除きます。
• サイズと位置の調整
  • サイズ調整：コンポーネント右下隅にマウスを当て、ハンドルをドラッグすると、幅と高さを自由に調整できます。
  • 位置移動：コンポーネント上部にマウスを移動するとアイコンが表示され、左クリックで押さえながらドラッグするとページ内で位置を調整できます。

​

よくある質問

​

問：タブページの中にさらにタブページや組み合わせレイアウトをネストできますか

答：対応していません。

​

問：最大何個のタブを作成できますか

答：20 個です。