第2回まどべんよっかいち(2012/4/21)での発表スライドです。

1. Windows Phoneの
開発ツール
Windows Phone勉強会@四日市 第2回
2012/4/21
青木宣明 @kumar0001

2. Agenda
Windows Phone 7のアプリ開発を支援するプラッ
トフォーム4要素の1つに「開発ツールの提供」があ
ります。
 WP7アプリの開発に必要なツールは無償提供
されていて、低コストで開発を始められます。
本セッションでは、開発セッションの前段階として、
Windows Phone 7の開発ツールを紹介します。
 今回はまずツールの概要から
 個別のツールの使い方は、第3回以降に詳しく
取り上げていきます。

3. 目次
1. Windows Phoneの開発ツール
2. 開発ツールを使ってみる
3. 便利なライブラリ・ツール
4. まとめ

4. Windows Phoneの開発ツール
・WPプラットフォームにおけるツールの位置づけ
・Windows Phone SDKと提供ツール

5. Windows Phoneのプラットフォーム
※MSDNから引用

6. プラットフォーム – ランタイム
アプリを構築するフレームワークは2種類
 Silverlight – 一般的なアプリ向け
 XNA – ゲーム向け
Windows Phone固有機能へのアクセス

7. プラットフォーム – クラウドサービス
Windows Phoneの運用を支えるネット
ワークインフラ
 Windows Azure
 プッシュ通知
 位置情報サービス
 広告サービス
 地図情報サービス
など

8. プラットフォーム – ポータルサービス
マーケットプレースでのWP7アプリの公開
に関するサービス
 アプリ登録の申請
 アプリの審査
 アプリの公開
 課金
 アプリ利用状況の取得

9. プラットフォーム – ツール
実運用の環境(ランタイム、クラウド、マー
ケットプレース)だけでなく、開発者向けの
環境も重視している
 ツール＝プラットフォームの1要素
 開発キット(SDK)を無償提供
• 開発に必要なツールが含まれていて、すぐ
にWP7アプリ開発に取りかかれる

10. Windows Phone SDK
ツール・ランタイムを導入するために無償
で配布されている開発キット
最新版は7.1.1
 7.1版ダウンロードサイト
• Webインストーラ版
• ISOイメージ版
 7.1.1更新プログラム

11. Windows Phone SDKの同梱物
 ツール
 Microsoft Visual Studio 2010 Express for Windows
Phone
 Windows Phone Emulator
 SDK
 Windows Phone SDK 7.1 Assemblies
 Silverlight 4 SDK and DRT
 Windows Phone SDK 7.1 Extensions for XNA Game
Studio 4.0
 Microsoft Expression Blend SDK for Windows Phone
7
 Microsoft Expression Blend SDK for Windows Phone
OS 7.1
 WCF Data Services Client for Windows Phone
 Microsoft Advertising SDK for Windows Phone
(※ダウンロードサイトの情報から)

12. Microsoft Visual Studio 2010
Express for Windows Phone

13. Windows Phone エミュレータ
実機なしでアプリの配備・
テスト・デバッグを行う環境
実機の機能をほぼ利用可
能
 画面の回転
 ネットワーク
 GPSなどデバイスアクセス
 メディアアクセス
 キー入力
 言語・テーマ設定

14. エミュレータのカスタマイズ
エミュレータのスキンは変更可能
 Windows Phone 7 Emulator Skin
Switcher
• IS12TやLumia 800など

15. ノートPCとスキン変更
Windows PhoneのPortrait表示
 縦方向の解像度＝800px
ノートPCなど縦方向の解像度が低い環
境では100％表示できない
 コンパクトなスキンにすることで表示可
能に
 ななふぉ “Windows Phone エミュ
レータ用のコンパクトなスキン”
(2011-6-12)

16. コンパクトなスキン

17. 標準スキンとの対比

18. 同梱物一覧に書かれていないツール
ツール名 機能
Expression Blend for Windows
Phone
画面のデザイン、画面を操作したときの
振る舞いの設定を行うデザイナー向け
のツール
Isolated Storage Explorer Tool 分離ストレージにアクセスするコマンドラ
インツール
Marketplace Testkit マーケットプレースの審査基準を満たし
ているか事前に確認する
Windows Phone Developer
Registration
実機を開発者アンロックして、アプリを配
備できるようにする
Windows Phone Connect Tool
(WPConnect)
Zuneを実行せずに実機と接続する。写
真・カメラ・メディアを利用するアプリのデ
バッグで利用する
Application Deployment XAPファイルを端末に配備する

19. Expression Blend for Windows
Phone

20. 開発ツールを使ってみる
・開発工程とツール
・プロジェクトの種類とツールとの対応
・エミュレータ/実機でのデバッグ

21. 開発工程とツール
1. 設計
a. UI/UX設計
2. PG作成
a. ソリューション作成
b. 画面構築・コード記述
3. テスト＆デバッグ
a. 単体テスト
b. エミュレータ/実機テスト
c. プロファイリング
4. 審査要件への合致の確認
a. テストツール
モックツール/Sketch Flow
Visual Studio
/Expression Blend
単体テストツール(非標準)
エミュレータ/WPConnect
プロファイラ
Marketplace Testkit

22. 開発工程とツール
1. 設計
a. UI/UX設計
2. PG作成
a. ソリューション作成
b. 画面構築・コード記述
3. テスト＆デバッグ
a. 単体テスト
b. エミュレータ/実機テスト
c. プロファイリング
4. 審査要件への合致の確認
a. テストツール
モックツール/Sketch Flow
Visual Studio
/Expression Blend
単体テストツール(非標準)
エミュレータ/WPConnect
プロファイラ
Marketplace Testkit

23. UI/UX設計
SketchFlow Template for Windows
Phone
 SketchFlow＝画面構成・遷移を設計す
るツール。Expression Studioの最上位
版で提供されている
 WPではCodePlexで公開されているテン
プレートが追加で必要
Windows PhoneのUI/UX設計で使えるツールは、
改めて取り組む予定。今回は省略します

24. 開発工程とツール
1. 設計
a. UI/UX設計
2. PG作成
a. ソリューション作成
b. 画面構築・コード記述
3. テスト＆デバッグ
a. 単体テスト
b. エミュレータ/実機テスト
c. プロファイリング
4. 審査要件への合致の確認
a. テストツール
モックツール/Sketch Flow
Visual Studio
/Expression Blend
単体テストツール(非標準)
エミュレータ/WPConnect
プロファイラ
Marketplace Testkit

25. プロジェクト作成
Visual Studio 2010で作成できるプロ
ジェクトは2種類
WP7アプリは大きく2種類分けられる
 Silverlightアプリケーション
 XNAアプリケーション
それぞれ異なるフレームワークを使うた
め、プログラムの構造が違う

26. Silverlightアプリケーション
特徴
 イベントドリブンによる処理
 ページ間の遷移による画面構成
 UIコントロールを配置して画面を作成

27. XNAアプリケーション
XNAとは？
 ゲーム制作のフレームワーク
 Windows, Xbox360, WP7向け
• 少ない修正で移植可能
 ゲームエンジンではないので、物理演
算・衝突判定などの処理は提供しない

28. XNAアプリケーション
特徴
 1フレーム(30fps)ごとに呼ばれる
 メッセージループによる処理
• 更新 – 状態の更新処理を行う
入力処理、衝突判定など
• 描画 – 画面の描画処理を行う
 UIコントロールはなく自前で描画
初期化
コンテンツ
読み込み
更新 描画

29. Silverlightアプリ プロジェクト

30. Silverlightアプリ プロジェクト
種類 特徴
Windows Phoneアプリケーション 通常のSilverlightアプリ
Windows Phone
データバインドアプリケーション
ListBoxコントロールにデータをバインドす
る形のアプリ。バインドに必要な
ViewModelが定義されている
パノラマアプリケーション パノラマコントロールを使ったアプリ
ピボットアプリケーション ピボットコントロールを使ったアプリ
Silverlight/XNAアプリケーション SilverlightとXNAを組み合わせたアプリ
種類 特徴
Windows Phoneクラスライブラリ DLL形式のライブラリ
UIを持つアプリケーション型
ライブラリ型

31. Silverlightアプリ プロジェクト
種類 特徴
Windows Phone
オーディオ再生エージェント
オーディオファイルをバックグラウンドで再
生するためのクラスライブラリ
（UIを持つアプリケーションから参照）
Windows Phone
オーディアストリーミングエージェント
オーディオストリーミングをバックグラウン
ドで再生するためのクラスライブラリ
（UIを持つアプリケーションから参照）
Windows Phone
スケジュールされたタスクエージェント
バックグラウンドでタスクを処理する
（UIを持つアプリケーションから参照）
バックグラウンド実行型のエージェント
バックグラウンド処理の方法は、改めて
取り組む予定です

32. XNAアプリ プロジェクト

33. XNAアプリ プロジェクト
種類 特徴
Windows Phoneゲーム Windows Phone向けの通常のゲーム
Windows Phone
Silverlight/XNAアプリケーション
SilverlightとXNAを組み合わせたアプリ
Windows Phoneゲームライブラリ DLL形式のライブラリ
コンテンツパイプライン拡張ライブラリ ゲームのコンテンツを格納するライブラリ
空のコンテンツプロジェクト 空のプロジェクト
Windows Phoneゲーム関連
XNAでのゲームプログラミングは改めて
取り組む予定です

34. Visual Studioでの開発
開発セクションで操作例がたくさん出るの
で省略

35. Expression Blendでの開発
次回以降に詳しく取り上げる予定
 Blendの使い方はデモで実際の操作
を見ると理解しやすいです
今回は省略

36. 開発工程とツール
1. 設計
a. UI/UX設計
2. PG作成
a. ソリューション作成
b. 画面構築・コード記述
3. テスト＆デバッグ
a. 単体テスト
b. エミュレータ/実機テスト
c. プロファイリング
4. 審査要件への合致の確認
a. テストツール
モックツール/Sketch Flow
Visual Studio
/Expression Blend
単体テストツール(非標準)
エミュレータ/WPConnect
プロファイラ
Marketplace Testkit

37. ツール – 単体テスト
単体テストをWP7で実行する環境
 標準では提供されていない
 Jeff Wilcox氏によるMango環境向け
の”Silverlight Unit Test
Framework”を利用する

38. Silverlight UnitTest Framework
手順の概要
1. Windows Phoneアプリケーションとし
てテストプロジェクトを作成
2. アセンブリ2個への参照を追加

39. Silverlight UnitTest Framework
手順の概要
3. MainPage.xaml.csで以下を記述

40. Silverlight UnitTest Framework
手順の概要
4. 普通のクラスのテストクラスを追加

41. Silverlight UnitTest Framework
手順の概要
5. テストプロジェクトを実行する

42. ツール – エミュレータ
回転ボタン
リサイズボタン
ズームボタン
キー 機能
F1 Backボタン
F2 ホームボタン
F3 検索ボタン
F7 カメラボタン
F9 ボリュームアップ
F10 ボリュームダウン
Pause PC⇔ソフトウェアキーの入力切り替え
その他ツールボタン

43. エミュレータのツール
その他のツールを押すと、
ツール画面が開かれる
 加速度計のエミュ
レーション
 位置情報のエミュ
レーション
 スクリーンショットの
撮影
これ以外のセンサー情報
(コンパス、ジャイロスコー
プ)は非対応

44. 加速度計のエミュレーション
・向きの変更
・記録済みデータの再生

45. 位置情報のエミュレーション
・一定間隔ごとに入力位置に移動
・ライブモード（クリックされた地点
に位置情報を更新）
・記録されたデータの再生

46. ツール - 実機でのデバッグ
前提条件
 実機を接続してZuneが起動していること
• 写真・カメラ・メディアを利用する場合は別方法
（該当のリソースにアクセスできないため）
 実機は開発者アンロックされていること
・アンロックする実機を接続する
・Windows Phone Developer
Registrationを起動する
・AppHubに登録したLiveIDとパ
スワードを入力する
・ボタンを押す

47. ツール - 実機でのデバッグ
写真・カメラ・メディアを利用する場合は、
WPConnectコマンドを使う
 C:Program Files (x86)Microsoft SDKsWindows
Phonev7.1ToolsWPConnectx64WPConnect.exe
(64bit環境の場合)
・端末を接続する
・Zuneを終了した状態でコマンドを
起動する
・成功したらVisual Studioなどでデ
バッグを行う

48. 実機への配備
配備方法は2通り
 Visual Studio/Expression Blend
 Application Deploymentツール
・端末を接続された状態にする(Zune も
しくは WPConnect)
・Zuneを終了した状態でコマンドを起動
する
・成功したらVisual Studioなどでデバッ
グを行う

49. パフォーマンス検証
Visual Studioからプロファイラを起動し
て、呼び出し状況・メモリ使用状況を分析
できる
デモ

50. 開発工程とツール
1. 設計
a. UI/UX設計
2. PG作成
a. ソリューション作成
b. 画面構築・コード記述
3. テスト＆デバッグ
a. 単体テスト
b. エミュレータ/実機テスト
c. プロファイリング
4. 審査要件への合致の確認
a. テストツール
モックツール/Sketch Flow
Visual Studio
/Expression Blend
単体テストツール(非標準)
エミュレータ/WPConnect
プロファイラ
Marketplace Testkit

51. マーケットプレース登録申請前
のセルフテスト
審査項目を自己テストできるツール
 申請前に確認しておくことで、審査落ち
を少しでも減らせる
プロジェクトメニューの「Marketplace
TestKitを開く」から起動する

52. Marketplace Testkitの内容
タブ 確認内容
アプリケーションの詳細 申請に必要なアイコン・スクリーンショットが揃ってい
るか確認する
自動テスト XAPファイルのサイズ・内容
アプリケーションの機能(Capability)
アイコン・スクリーンショットの検証
監視付きテスト 起動時間
メモリ消費量
アプリケーションの例外処理
戻るボタンに対する挙動(ポップアップ画面など)
手動テスト 審査要件の各項目を満たしているか
・手動でテスト実施と結果確認を行う

53. Marketplace Testkitの画面

54. 便利なライブラリ・ツール
・Silverlight for Windows Phone Toolkit
・Windows Phone Power Tools

55. WP7向けのライブラリ
Silverlight for Windows Phone
Toolkit
 追加のUIコントロールを提供
 CodePlexで公開されている
• 最新はNovember 2011版
 WrapPanel、DatePickerなど便利な
コントロールがあるので導入しておくと
便利
デモ

56. Windows Phone Power Tools
Windows Phone Power Tools
 http://wptools.codeplex.com/
 XAPのインストール/更新/削除、分離
ストレージへのアクセス、デバイス情報
の取得
 GUIでアクセスできる
（SDK付属のISEToolはCUI)

57. まとめ
Windows Phoneアプリ開発キット(SDK)は
無償提供されていて、低コストでWP7アプリ
開発を始められる。
SDKを導入することで
 ＰＧ作成からテストまでの必要なツールを
揃えることができる。
 SilverlightとXNAの各フレームワークに
対応した開発環境を構築できる。
開発ツールはVisual StudioとExpression
Blendを核としていて、.NET技術者であれば
馴染みやすい環境である。