マイクロソフト エバンジェリストのブログ

日本マイクロソフトのエバンジェリストが、技術情報を発信するブログです!

様々な画面サイズに合わせてコンテンツを表示する

デザイン系大好きエバンジェリスト 高橋です。

Windows 8、Windows Phone 1つのアプリを提供するときに、さまざまな画面状況に対応しなくてはならないのでいろいろ大変です。コンテンツの内容によってこれは全く変わってくるので、パターンというのは難しいですが、私がよく考える方法です。

結論は、固定コンテンツなら2ペイン、スクロールするようならハブ化を検討するのがよいかと。

メイン+サブコンテンツ

例えば、横画面と縦画面でこういう構成になるのがパターンかと。

image

縦になるとメインの形を残しながらサブ画面の形を変える必要がある。

... 長くなるので続きはこちらで (^^;

様々な画面サイズに合わせてコンテンツを表示する

Windows 8 用ストア アプリのスナップを Windows 8.1 に対応させる

マイクロソフトの田中達彦です。

Windows 8.1 は、複数の Windows ストア アプリを同時に表示させることができます。

Windows 8 にもスナップと呼ばれる機能があり、1366x768 以上の解像度であれば 2 つのアプリを同時に表示できていました。

スナップとして表示されるアプリの幅は 320px に固定されており、それ以外の画面をもう1つのアプリが使用します。

f:id:ms_eva:20131001121142p:plain

 

Windows 8.1 ではスナップを進化させ、解像度によっては最大 4 つのストア アプリを表示できます。

f:id:ms_eva:20131001121127p:plain

 

アプリを複数表示させているときの、アプリの最小の幅のデフォルトは 500px です。

アプリ側の設定によって、Windows 8 のスナップのような 320px に変えることもできます。

 

Windows 8.1 上では、Windows 8.1 用に開発されたストア アプリのみならず、従来の Windows 8 用ストア アプリも動作します。

ただし、Windows 8 用ストアアプリは 320px を超える表示をサポートしていないため、Windows 8 用ストア アプリを Windows 8.1 上で動かし、表示されているアプリの幅を 320px より大きくすると、以下のように左右に黒い部分ができてしまいます。

f:id:ms_eva:20131001121141p:plain

 

この現象を回避するには、Visual Studio 2013 を使用して、Windows 8 用ストア アプリを Windows 8.1 用に「再ターゲット」します。

 

Windows 8.1 のスナップの変更と対応方法については、下記ブログをご参照ください。

田中達彦のブログ : Windows 8.1 対応アプリ開発入門 vol.1 ~ スナップの変更 ~

 

日本マイクロソフト

田中達彦

 

グリッドアプリケーションの解説ドキュメント

月初めから疲れてる高橋です。

さて、エバンジェリストチームの技術の要、荒井さんが自身のBlogで、Windows 8ストアアプリケーションのテンプレートの一つ、グリッドアプリケーションテンプレートの改正つドキュメントを公開されています。

グリッド アプリケーションの解説ドキュメント

グリッドアプリケーションはそれ自身がもう一つの出来上がったアプリケーションのようなもので、構造もかなり複雑というか様々な技術が入ったものになっています。これをBlogでみっちり解説しているのだなぁ、とおもったら... あれ?PDF?

image

そしてPDFを見てみたら総ページ数77ページの大ドキュメントでした!

image

これ一つで小冊子ができるじゃん、と思ってしまった貧乏性高橋ですが、荒井さんの提供には感謝です。私も読んで勉強します。ホント要です、荒井さん。