Windows ストアアプリ開発者向けのスタイルリファレンスアプリ「Xaml Candy」

「Xaml Candy」v1.1.4.0

　「Xaml Candy」は、Windows ストアアプリ開発者向けのスタイルリファレンスアプリ。Windows 8/RTに対応するフリーソフトで、“Windows ストア”からダウンロードできる。

　ストアアプリのユーザーインターフェイスは、“XAML”と呼ばれるXMLベースの言語で記述する。XAMLではHTMLと同じように“スタイル”で見栄えが指定可能。ストアアプリのテンプレートには標準でスタイルが豊富に用意されており、それを活用することでほかのアプリケーションと一貫性のある、スタイリッシュなユーザーインターフェイスが簡単に実現できる。

　しかし、ストアアプリの開発に不慣れだと、どのような標準スタイルが用意されているのかよく知らず、すでにあるアイコンを自分で作ってしまったり、自己流のデザインで済ませてしまうといったことも少なくないのではないだろうか。

　そんな場合にお勧めなのが「Xaml Candy」だ。

　「Xaml Candy」では、Windows ストアアプリのテンプレートで用意されているさまざまな標準スタイルを手軽に参照できる。スタイルを選択してXAMLコードをクリップボードへコピーしたり、［検索］チャームでスタイルを検索することもできるので、ぜひインストールしておきたい。

　「Xaml Candy」には、“Styles”“Colors”“Others”の3セクションが用意されている。

　“Styles”セクションでは、アプリバーのボタン、コントロール、ナビゲーションボタン、テキストブロックなどのスタイルが参照できる。とくにアプリバーのボタン一覧は便利。標準のボタンを活用すれば自分でアイコンを用意する必要がないし、ユーザーにとってもお馴染みのボタンなので、アプリの使い方を習得するコストを低く抑えることができる。

“AppBarButtons Styles”

“Buttons Styles”

　“Colors”セクションには、色に関するスタイルがまとめられている。“Default”“HighContrast”“Light”といったテーマによって、選択したキーに対してどのような色が割り当てられるかを参照できる“Theme Brushes”はとくに役立つ。

“Windows.UI.Colors”

“Theme Brushes”

　“Others”は、入力やフォントに関する情報をまとめたセクション。

　“InputScope Name”では、オンスクリーンキーボードのレイアウトをカスタマイズする“InputScope”にさまざまな値を割り当て、実際にどのようなレイアウトになるのかを試すことができる。たとえば、“InputScope”に“EmailSmtpAddress”を指定すれば、メールアドレスの入力に適した“@”や“.jp”といったキーを含んだレイアウトに切り替わる。なお、試してみるときはキーボードを外した状態で試してみよう。

　“Segoe UI Symbol”は、フォント「Segoe UI Symbol」のグリフを一覧表示する。前述したアプリバーのボタンは、実はこの「Segoe UI Symbol」にサークルを組み合わせて実現している。システム標準のアイコンとも言える存在なので、積極的に活用しよう。残りの“Font Family”はシステムにインストールされたフォントを一覧表示したもの、“Font Family Composer”はフォントの表示をテストするためのツールだ。

“InputScope Name”

“Segoe UI Symbol”