ストアアプリ →universal Windows Apps =WP8.1アプリ

3,174 views

Published on

Windowsストアアプリをuniversal Windows Apps化してWindows Phone 8.1アプリも作成してみました。
その中で得られてノウハウを公開します。

Published in: Education
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,174
On SlideShare
0
From Embeds
0
Number of Embeds
2,819
Actions
Shares
0
Downloads
7
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

ストアアプリ →universal Windows Apps =WP8.1アプリ

  1. 1. ストアアプリ →universal Windows Apps =WP8.1アプリ Windows Phone Arch in Tokyo#3 2014.05.10 初音玲
  2. 2. 自己紹介 ▷お仕事の略歴 • システム企画 • インフラ構築 • 業務アプリ構築 • DB設計、構築、各種支援 ▷お仕事外の略歴 • Microsoft MVP for Developer Tools (2008/04-15/03) • Oracle ACE (2008/04-:日本で2人目) 2
  3. 3. はじめてシリーズ ▷はじめての VC#2012 3
  4. 4. Kinect本 監修 ▷本文 • 日本語訳 ▷サンプル • ローカライズ済 4
  5. 5. 連載中 ▷ • 新型Kinect for Windows v2 Developer Preview プログラミング入門http://www.buildinsider.net/small/kinect2dp/ • Xbox One速報 http://www.buildinsider.net/consumer/xboxonekinect/ ▷Codezine • http://codezine.jp/author/998 5
  6. 6. Windows Phone 8.1 Developer Preview 6
  7. 7. History of Windows Phone Phone History WP 7.0 Silverlight WP 7.5 Silverlight WP 8.0 Silverlight WP 8.1 Silverlight WP 8.1 XAML 7
  8. 8. Windows Phone Runtime Windows Phone RuntimeからWindows Runtimeへ Windows Runtime (約11,000メンバ) サブセット (約2,800) 追加 (約600) 8 Windows Phone 8.0はWindows [Phone] Runtimeだった
  9. 9. 9 PCとPhoneでますます共通化へ Common WinRT APIs Phone-specific WinRT APIs Windows-specific WinRT APIs The Windows Runtime (WinRT) is the shared runtime and API space used by store apps across the Windows platform (phone and client) Dramatic convergence in 8.1 • Goal is 100% convergence for dev scenarios • In 8.0, we had ~30% API convergence • With 8.1, we move well past 90%+ convergence
  10. 10. Windows developer platform | | Windows Phone Only Windows OnlyWindows + Windows Phone BUILD 2014 : 2-509
  11. 11. Windows Phone 8.1のネイティブアプリは3タイプ 11
  12. 12. Which XAML Framework should you use? AppType Framework New App XAML or Silverlight ExistingWindows StoreApp XAML Lock Screen Image (social, weather, sports, ..) Silverlight 8.x Camera BasedApp (lenses integration) orVOIP Silverlight 8.x Music App Silverlight 8.0 or XAML Existing Silverlight Phone Apps Silverlight 8.x or XAML BUILD 2014 : 2-517
  13. 13. Windows 8.1ストアアプリ+ Windows Phone 8.1 ストアアプリ =universal Windows Apps ? 13
  14. 14. universal Windows Apps ▷ Windows Phone アプリ Windows 8.1 ストアアプリ Windows Phone 8.1 ストアアプリ (Windows Runtime) Windows Phone Silverlight 8.xアプリ Windows Phone 7.x アプリ (Silverlight) Windows 8 ストアアプリ ▷Windowsストアアプリ 14
  15. 15. universal Windows Apps ▷WindowsストアとWindows Phoneストアで同じID 15
  16. 16. App backup & roaming Tile metadata and layout is backed up to OneDrive daily App decides what data gets backed up to OneDrive Roaming Local Temp Roaming Local Temp Roaming 100kb 100kb Device A Device B BUILD 2014 : 2-509
  17. 17. VBはuniversal Windows Apps作れないんでしょ? ▷AppIDが同じであれば良いという事は? ▷VBで作成したWindows 8.1ストアアプリとWindows Phone 8.1アプリ ▷同じアプリ名でそれぞれのストアに登録すれば universal Windows Apps ! 17
  18. 18. じゃあ、VS2013 Update 2 RCにあるこれは? 18
  19. 19. ユニバーサルアプリ 19
  20. 20. ユニバーサルアプリテンプレート 20
  21. 21. universal Windows Apps ▷ Windows Phone アプリ Windows 8.1 ストアアプリ Windows Phone 8.1アプリ (Windows Runtime) Windows Phone Silverlight 8.xアプリ Windows Phone 7.x アプリ (Silverlight) Windows 8 ストアアプリ ▷Windowsストアアプリ 21
  22. 22. ソリューション構成 22
  23. 23. 既存Windowsストアアプリに追加 ▷新しいメニュー項目がある 23
  24. 24. 新規プロジェクト追加のときとは異なる結果になる ▷2つの追加プロジェクト • hogehoge.WIndowsPhone • hogehoge.Shared 24
  25. 25. 参考:既存WP8.1プロジェクトだと ▷[Windows 8.1の追加]がある 25
  26. 26. 条件付きコンパイルシンボルを整えよう ▷新規ユニーバサルアプリ ▷既存Widowsストアアプリに追加 26
  27. 27. Windows Phone Storeとの関連付け ▷既存アプリ名一覧 • Windowsストアアプリ 27
  28. 28. Modelsと文字リソースをShared 28
  29. 29. Assetsフォルダの「コンテンツ」をShared 29 BitmapImage(new Uri("ms-appx:///Assets/sakura_pin.png"))
  30. 30. ViewModelsをShared 30
  31. 31. Phone側でNuGetパッケージ追加 31
  32. 32. Phone側でNuGetパッケージ追加 32
  33. 33. Phone側でNuGetパッケージ追加 33
  34. 34. PC側でNuGetパッケージの入れ替え(削除) 34
  35. 35. PC側でNuGetパッケージの入れ替え(追加) 35
  36. 36. 基本ページをWindowsPhone側に追加 36
  37. 37. WindowsPhone側に追加されるコード ▷Windowsストアアプリと同一コード • NavigationHeloper • ObservableDictionay • RelayCommand • SuspensionManager 37
  38. 38. CommonをShared 38
  39. 39. 参照設定の違いを確認 ▷Windowsストアアプリ 39 ▷Windows Phoneストアアプリ BingMapはWindows Phoneに組み込まれているのを使う
  40. 40. コントロールの共通度はどれくらいあるか? 40
  41. 41. コントロールの共通性は? 80% exact same XAML 20% custom Common SignatureOptimized DatePicker TimePicker CommandBar Button CheckBox RadioButton ProgressBar Slider ToggleSwitch Hub Pivot ListView GridView SysTray 41
  42. 42. 8.1で古くなったといわれたところ ▷PickSingleFileAsync ▷PickSIngleFileAndContinue 42 古いわけじゃなかった…
  43. 43. カメラ周りは10%の方だった 43
  44. 44. 画面周りの移植に挑戦 44
  45. 45. Windowsストアアプリ側からMainPageをコピー ▷非互換はわかってるんだからねッ! • BingMap (WindowsPhoneは組込み) ▷でもBingMap以外にも… 45
  46. 46. 同名のStyleをつくると ▷エラーになる 46
  47. 47. 別名を付けて解決 ▷StandardStyle.xaml 47 ▷StandardStylePhone.xaml
  48. 48. 実行時エラー ▷ TopAppBarが原因 <Page.TopAppBar> <CommandBar> <CommandBar.SecondaryCommands> <AppBarButton Icon="View" Label="最寄り検索" Click="Near_Click" /> </CommandBar.SecondaryCommands> </CommandBar> </Page.TopAppBar> 48
  49. 49. 動くには動いたけれど… ←やっぱりバランス悪い 49
  50. 50. XAMLを全面的に見直して… ▷変更点 • Hubコントロールをいれて • BingMapをMapControlに変更して • GridViewのスタイルやプロパティ変更して ▷変更しなかった点 • コードビハインド側(除くMap関連) • NavigetionHelper周りとかそのまま動いた 50
  51. 51. FIN 51

×