情報
要求されたトピックは次のとおりです。しかし、このトピックはこのライブラリには含まれていません。

Windows Phone のテーマ リソース

2014/06/18

対象: Windows Phone 8 および Windows Phone Silverlight 8.1 | Windows Phone OS 7.1

Windows Phone は、テーマ リソースにリソース ディクショナリを使用します。リソース ディクショナリは、オブジェクトのキーを持つディクショナリで、XAML とコードの両方で使用できます。このセクションでは、Windows Phone リソース ディクショナリで使用可能なテーマ固有のプロパティについて説明します。アプリケーションは、XAML コードを使用して、ここで公開されているプロパティにアクセスし、それらをコントロールにバインドできます。これらのリソースは、実行時にアプリケーションに追加されます。

メモメモ:

テーマ リソースに割り当てられる特定の値は、エンド ユーザーがデバイスに選択したアクセント カラーと背景色によって異なる場合があります。これらの値を指定する場所と、別のテーマを選択した場合に何が起こるかについては、「Windows Phone のテーマ」を参照してください。

次の表に、Windows Phone で使用可能なテーマのプロパティの一覧とその定義を示します。これらは、デザイナーでコントロール プロパティを使用するか、XAML で {StaticResource} マークアップ拡張機能を使用して適用できます。後者は、定義済みのリソースへの参照を評価することによって、任意の XAML プロパティ属性の値を指定します。これらのリソースをコントロールにバインドする方法については、「Windows Phone のテーマ リソースを適用する方法」を参照してください。

このトピックでは、次のテーマのプロパティについて説明します。

  1. ブラシ リソース

  2. 色リソース

  3. フォント名

  4. 太さ

  5. フォント サイズ

  6. テキスト スタイル

  7. テーマの可視性と不透明度

ブラシ リソース

次の表に、適用可能な各種ブラシの一覧とその説明を示します。

名前

説明

PhoneAccentBrush

SolidColorBrush

関心のある項目を選別する前景色

PhoneForegroundBrush

SolidColorBrush

既定の前景色と境界線の色

PhoneBackgroundBrush

SolidColorBrush

ページおよびその他のコントロールの既定の背景色

PhoneContrastBackgroundBrush

SolidColorBrush

対照的な要素の背景色

PhoneContrastForegroundBrush

SolidColorBrush

対照的な要素の前景色

PhoneDisabledBrush

SolidColorBrush

無効化された前景および色

PhoneSubtleBrush

SolidColorBrush

薄い前景と境界線

TransparentBrush

SolidColorBrush

背景およびタッチ ターゲットに使用される 100% 透明なブラシ

PhoneSemitransparentBrush

SolidColorBrush

イメージの背景にコントラストを付けるために使用される部分的に透明な背景ブラシ

PhoneChromeBrush

SolidColorBrush

アプリケーション バーの色に合わせるために使用されます

 

TextBox ブラシ

名前

説明

PhoneTextBoxBrush

SolidColorBrush

TextBox コントロール用のブラシ

PhoneTextCaretBrush

SolidColorBrush

TextBox 内のキャレット用のブラシ

PhoneTextBoxForegroundBrush

SolidColorBrush

TextBox コントロールの前景用のブラシ

PhoneTextBoxEditBackgroundBrush

SolidColorBrush

TextBox コントロール編集背景用のブラシ

PhoneTextBoxEditBorderBrush

SolidColorBrush

TextBox コントロール編集境界用のブラシ

PhoneTextBoxReadOnlyBrush

SolidColorBrush

TextBox コントロール読み取り専用状態用のブラシ

PhoneTextBoxSelectionForegroundBrush

SolidColorBrush

TextBox コントロール選択前景用のブラシ

 

RadioButton および CheckBox のブラシ

名前

説明

PhoneRadioCheckBoxBrush

SolidColorBrush

RadioButton と CheckBox 用のブラシ

PhoneRadioCheckBoxDisabledBrush

SolidColorBrush

無効にされた RadioButton と CheckBox の状態に使用するブラシ

PhoneRadioCheckBoxCheckBrush

SolidColorBrush

CheckBox チェック用のブラシ

PhoneRadioCheckBoxCheckDisabledBrush

SolidColorBrush

無効にされた CheckBox チェック用のブラシ

PhoneRadioCheckBoxPressedBrush

SolidColorBrush

RadioButton と CheckBox の押された状態に使用するブラシ

PhoneRadioCheckBoxPressedBorderBrush

SolidColorBrush

RadioButton と CheckBox の押された状態に使用するブラシ

色リソース

次の表に、ブラシ リソースによって適用可能なさまざまな色の一覧とその説明を示します。

メモメモ:

直接色を使用したり、変更したりするのではなく、ブラシ リソースを使用するようにしてください。それは、アプリケーションで色ではなくブラシの値を変更できるからです。

名前

説明

PhoneBackgroundColor

Color

ページおよびその他のコントロールの既定の背景色

PhoneForegroundColor

Color

既定の前景色と境界線の色

PhoneDisabledColor

Color

無効化された前景および色

PhoneSubtleColor

Color

薄い前景と境界線

PhoneAccentColor

Color

関心のある項目を選別する前景色

PhoneContrastBackgroundColor

Color

対照的な要素の背景色

PhoneContrastForegroundColor

Color

対照的な要素の前景色

PhoneChromeColor

Color

ステータス バーとアプリケーション バーの色

PhoneSemitransparentColor

Color

イメージの背景にコントラストを付けるために使用される部分的に透明な色

 

TextBox の色

名前

説明

PhoneTextBoxColor

Color

TextBox コントロールの色

PhoneTextCaretColor

Color

TextBox 内のキャレットの色

PhoneTextBoxForegroundColor

Color

TextBox コントロールの前景の色

PhoneTextBoxEditBackgroundColor

Color

TextBox コントロール編集背景の色

PhoneTextBoxEditBorderColor

Color

TextBox コントロール編集境界の色

PhoneTextBoxReadOnlyColor

Color

TextBox コントロール読み取り専用状態の色

PhoneTextBoxSelectionForegroundColor

Color

TextBox コントロール選択の前景の色

 

RadioButton および CheckBox の色

名前

説明

PhoneRadioCheckBoxColor

Color

RadioButton と CheckBox の色

PhoneRadioCheckBoxDisabledColor

Color

無効にされた RadioButton と CheckBox の状態に使用する色

PhoneRadioCheckBoxCheckColor

Color

CheckBox チェックの色

PhoneRadioCheckBoxCheckDisabledColor

Color

無効にされた CheckBox チェックの色

PhoneRadioCheckBoxPressedColor

Color

RadioButton と CheckBox の押された状態に使用する色

PhoneRadioCheckBoxPressedBorderColor

Color

RadioButton と CheckBox の押された状態に使用する色

フォント名

次の表に、適用可能な各種フォント名の一覧とその説明を示します。属性 = FontFamily

名前

PhoneFontFamilyNormal

Font Family

Segoe WP

PhoneFontFamilyLight

Font Family

Segoe WP Light

PhoneFontFamilySemiLight

Font Family

Segoe WP Semilight

PhoneFontFamilySemiBold

Font Family

Segoe WP Semibold

太さ

次の表に、UI 要素に適用可能な太さの一覧とその説明を示します。属性 = BorderThickness、Margin、Padding

名前

PhoneHorizontalMargin

BorderThickness、Margin、Padding

12、0

PhoneVerticalMargin

BorderThickness、Margin、Padding

0、12

PhoneMargin

BorderThickness、Margin、Padding

12

PhoneTouchTargetOverhang

BorderThickness、Margin、Padding

12

PhoneTouchTargetLargeOverhang

BorderThickness、Margin、Padding

12、20

PhoneTextBoxInnerMargin

BorderThickness、Margin、Padding

1,2

PhonePasswordBoxInnerMargin

BorderThickness、Margin、Padding

3,2

PhoneBorderThickness

BorderThickness、Margin、Padding

3

PhoneStrokeThickness

BorderThickness、Margin、Padding

3

フォント サイズ

次の表に、適用可能な各種フォント サイズの一覧とその説明を示します。属性 = FontSize

名前

説明

PhoneFontSizeSmall

Double

18.667

PhoneFontSizeNormal

Double

20

PhoneFontSizeMedium

Double

22.667

PhoneFontSizeMediumLarge

Double

25.333

PhoneFontSizeLarge

Double

32

PhoneFontSizeExtraLarge

Double

42.667

PhoneFontSizeExtraExtraLarge

Double

72

PhoneFontSizeHuge

Double

186.667

テキスト スタイル

次の表に、TextBlock コントロールに適用可能なテキスト スタイルの選択肢を示します。属性 = Style.

ヒントヒント:

Blend for Visual Studio を使用すると、テキスト スタイルをプレビューしてから、それをオブジェクトに適用できます。詳細については、「Blend for Visual Studio 2012」を参照してください。

名前

対象:

説明

PhoneTextBlockBase

TextBlock

Style

FontFamily: PhoneFontFamilyNormal

FontSize: PhoneFontSizeNormal

Foreground: PhoneForegroundBrush

Margin: PhoneHorizontalMargin

PhoneTextNormalStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

PhoneTextSubtleStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

Foreground: PhoneSubtleBrush

PhoneTextTitle1Style

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiLight

FontSize: PhoneFontSizeExtraExtraLarge

PhoneTextTitle2Style

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily:PhoneFontFamilySemiLight

FontSize: PhoneFontSizeLarge

PhoneTextTitle3Style

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiLight

FontSize: PhoneFontSizeMedium

PhoneTextSmallStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontSize: PhoneFontSizeSmall

Foreground: PhoneSubtleBrush

PhoneTextLargeStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiLight

FontSize: PhoneFontSizeLarge

PhoneTextExtraLargeStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiLight

FontSize: PhoneFontSizeExtraLarge

PhoneTextGroupHeaderStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiLight

FontSize: PhoneFontSizeLarge

Foreground: PhoneSubtleBrush

PhoneTextContrastStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiBold

Foreground: PhoneContrastForegroundBrush

PhoneTextAccentStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilySemiBold

Foreground: PhoneAccentBrush

PhoneTextHugeStyle

TextBlock

Style

BasedOn: PhoneTextBlockBase

FontFamily: PhoneFontFamilyLight

FontSize: PhoneFontSizeHuge

テーマの可視性と不透明度

黒と白のテーマ背景の表示と不透明度を調整するために使用できるリソースもあります:

Visibility

名前

説明

PhoneDarkThemeVisibility

Visibility

黒のテーマでは表示され、白のテーマでは折りたたまれます

PhoneLightThemeVisibility

Visibility

白のテーマでは表示され、黒のテーマでは折りたたまれます

 

不透明度

名前

説明

PhoneDarkThemeOpacity

Double

濃いテーマでは 1、薄いテーマでは 0

PhoneLightThemeOpacity

Double

黒のテーマでは 0、白のテーマでは 1

表示: