このトピックはまだ評価されていません - このトピックを評価する

Windows Phone のアプリ バー

2013/12/05

対象: Windows Phone 8 | Windows Phone OS 7.1

ユーザーがアプリケーションの最も一般的なタスクにすばやくアクセスできるように、アプリケーション バーを作成することができます。Windows Phone アプリケーション バーを使用すると、デバイス上のすべてのアプリケーション間で一貫したユーザー エクスペリエンスを実現するのに役立ちます。

このトピックは、次のセクションで構成されています。

既定のアプリケーション バーは一連のアイコン ボタンと省略記号で、電話の画面の下部に示されます。アイコン ボタンおよびメニュー項目が有効になっている場合、ユーザーは省略記号をクリックして、これらのラベルを表示できます。アプリケーション バーには、メニューが表示または非表示になると表示されるアニメーションが組み込まれています。また、アプリケーション バーは、電話の向きが変わると自動的に調整されます。電話を横向きにすると、アプリケーション バーは画面の端に垂直に表示されます。これにより、ページ コンテンツの残りの領域が最大限に大きくなります。

アプリ バーの縦向きでの高さと横向きでの幅は 72 ピクセルで、変更できません。アプリ バーは表示または非表示に設定することができます。

ミニサイズを使用するアプリケーション バーの例を次の図に示します。

App Bar in mini size

既定のサイズを使用するアプリケーション バーの例を次の図に示します。

App Bar in default size

ユーザーが省略記号をクリックしたアプリケーション バーの例を次の図に示します。この例では、メニュー項目が無効になっています。

App Bar expanded without menu items

メニュー項目

アイコン ボタン以外に、1 つまたは複数のテキスト ベースのメニュー項目を追加できます。このメニュー項目は、ユーザーが省略記号をクリックしたときにアイコン ボタンの下からスライド表示されるリストに表示されます。メニュー項目は、あまり使用頻度が高くないアプリケーション処理や、アイコンだけではわかりづらい処理に使用されます。デバイスの残りの部分と一貫性のあるユーザー エクスペリエンスを実現するために、メニュー項目のテキストは自動的にすべて小文字に変換されます。アプリケーション バー メニューは階層形式ではなく、メニュー項目のリストはアイコン ボタンのサブメニューではありません。

ユーザーが省略記号をクリックしたアプリケーション バーの例を次の図に示します。この例では、メニュー項目が有効になっています。

App Bar expanded with menu items

アプリケーション バーを作成する最も簡単な方法は、XAML を使用することです。Windows Phone SDK に付属するページ テンプレートには、コメント アウトされたサンプル アプリケーション バーの XAML コードが含まれています。XAML のコメントを解除し、アプリケーション バーを作成します。詳細については、「XAML で Windows Phone のアプリ バーを作成する方法」を参照してください。

また、C# または Visual Basic コードのみを使用してアプリケーション バーを作成することもできます。詳細については、「Windows Phone のコードを使用してアプリ バーを作成する方法」を参照してください。

アプリケーション バーは、データ バインドなどのいくつかの一般的なコントロール機能をサポートしていません。つまり、XAML で設定された名前プロパティを使用して、アイコン ボタンおよびメニュー項目を変更することはできません。実行時にテキストまたはアイコンを動的に変更する場合は、C# または Visual Basic を使用してアプリケーション バーを作成する必要があります。詳細については、「Windows Phone のアプリ バーのアイコン ボタンとメニュー項目を動的に変更する方法」を参照してください。

アプリケーションをローカライズする場合は、「Windows Phone のローカライズしたアプリケーションの構築方法」を参照してください。

ここでは、アプリケーション バーの主なプロパティについて説明します。これらのプロパティは、XAML またはコードで設定できます。プロパティは、アプリケーション バーを最初に作成したときに一度設定するか、または動的に変更することができます。さまざまなプロパティ、およびこれらがどのように相互に連携するかをテストするには、アプリケーション バーのサンプルをダウンロードするか、「チュートリアル: Windows Phone のアプリ バー テスト アプリの作成」の手順を完了している必要があります。

プロパティ

備考

Mode

最初にページに表示される際のアプリケーション バーのサイズ (既定またはミニサイズ) を指定します。これは、ユーザーが省略記号を使用してアプリケーション バーを展開して折りたたんだ後の、アプリケーション バーのサイズでもあります。

パノラマ ページなど、画像空間を最大化するページでミニ サイズを使用します。

メモメモ:
横向きをサポートするページで横向きの場合、ユーザビリティを向上するために、モード値にかかわらずアプリケーション バーは既定のサイズで表示されます。

Opacity

想定される値は 0.0 ~ 1.0 です。アプリケーション バーの不透明度は緻密に調整できますが、値 0.0、0.5、および 1.0 のみを使用することをお勧めします。

  • 0.0 アプリケーション バーは完全に透明です。アプリケーション バーはページのコンテンツの上に重なり、透けて見えます。ページのサイズは変更されません。

  • 0.5 アプリケーション バーは部分的に透明です。アプリケーション バーはページのコンテンツの上に重なり、透けて見えます。ページのサイズは変更されません。

  • 1.0 アプリケーション バーは完全に不透明です。アプリケーション バーは、現在のページを覆っています。ページは、アプリケーション バーによって占有されていない画面の領域にサイズ変更されます。

BackgroundColor

アプリケーション バーの背景色。

ForegroundColor

アプリケーション バーの前景色。アイコン ボタン ラベルおよびメニュー項目テキストの色です。透明なアイコン ボタン イメージを使用する場合、これはアイコン ボタンの色にもなります。

IsMenuEnabled

アプリケーション バーを展開したときに、ユーザーに対してメニュー項目が表示されるかどうかを示します。

IsVisible

アプリケーション バーが表示されるかどうかを示します。

アプリケーション バーを使用するためのベスト プラクティスを次に示します。

  • 独自のメニュー システムを作成する代わりに、Windows Phone アプリケーション バーを使用します。

  • 色をカスタマイズする特別な理由がない限り、アプリケーション バーに既定のシステム テーマの色を使用します。アプリケーション バーにカスタムの色を使用した場合、ボタン アイコンの表示品質に影響を与え、メニュー アニメーションに通常とは異なる視覚効果が生じ、いくつかの表示型の電力消費量にも影響を与える可能性があります。

  • テキストが画面内に収まらないため、メニュー項目には長いテキストを使用しないようにします。推奨される最大長は 14 ~ 20 文字です。

  • ユーザーがスクロールする必要が生じるため、アプリケーション バーには 6 個以上のメニュー項目を使用しないようにします。

Windows Phone 早わかり

この情報は役に立ちましたか。
(残り 1500 文字)
フィードバックをいただき、ありがとうございました
表示:
© 2014 Microsoft. All rights reserved.