はじめようWindows 8世代のアプリ開発

第3回 Windowsストア アプリで設定チャームと連携

この記事を読むのに必要な時間:およそ 10.5 分

はじめに

前回からだいぶ間が空いてしまいましたが,Windowsストア アプリ開発の2回目です。

今回は,設定チャームから表示できる設定ウィンドウ図1をアプリで使えるようにしてみましょう。設定ウィンドウの実装はアプリの認定(審査)にも関わる重要な機能ですので押さえておきましょう(なぜ重要かは後述します)⁠

図1 SkyDriveの設定ウィンドウ

図1 SkyDriveの設定ウィンドウ

また,前回の内容の発展としてSkyDriveなどにアクセスするためのMicrosoftアカウントのサインイン機能を設定ウィンドウで実装します。

設定ウィンドウと設定ポップアップ

Windowsストア アプリでは,アプリの全般的な設定を,設定チャームからアクセスする設定ウィンドウというWindowsで用意されている共通のUIから行えます。

設定ウィンドウ

図1はSkyDriveの設定ウィンドウです。

ウィンドウ上部にアプリの設定項目が表示されています。Windowsストアからインストールしたアプリは,⁠アクセス許可」「評価とレビュー」が既定で用意されています。それ以外の「オプション」⁠⁠バージョン情報」⁠⁠ヘルプ」の項目はSkyDriveが用意したものです。

ユーザーが設定ウィンドウを開いた時,アプリの設定を表示するようアプリ側でコーディングします。

設定ウィンドウ下部は,PCに関する設定が表示されます。

設定ポップアップ

設定ウィンドウに表示されるアプリの設定項目は,エントリポイントとして使い,アプリ画面の表示切り替えや設定ポップアップを表示して,より詳細な設定画面を表示します。

SkyDriveの「オプション」は,図2のように設定ウィンドウから設定ポップアップが開きます。

図2 SkyDriveのオプションの設定ポップアップ

図2 SkyDriveのオプションの設定ポップアップ

設定ウィンドウや設定ポップアップに,どのような項目を用意すべきかなど詳しくは,アプリ設定のガイドライン (Windows ストア アプリ) (Windows)を参照してみてください。

設定ウィンドウが重要な理由

冒頭で触れた設定ウィンドウがアプリ認定に重要な理由ですが,ほぼすべてのアプリはプライバシーポリシーを用意する必要があります※1)⁠そして,プライバシーポリシーは,アプリの設定からアクセスできるようにする必要があります。

このため,設定ウィンドウでアプリのプライバシーポリシーにアクセスできるようにすることは,アプリ開発でほぼ必須の作業となっています。

ちなみに,プライバシーポリシーを記載したWebページも必要です。アプリ登録時にプライバシーポリシーのURLを指定します。

※1

Webにアクセスするアプリは必須です。アクセスしないアプリでも認定を通過するためには用意したほうが無難です。個人で作成したアプリでも必要ですが,内容は簡素なものでもOKですのでそれほど難しい作業ではありません。いろいろなアプリを参考にしてみるとよいでしょう。

設定ウィンドウにアプリ設定項目の追加

それでは実際にコーディングしていきましょう。

プロジェクトの作成

Visual Studioでプロジェクトを作成します。今回も前回と同じく,C#の一番シンプルな「新しいアプリケーション(XAML)⁠を選択します図3)⁠図は,Visual Studio 2012 Express for Windows 8の画面です。前回のプロジェクトを引き続き使用しても構いません。

図3 プロジェクトの作成

図3 プロジェクトの作成

アプリの設定項目の追加

さっそく,設定ウィンドウにアプリ独自の項目を追加します。

設定ウィンドウのオブジェクトSettingsPaneオブジェクト)CommandsRequestedイベントで項目を追加します。ここでは,ユーザーがアプリの起動した時にその処理を書きます。App.xaml.csのOnLaunchedメソッド内に次のようにコードを追記しましょう。

// using Windows.UI.ApplicationSettings; の追加が必要です

bool EventRegistered;
protected override void OnLaunched(LaunchActivatedEventArgs args)
{
    if (!this.EventRegistered)
    {
        SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested;
        this.EventRegistered = true;
    }

    // (省略)
}

OnCommandsRequestedの内容は次のようになります。ここで実際に項目を設定ウィンドウに追加しています。項目となるSettingsCommandオブジェクトを生成してApplicationCommands配列に追加します。

ここでSettingsCommandオブジェクト生成時に指定している値は,⁠policy⁠というコマンドのID(任意に決めれます)と設定ウィンドウに表示される「プライバシーポリシー」の文字,そして項目を選択したときに呼ばれるハンドラーです。

// using Windows.UI.Popups; の追加が必要です
void OnCommandsRequested(SettingsPane settingsPane, SettingsPaneCommandsRequestedEventArgs eventArgs)
{
    var handler = new UICommandInvokedHandler(OnSettingsCommand);

    var policyCommand = new SettingsCommand("policy", "プライバシーポリシー", handler);
    eventArgs.Request.ApplicationCommands.Add(policyCommand);
}

続いて,設定項目が選択された時の処理を書きます。次のようにSettingsCommandオブジェクトに指定したIDを使って処理を分岐できます(今はひとつしか項目を追加していませんが)⁠

ここではWebページを表示するようにしています。

void OnSettingsCommand(IUICommand command)
{
    var settingsCommand = (SettingsCommand)command;
    switch (settingsCommand.Id.ToString())
    {
        case "policy":
            ShowPrivacyPolicy();
            break;
    }
}


// プライバシーポリシーの表示
// using Windows.System; の追加が必要です
async void ShowPrivacyPolicy()
{
    Uri uri = new Uri("http://example.jp/privacypolicy");
    await Launcher.LaunchUriAsync(uri);
}

ここまでを実行してみましょう。設定チャームから設定ウィンドウを開くと追加した項目が表示されたでしょうか図4)⁠

図4 設定ウィンドウにプライバシーポリシーの追加

図4 設定ウィンドウにプライバシーポリシーの追加

以上で,Webページを表示するような簡単な設定は作れるようになりました。

著者プロフィール

松江祐輔(まつえゆうすけ)

日本システムウエア株式会社 勤務。現在,ハードウェア設計・検証業務を担当。大学生・大学院生時代はベンチャー企業 有限会社ミレニアムシステムズにプログラマーとして従事。趣味はプログラミング。好きな言語はVisual Basic。Microsoft MVP for Windows Live Platform(Jul 2010 - Jun 2011),Windows Live(Jul 2011 - Jun 2013)。

URL:http://katamari.jp

コメント

コメントの記入