メニュー ウィジェットはページを整理して、ユーザーがアプリ内のあるページから別のページに移動するのに役立つように設計されています。 メニューの方向を変更したり、タブやピルなどのスタイルを選択したり、背景やアクティブなメニューの色を選択したりすることができます。
例
このウィジェットを使用して、次のようなアプリの設計要件をサポートします。
- 複数のページがあるアプリを作成して、シンプルで直観的な方法でページ間を移動する機能をユーザーに提供します。
使用上の注意
通常、メニューはページの上部のヘッダーや本文に配置されます。 メニュー ウィジェットは、[ページ] パネルに表示されるときに、ページ、リンク、およびフォルダーが自動的に入力されます。 [メニューから非表示] をオンにしない限り、ページ、フォルダー、およびリンクの名前は、整列した順番にメニューに表示されます。 ページまたはフォルダー内にページおよびリンクをネストすると、メニュー ウィジェットにドロップダウン メニューとして表示されます。 フォルダーはページを変更せずに最上部をクリックできるドロップダウン メニューを提供します。 ユーザーはリンクにポインターを合わせたり、クリックしたりすることでメニューを操作します。操作中にページに戻ることもできます。
設定
メニュー ウィジェットには次の設定があります。
- [種類] - メニューの配置と外観を指定します (水平、垂直、またはアイコン)。 アイコン タイプでは、アプリの左側または右側のモード ウィンドウにメニューが垂直に折りたたまれます。
- [サブメニュー展開モード] - サブメニューは展開または折りたたみ可能としてエンド ユーザーに表示できます。 この設定は垂直およびアイコンのメニュー タイプにのみ使用でき、ネストされたページまたはリンクが含まれる場合にのみアプリに表示されます。
- [表示設定] - 次のオプションを使用してメニュー アイテムの表示設定を指定します。
- [スタイル] - メニュー スタイル (デフォルト、下線、ピル) を選択します。 各スタイルの色はアプリのテーマから継承されます。
- [間隔] - メニューに表示されるページ間の間隔 (ピクセル単位) を指定します。
- [整列] - 各メニュー アイテムのテキストの配置を指定します。 たとえば、水平のメニューを作成して [下線] スタイルを選択した場合、ページ名はその線に合わせられます (左端、右端、または中央)。
- [アイコンの表示] - ページ、リンク、またはフォルダーとして識別する各メニュー アイテムのアイコンを表示します。 [ページ] パネルでこれらのデフォルトのアイコンを変更できます。
- [高度な設定] - アプリのテーマをオーバーライドして、メニューの背景、テキスト、アイコン、および枠線の色、サイズ、およびスタイルを指定します。
- [背景] - 背景色をメニューに追加します。
- [状態] - さまざまなテキストと枠線の設定を使用してメニューのステータスを伝える視覚的な表現を提供します。 たとえば、テキストを太字にしたり、フォント サイズを大きくしたり、[選択] 状態に異なる背景色と枠線スタイルを使用したりできます。
- [標準] - ユーザーの操作がないメニューのデフォルトの状態。
- [ホバー] - ユーザーがメニュー内のリンクをポイントしている状態。
- [選択] - メニューでユーザーがアイテムを選択した状態。
ヒント:
このオプションを試すには、ビルダー ツールバーの [ライブ ビュー] をクリックします。