Windows 8 アプリの Windows 8.1 アプリへの移行

Article
09/30/2013

Windows 8.1 が 10 月 18 日 (金) に公開されるということで、今回の記事では Widows 8 用に作成した Windows ストアアプリを Windows 8.1 用にマイグレーションする方法と、大きな仕様の変更について紹介します。

Windows 8 と Windows 8.1

Windows 8 は 2013 年 10 月現在、全世界でのライセンス数が 10 億を超えており、ストアには 10 万以上以上のアプリがあります。

また NETMARKETSHARE のデータによれば、Windows 8 がインストールされたコンピューターの数は、Mac OS のすべてのバージョンを足した数を超えています。

Windows 8.1 はこの市場を完全に引き継ぎ、さらに拡大すべく、インテル機、Windows RT を含めたすべての Windows 8 ユーザーに無償で配布されます。

つまり、これまである全ての Windows 8が遠からず Windows 8.1 にアップデートされると考えていただいていいでしょう。

Windows 8.1 はその配信形態から従来の SP に当たるのではないか、などと言われていますが、SP と呼ぶには非常に多くの機能強化、追加がされています。

以下の図は Windows 8 の API ですが、黒字のタイルが API が更新された箇所、空色のタイルは新しく追加された機能、白い太枠はデスクトップアプリケーションでも使える機能です。

(Windows 8.1 で追加/変更された API)

今回は変更追加された API からマイグレーションに関係するものについて紹介していきます。

Windows 8.1 用ストアアプリ開発に必要なもの

Windows 8.1 用ストアアプリを開発するには、Windows 8.1 と Visual Studio 2013 が必要です。

Visual Studio 2013 作成できるプロジェクトは Windows 8.1 用のみで、Windows 8 用のストアアプリを新規に作成することはできません。

ただし、Express 以外の有償エディションの Visual Studio 2013 では、すでに作成してある Windows 8 用ストアアプリを編集、メンテナンスすることができます。

Windows 8.1 上で Windows 8 用ストアアプリを新規に開発するには Windows 8.1 上に Visual Studio 2012 をインストールして使用します。

Visual Studio 2012 と Visual Studio 2013 は同じ環境にインストールして使用することができます。

Windows 8.1 リリース以降の Windows ストア上のストアアプリ

Windows 8.1 リリース以降の Windows ストア上のストアアプリでは、Windows 8 用、Windows 8.1 用のパッケージが提出できるようになっており、パッケージはそれぞれ対象となる OS のバージョンごとにインストールされます。

なお、Windows 8.1 用ストアアプリは Windows 8 上で使用できませんが、Windows 8 用ストアアプリは、Windows 8.1 上でも正常に動作します。ただし、Windows 8 用のストアアプリは、前述したような新しいプラットフォームの機能やパフォーマンス向上の恩恵にあずかることはできません。

Windows 8.1 用アプリへのアップグレード順序

既存の Windows 8 用ストアアプリを Windows 8.1 用ストアアプリにアップグレードするには以下の順序で行います。

(Windows 8.1 用アプリへのアップグレード順序)

まず、Visual Studio 2013 を使用して、Windows 8 用ストアアプリプロジェクトを、Windows 8.1 用ストアアプリプロジェクトに再ターゲットし、アップグレード変換作業を行います。

Visual Studio 2013 を使用して Windows 8 用アプリを Windows 8.1 アプリにアップグレードする具体的な方法は次の通りです。

Windows 8 用アプリから Windows 8.1 用アプリへ変換

Visual Studio 2013 を使用すると、Windows 8 用ストアアプリのプロジェクトを Windows 8.1 用に変換 (再ターゲット) することができます。

プロジェクトの再ターゲットを行うには、変換の対象となるプロジェクトを Visual Studio 2013 で開いた状態で、メニュー [プロジェクト] – [ ソリューションのアップグレード] をクリックするか

(メニュー [プロジェクト] – [ ソリューションのアップグレード])

プロジェクトエクスプローラー内の、プロジェクト名でマウスの右ボタンをクリックし、表示されたコンテキストメニューより [Windows 8.1 に再ターゲット] を選択します。

(右クリック時のコンテキストメニュー )

なおプロジェクトを再ターゲットする際には必ずバックアップを取得してから行ってください。

Windows 8.1 用アプリにアップグレードする利点

既存の Windows 8 用ストアアプリを Windows 8.1 用にアップグレードするだけで以下のような利点があります。

ListView を使用したアプリの起動が 5 – 30% 速く
リストのパンが 2 倍早く
XAML 使用時のメモリが 10 – 20% 減少
WinJS ListView での編集が 15 – 35% 速く

なおプロジェクトを再ターゲットする際には必ずバックアップを取得してから行ってください。

Windows 8.1 での変更点に対応

Visual Studio 2013 によるアプリプロジェクトのアップグレードが完了したら、ビルドして動作テストを行ってください。

不具合が出ないかを確認し、とくに Windows 8.1 で仕様が変更/廃止されたスナップビュー、廃止された検索コントラクトを使用している場合は必ず動作を確認してください。

以下に Windows 8.1 で変更になった機能を示します。

ウィンドウ化モードの採用とスナップビューの廃止

Windows 8 の新しい UI 環境では、アプリの画面を幅 320px で横端に配置して最大 2 の画面を表示するスナップビュー機能がありました。

Windows 8.1 ではこのスナップビューは廃止され、新しくウィンドウ化モードがサポートされました。

ウィンドウ化モードは、スナップビューと同じく、新しい UI 画面に複数のアプリの画面を表示するための機能ですが、スナップビューとは異なり、横幅 500px で、最大 3 つのアプリの画面を表示することができます。

アプリの画面がウィンドウ化された (全画面表示ではなくなった) 際の初期画面の幅は、全画面幅の半分ですが、他のアプリとの境界側のウィンドウの端をドラッグすることにより幅のリサイズが可能であり、縮小方向にリサイズした際の最小幅は既定で 500px、設定を変更することで 320px になります。

この最小幅のサイズは、マニフェストファイルの設定画面で行います。

(マニフェストファイルの画面最少幅設定画面)

スナップビューの廃止により、スナップビュー関連の API、CSS も変更されています。

たとえば、Windows 8 用のアプリでは、スナップビューの状態を以下のように ApplicationViewState 列挙体を使用していましたが、

function onSizeChanged() {
    // ビューステートの取得
   var currentViewState = ApplicationView.value;
if (currentViewState === ApplicationViewState.snapped) {
    // Snaped layout
    }

Windows 8.1 用アプリではスナップビューは存在せず、置き換えられるように採用されたウィンドウ化モードの画面幅は、全画面 (全幅)以外で画面半分の幅、500px もしくは 300px の幅、と複数存在するため画面の状態は純粋に以下のように画面の幅を取得して判断します。

function onSizeChanged() {
// ウィンドウサイズの取得
var windowWidth = document.documentElement.offsetWidth;

そのほかの画面の状態、ランドスケープ (全幅)/ポートレート (縦表示) を調べるには、廃止された ApplicationViewState 列挙体の代わりに ApplicationView クラスのプロパティを参照して判断します。

ApplicationView クラスは、Windows ストアアプリの画面の状態にアクセスするためのクラスです。

細かい変更点なのですが、ApplicationView クラスのプロパティへの参照も変更されており、従来のように静的ではなく、getForCurrentView メソッドで取得したインスタンスに対して行います。

具体的には以下のように記述します。

function onSizeChanged() {
    // ウィンドウの方向を取得
var winOrientation = ApplicationView.getForCurrentView().orientation;

    if (winOrientation === ApplicationViewOrientation.landscape) {
        // Landscape layouts

    } else if (winOrientation === ApplicationViewOrientation.portrait) {
       // Portrait layouts
    }

ApplicationView クラスの変更に伴い、廃止された API は以下の通りです。

ApplicationView.Value プロパティ
ApplicationView クラスの静的メソッド
ApplicationValue.TryUnsnap メソッド

その他、表示関連では、物理表示に関するさまざまなプロパティを提供する DisplayProperties クラスも廃止されています。

新しいウィンドウ化モードの採用により、 追加された ApplicationView クラスの API は以下のとおりです。

GetForCurrentView メソッド
AdjacentToLeftDisplayEdge プロパティ
AdjacentToRightDisplayEdge プロパティ
IsFullScreen プロパティ
Orientation プロパティ

そのほか、廃止された DisplayProperties クラスに代わり DisplayInformation クラスが追加されています。

画面レイアウトの CSS の変更

アプリの画面レイアウト関連の仕様の変更に関係しアプリの画面レイアウトを指定する CSS も変更されています。

Windows 8 用のストアアプリでは、以下のように Media Queries に画面の状態のステータスを表す組込みの名前付き値が用意されていました。

@media (-ms-view-state: fullscreen-landscape) {
    /* CSS styles for full screen landscape */
}
@media (-ms-view-state: fullscreen-portrait) {
    /* CSS styles for full screen portrait */
}
@media (-ms-view-state: filled) {
    /* CSS styles for filled*/
}
@media (-ms-view-state: snapped) {
   /* CSS styles for snapped */
}
(Windows 8 の場合)

Windows 8.1 用のストアアプリでは、組込みの名前付き値は使用せず、以下のように長さを指定します。

@media (min-width: 500px) and (max-width: 1023px) {
/* CSS styles to change layout based on window width */
}
@media (min-width: 1024px) {
/* CSS styles to change layout based on window width */
}
(Windows 8.1 の場合)

新しいタイルサイズ

Windows 8 .1 では使用できるタイルのサイズが増えており、Windows 8 よりも、より大きい(ラージ)タイルと、より小さい(スモール)タイルが指定できるようになっています。

Windows 8.1 で指定可能なタイルの形状とサイズ (ピクセル) は以下の通りです。

スモールタイルはスタート画面の場所を占有しないラウンチアイコンとして、ラージタイルはより多くの情報を表示するアプリのもう一つの画面として利用することができます。

この変更に合わせ、タイルテンプレートの名前も以下のように変更になりました。

使用可能なタイルの数が増えたことにより、より多くの使い分けができるようになりました。

ぜひご活用ください。

アプリ内検索の変更

Windows 8 では、アプリの検索機能を検索チャームに統合することが推奨されていましたが、Windows 8.1 ではこの仕様が変更されました。

Windows 8.1 の検索チャームでは検索の対象をローカルリソースを含めて Web 検索へと拡張され、Windows 8 のように検索対象を検索コントラクトに対応したアプリに切り替えることはできなくなりました。

ただし、アプリが起動した状態であれば、検索チャームの [すべての場所] から検索対象となるアプリを指定することができます。

Windows 8.1 ではアプリ内検索が推奨されており、アプリ内検索で使用するためのサーチボックスコントロールが提供されています。

まとめ

今回は Windows 8 用の作成された Windows ストアアプリを Windows 8.1 用のアプリにマイグレーションする手順と方法を紹介しました。

なお、マイグレーションについての詳しい方法と手順、変更された API の一覧などは、以下のマイグレーションガイドに記載されていますので、ぜひご覧ください。

Optimizing your migrated Windows 8 apps: building better experiences with Windows 8.1
https://go.microsoft.com/fwlink/?LinkID=304117

Clicky