UWPのアイコン表示用のクラス
UWPでは、アイコン表示に便利な以下の4つのXAMLの要素があります。
これはUWPで追加になった要素ではなく、Win8系のストアアプリからあったものです。
ですが、UWPアプリ開発ではあちこちで使いそうなので、WPFからの移行組として、改めてざっと触ってみようと思います。
アイコン系のXAML要素
コントロール名 | 内容 |
---|---|
SymbolIcon | Symbol列挙体を使って、表示内容を指定する。 |
FontIcon | 文字を使ってアイコンの表示内容を指定する。通常はFontFamilyに「Segoe MDL2 Assets」などのアイコン用のフォント指定をして使う |
BitmapIcon | 画像を使ってアイコンの表示内容を指定する |
PathIcon | Pathプロパティにパス描画用のミニ言語で形状を指定する。 |
<StackPanel> <SymbolIcon Symbol="Back"/> <FontIcon FontFamily="Segoe UI Symbol" Glyph=""/> <FontIcon FontFamily="Segoe MDL2 Assets" Glyph=""/> <BitmapIcon UriSource="Assets/StoreLogo.png" Width="24"/> <PathIcon Data="M 0,0L 20,0L 20,20L 0,20Z" HorizontalAlignment="Center" /> </StackPanel>
SymbolIconやFontIconが特に便利です。
あとFontIconを使う場合、Win10のUWPからは「Segoe MDL2 Assets」というフォントが増えています。
(Win8系では、Segoe UI Symbolというフォントを使っていました。)
「Segoe UI Symbl」も使えますが、UWPではこの「Segoe MDL2 Assets」フォントを使う、ってことを覚えておけばよさそう。
使ってみる
通常はこんな風にButtonのコンテンツとしてこの手のアイコン用コントロールを使います。
あとAppBarを作るときなどには欠かせない存在ですね。
<ToggleButton Width="48" HorizontalAlignment="Center" Foreground="{ThemeResource AppBarBackgroundThemeBrush}"> <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" /> </ToggleButton>