眠るシーラカンスと水底のプログラマー

　毎度のお約束、本記事はプレビュー状態のOS、IDE、SDKを利用しております。製品版では異なる可能性があります。

　本記事はWindows 10向けのユニバーサルWindowsアプリについて学んだことを残して行く記事です。

　これまでの記事はカテゴリ「UWP(Win 10) Preview」を参照ください。

デバイス毎に画面を作りたい

　「ユニバーサルWindowsアプリ（Pre）入門016:画面に合わせたレイアウトの変更」という記事で、画面幅などをトリガーとして、画面表示を切り替える方法を紹介しました。

　AdaptiveTriggerを利用した方法で、レスポンシブデザインライクなデザインができます。・・・が、VisualStateManagerでデザイン切り替える方式だとデザインビューでプレビューできなかったり（やり方知らないだけの可能性あり）、大幅変更でできないなど目的に適していない場合があります。

　UWPアプリのデザインをする方法にもう一つ、デバイスファミリー毎に利用するXAMLを切り替える方法があります。

　・・・というのを、@biacさんのセッションで知りました。

DeviceFamily-Desktop、DeviceFamily-Mobile

　DeviceFamily-{ファイミリー名}というフォルダの中に利用したXAMLファイルを配置すればデバイスファミリー毎にそれを利用してくれるという仕組み。

　ページ系のXAML以外にもリソース定義なんかも切り替えられます。

　正式版では変更ないし廃止の可能性があるようですが、ぜひ残して欲しい。

UWPで画面を作る方法

　UWPアプリでマルチプラットフォーム向けに画面をデザインする場合は、いくつかの方針が取れそうです。

・ViewBoxなどを用いて、画面幅にあわせてレイアウトはそのままで画面を拡縮する方法。

・AdaptiveTriggerで画面幅などの条件でVisualStateManagerを切り替える方法。

・デバイス毎に個別のXAMLを指定して切り替える方法。

　それぞれ試してみてまたレビューしようと思います。

Tweet