ナビゲーションバー

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間:3分
  • モバイルアプリのナビゲーションバーを使用して、ランチャー画面、画面、設定、および通知にアクセスします。

    図 : 1. ナビゲーションバーコンポーネント階層
    ナビゲーションバーのコンポーネント階層。
    ナビゲーションバーは、次のコンポーネントで構成されています。
    • ナビゲーションバー
    • ナビゲーションバータブ
    • [画面] タブ
    • [ランチャー] タブ
    • 保存済みタブ
    • [通知] タブ
    • 設定タブ
    [その他] タブを含むナビゲーションバータブ

    ナビゲーションバーは、各モバイルアプリの下部に表示されます。ナビゲーションバーにナビゲーションバータブを作成できます。ユーザーは、ナビゲーションバー内のランチャー画面と通常の画面にアクセスできます。

    注:
    各モバイルアプリのナビゲーションバーには、[ 通知] タブと [ 設定] ナビゲーションバータブが事前設定されています。これらのタブの内容の詳細については、「 モバイルアプリ構造」を参照してください。また、ユーザーが保存したレコードを表示するページを表示する保存済みタブもあります。
    ユーザーが [その他] タブをタップした後に表示されるリスト

    ナビゲーションバーに 5 つを超えるタブを追加すると、[ その他]([その他] アイコン) タブが表示されます。[ その他 ] タブをタップして、追加のタブを表示するリストビューを開きます。

    画面タブとランチャー画面タブ

    図 : 2. 画面ナビゲーションタブ
    画面ナビゲーションタブ

    画面タブを使用して、カレンダー、カスタムマップ、リスト、マップ、またはモバイル Web 画面に直接アクセスできるようにします。

    図 : 3. ランチャー画面のナビゲーションタブ
    ランチャー画面のナビゲーションタブ

    ランチャー画面タブを使用して、ユーザーが画面ランチャーの要素にアクセスできるようにします。

    ランチャー画面はダッシュボードです。他の画面や情報へのショートカットを提供します。ショートカットは、アイコン、カード、メディアセクション、またはスコア数で追加できます。

    ナビゲーションバーの一般的なガイドライン

    ナビゲーションバーを構成するときは、次の一般的なガイドラインを考慮してください。
    タブの数
    • ナビゲーションバーには最大 5 つのタブが表示されます。タブが 5 つを超える場合は、[その他] タブと呼ばれるオーバーフロータブ ( [その他] アイコン)が追加されます。
    • ナビゲーションバーを 5 つのタブに制限して、すべてのタブが常に表示されるようにしてください。
    タブタイプ
    • デフォルトでは、ナビゲーションバーには [設定] タブと [通知] タブが含まれています。これらのタブを削除することは可能ですが、ユーザーがアプリの重要な情報や機能にアクセスできなくなる可能性があります。
    • [設定] タブと [通知] タブを削除するのではなく、ナビゲーションバーに表示される順序を変更することを検討してください。
    • [設定]、[通知]、および [保存済み] タブは特定のページに移動するため、各タブに 1 つだけ必要です。複数の画面タブとランチャー画面タブを使用できますが、使用するタブは 5 つ以内にすることをお勧めします。
    指定されたユーザーに特定のタブを表示する
    • ユーザー基準権限を適用して、ユーザーが自分の作業に関連するタブのみを表示できるようにします。詳細については、「モバイルアプリでのユーザー基準の権限」を参照してください。
    • ユーザーが [設定] タブと [ナビゲーション] タブを使用できるはずです。
    タブ名
    • ナビゲーションタブに、コンテキストを示すわかりやすい名前を付けます。ホームやアプリなどの一般的な名前は避けてください。
    • タイトルを目立たせるために大文字を使用します。たとえば、[タスクを開く] などです。
    タブ名の長さ
    • ナビゲーションバーに表示されるときに切り取られないように、タイトルの長さを制限します。
    • 複数の言語をサポートしている場合は、サポートする各言語のタイトルの長さを考慮してください。
    • アプリケーションをテストするときは、ナビゲーションバーに完全に表示されないタイトルに注意してください。
    アイコン構成
    • ナビゲーションバーのアイコンの色は、アプリケーションのテーマによって決まります。
    • 視覚的に一貫性があり、アプリケーションのその部分に表示される機能や情報を最もよく表しているアイコンを選択してください。
    • ユーザーが必要なものをすぐに見つけることができるように、複数のナビゲーションタブで同じアイコンを使用することは避けてください。
    オーダー
    タブの順序は、重要度レベルでリストされている必要があります。この順序は、左から右に記述する言語と右から左に記述する言語によって異なります。