アプリの高DPI(High DPI)対応について 第2回 ~ アプリケーションの高DPIへの対応レベル ~

マイクロソフトの田中達彦です。本連載では、今後3年以内に避けて通れないと予測される高DPI(High DPI)への対応について連載します。 [DPI対応アプリケーションの種類]アプリケーションが高DPIに対応しているかどうかは、以下の3つのレベルで示されます。 Not DPI Aware : 高DPIに対応していないアプリケーションSystem DPI Aware : 高DPIに対応しているアプリケーション。ただし、モニターごとのDPIには対応していません。Per monitor DPI Aware : Windows 8.1でサポートされたモニターごとのDPIの設定にも対応しています。 Not DPI Awareアプリは、96DPIのモニターで表示されることを前提にしたアプリです。もしこのアプリを、144DPI相当すなわち150%のDPIスケールのモニターで表示させると、OS側が自動的にアプリを拡大して表示します。この自動的に拡大する機能は、Windows Vista以降でサポートされています。アプリを自動的に拡大する場合は、一旦96DPI相当で描画した後に150%に拡大します。そのため、Not DPI Awareアプリを150%などに設定しているモニターで表示させると、文字などのUI要素がぼやけてしまうことがあります。アプリケーションの設定によっては、自動的に拡大しないようにもできます。この方法は後述します。 System DPI Awareアプリは、システムで設定したDPIのスケールに対応したアプリです。System DPI Awareアプリの場合は、OSによって自動的に拡大/縮小されずに表示されます。ただし、DPIが動的に変わることに対しては対応していません。 Per Monitor DPI-Awareアプリは、DPIのスケールが動的に変わることに対応したアプリです。DPIが動的に変わることは、モニターごとに異なるDPIを設定していて、アプリがモニター間を移動するときに発生します。例えばプライマリモニターが100%、セカンダリモニターが150%に設定されているとき、プライマリモニターに表示しているアプリをセカンダリモニターに移動させると、その途中でDPIのスケールが100%から150%に変わります。モニターごとのDPIに対応していないWindows 8以前のOSでは、DPIスケールが動的に変わることはありません。 [各テクノロジの高DPIへの対応]UIを構築するテクノロジは、それぞれデフォルトで以下のような高DPIの対応レベルになっています。 Windowsフォーム : Not DPI AwareWPF : System DPI AwareMFC : System DPI AwareWindowsストアアプリ : Per Monitor DPI Aware これらは、最新のバージョン(現段階でVisual Studio 2013に搭載されているライブラリ)を使用したときの対応レベルです。例えばVisual…


アプリの高DPI(High DPI)対応について 第1回 ~ 高DPIとは ~

マイクロソフトの田中達彦です。本連載では、今後3年以内に避けて通れないと予測される、アプリの高DPI(High DPI)への対応について連載します。 ====================2014/12/22 追記de:code 2014というカンファレンスにて、高DPIの話をしています。 以下のサイトでセッションの様子を公開していますので、ご参照ください。http://www.microsoftvirtualacademy.com/training-courses/decode-track1「既存デスクトップ アプリの最新 OS への対応」というセッションの、20分40秒くらいから45分くらいまでが高DPIに関する話です。==================== [高DPIとは]Surface Pro 3をはじめ、最近発売されるPCの解像度は高くなっています。Surface Pro 3の場合は、12インチのディスプレイで解像度は2160x1440です。Surface Pro 2でも、10インチのディスプレイで解像度は1920x1080です。解像度がこれだけ高いと画像イメージは鮮明になりますが、文字は拡大しないと小さく表示され、読みにくくなってしまいます。 今までの解像度の場合、96DPIが標準でした。そのため、96DPIを前提として作成されているアプリが数多く存在します。96DPIとは、1インチの中に96ドットが含まれるという意味です。DPIとはDot Per Inchの略です。高解像度ディスプレイで96DPIを想定して作成されたアプリを表示した場合、テキストなどのUI要素は小さく表示されてしまいます。そのため、デフォルトで125%や150%に拡大するという処理をOS側で行っています。ディスプレイの解像度を150%に変更すると、UI要素が1.5倍に拡大されて、文字が読みやすくなります。 以下の図は、Windowsフォームで作成したアプリとWPFで作成したアプリを150%という拡大率に設定したディスプレイ上で表示した例です。 Windowsフォームで作成したアプリ WPFで作成したアプリ Windowsフォームで作成したアプリは、文字の輪郭が少しぼやけています。WPFで作成したアプリは、文字の輪郭がはっきりしています。 実は、テクノロジによって高DPIに対応しているものと対応していないものがあります。WPFは高DPIに対応していますので、拡大率が大きいディスプレイで表示してもきれいに表示できます。Windowsフォームは高DPIには対応せず、一部のコントロールのみ高DPIに対応しています。ただし、Windowsフォームの一部のコントロールを高DPIに対応させるには、最新の.NET Frameworkである4.5.1または4.5.2を使う必要があります。高DPIに対応していないアプリの場合は、DPIの拡大率に応じてOS側が自動的にアプリを拡大して表示させます。そのため、このWindowsフォームのようにUI要素がぼやけてしまうことがあります。 もし手元に高DPIに対応していないWindowsフォームのアプリがある場合は、なるべく早めに高DPIへの対応を進めることをお勧めします。本連載では、その方法を順次説明します。 [DPIの変更方法]DPIを変更するには、画面上の何もない場所を右クリックして、以下のコンテキストメニューを表示させます。ここで画面の解像度を選択します。 そして、下のほうにある[テキストやその他の項目の大きさの変更]を選択します。 以下の例では、100%すなわち96DPIが既定となっているディスプレイで、150%を選択しています。ディスプレイの性能によって、どこまで拡大率を上げられるかが変わります。例えば「大」の次に「特大」や、さらに「超特大」が表示されるディスプレイもあります。「大」が表示されないこともあります。その下の[カスタム サイズ変更オプション]を選択すると、任意の倍率に変更できます。 Windows 8.1以降のOSの場合は、複数のディスプレイを選択しているときに、ディスプレイごとに拡大率を変えることができます。これを英語ではPer Monitor DPIと呼びます。WindowsフォームやWPFで作られたアプリをPer Monitor DPIに対応させるには、専用のコードを追加する必要があります。Windowsストアアプリは、Per Monitor DPIにも対応しています。 [次の記事]第2回 アプリケーションの高DPIへの対応レベル第3回 マニフェストでアプリのDPI対応レベルを変更する マイクロソフト田中達彦

3