Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

はじめての UWP アプリ開発

6,613 views

Published on

UWP アプリ開発について、開発環境の構築~ストアへの登録まで順を追って紹介します。
@ Sapporo ComCamp 2016 powered by MVPs http://clrh.connpass.com/event/24456/ (2016/2/20)

Published in: Software
  • Be the first to comment

はじめての UWP アプリ開発

  1. 1. 1 はじめての UWP アプリ開発 宮崎 典行 Twitter: @openlibsys http://crystalmark.info/ Sapporo ComCamp 2016 powered by MVPs & CLR/H 98 @札幌 ユビキタス協創広場 U-cala #JCCMVP #clrh98 86 PAGES
  2. 2. 2自己紹介 名前:宮崎 典行/hiyohiyo/ひよひよ 年齢:37歳 家族:愛妻, 愛娘, 愛息子 趣味:ソフトウェア開発 (約17年) 住所:北海道札幌市 Microsoft MVP ・Visual C++ (Jan. 2014 – Sep. 2015) ・Visual Studio and Development Technologies (Oct. 2015 -) ベンチマーク, Benchmark, NVMe, AHCI, SSD, HDD, CPU, CPUID, ビデオカード, メガデモ, Final Reality, 3DMark, HDBENCH, WCPUID, Direct3D, OpenGL, MIDI, GS, XG, Photoshop, HiDPI, 8K, 5K, 4K, Displayport 1.3, Thunderbolt 3, HDMI 2.0, BIOS, EFI, SMBIOS, Firmware, 逆アセンブル, 逆コンパイル, カーネルモード ドライバ, コードサイニング証明書, デジタル署名, x64, x86, i386, Win32, Win64, MFC, Visual C++, Visual C#, WinForms, WPF, DirectWrite, Windows 10, GDI, GDI+, リソースリーク, ハンドルリーク, メモリーリーク, クラッシュ, ブルースク リーン, S.M.A.R.T., PCI, PCIExpress, 10GbE, 10GBase-T, ダブルフォルト, 8月 ~キーワード~
  3. 3. 3 一枚の画像で表現すると…
  4. 4. 4自作ソフトウェア紹介 CrystalDiskInfo CrystalDiskMark CrystalMark 2004 CrystalCPUID
  5. 5. 5本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録 目標: UWP アプリ開発者 1 名以上増
  6. 6. 6本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  7. 7. 7UWP (Universal Windows Platform) アプリとは Windows 10 を実行する全てのデバイスで 利用可能な共通アプリプラットフォーム 出典: https://msdn.microsoft.com/ja-jp/library/windows/apps/dn894631.aspx
  8. 8. 8UWP アプリの制限 自由なファイルアクセス 管理者権限での動作 プロセス間通信 低レイヤー API 使用 ループバック通信 データベースアクセス 高度なシステム系ツールの開発は実質不可能 従来のデスクトップアプリと長期間併存 (私見)
  9. 9. 9本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  10. 10. 10Windows 10 Windows as a Service 出典: https://www.microsoft.com/ja-jp/smb/business-news/w10waas 出典: https://www.microsoft.com/ja-jp/windows/features
  11. 11. 11Windows 10 無償アップデート 2016/7/28 まで Windows 7/(8)/8.1 から 無償アップデート可能!!
  12. 12. 12本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  13. 13. 13多数の Windows 10 Mobile 端末が!! *各社公式サイトより引用
  14. 14. 14真(涙)の VAIO Phone も間もなく!! 出典: https://vaio.com/products/phone_biz051/
  15. 15. 15本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  16. 16. 16Visual Studio Community 2015 https://www.visualstudio.com/ja-jp/ 個人は無料
  17. 17. 17Visual Studio のインストール カスタム を選択
  18. 18. 18開発者モードの有効化 設定 アプリ > 更新とセキュリティ > 開発者向け
  19. 19. 19本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  20. 20. 20新規プロジェクト ご自由に どうぞ 本日の解説 は C# で 空白のアプリ (ユニバーサル Windows)
  21. 21. 21空白のアプリ (ユニバーサル Windows) 自動コード生成
  22. 22. 22デバッグ実行 Debug x86 デバッグ実行 テンプレートは本当に空っぽ
  23. 23. 23UI の作成 ビューデザイナーで MainPage.xaml を編集 MainPage.xaml をダブルクリック
  24. 24. 24UI の作成 テキストブロックをビューに配置 TextBlock を ドラッグ&ドロップ 配置した TextBlock を選択 ⇒ プロパティを変更
  25. 25. 25UI の作成 ボタンを配置 Button を ドラッグ&ドロップ 配置した Button を選択 ⇒ プロパティを変更
  26. 26. 26イベントハンドラを登録 ボタンを押したときの挙動を設定 ダブルクリック ⇒ イベントハンドラ登録
  27. 27. 27イベントハンドラの自動生成 ボタンを押したときの挙動を設定 自動作成された イベントハンドラ
  28. 28. 28イベントハンドラの実装 ボタンを押したときの挙動を実装 textBlock コントロールの Text プロパティ 漢のバルマーメソッド button をクリックしたら・・・
  29. 29. 29本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  30. 30. 30実機デバッグ ボタンをクリック Windows 10 (PC) で実行
  31. 31. 31本勉強会のために KATANA 02 を購入
  32. 32. 32開発者モードの有効化 実機デバッグ準備 (本当にこれだけ!!)
  33. 33. 33実機デバッグ ARM + Device 設定で実行 Debug, ARM, ▶ Device ※実機がない場合は エミュレーターを使用
  34. 34. 34Hello World が実機で動く ⇒ 感動 1行も変更することなくPCでもMobileでも完全動作!!
  35. 35. 35実機でステップ実行可能 当然ブレークポイントの設定が可能 ボタンを押した 直後にブレーク
  36. 36. 36本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  37. 37. 37開発者登録の流れ Microsoft アカウントの取得 アプリ名予約 アカウント情報の登録
  38. 38. 38Microsoft アカウントの取得 https://www.microsoft.com/ja-jp/msaccount/
  39. 39. 39アカウント情報の登録 https://dev.windows.com/ja-jp/programs/join
  40. 40. 40アカウント情報の登録 https://dev.windows.com/ja-jp/programs/join
  41. 41. 41アカウント情報の登録 https://dev.windows.com/ja-jp/programs/join プロモーションコードがあれば「無料」 ⇒ あとは「規約」に同意すれば開発者登録完了
  42. 42. 42アプリ名の予約 https://dev.windows.com/ja-jp/ ダッシュボードから
  43. 43. 43アプリ名の予約 アプリ名の予約 https://dev.windows.com/ja-jp/
  44. 44. 44アプリ名の予約 開発予定のアプリ名 アプリ名が使えない事態を回避 https://dev.windows.com/ja-jp/
  45. 45. 45本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  46. 46. 46CLRH98 Benchmark □コンセプト とにかくシンプル □基本機能 • 乱数生成速度 (Xorshift) 測定 https://ja.wikipedia.org/wiki/Xorshift • シングルスレッド • OS のバージョン情報 • ベンダー名&モデル名 • 簡易 CPU 情報
  47. 47. 47CLRH98 Benchmark
  48. 48. 48CLRH98 Benchmark シンプルなベンチマークソフト デスクトップ版 レイアウト準備中
  49. 49. 49ベンチマーク コア ボタンを押したらそのままベンチマーク
  50. 50. 50システム情報取得 それっぽいシステム情報を取得 CPU 情報 ベンダー&モデル名 OSバージョン
  51. 51. 51アイコンの作成 UWP App logo maker 出典: 高橋 忍のブログ - UWP Logo Maker ver.1.0 http://blogs.msdn.com/b/shintak/archive/2015/08/23/10636906.aspx
  52. 52. 52マニフェスト設定 – アイコン プロジェクト > ストア > アプリケーションマニフェストの設定 #RRGGBB 形式で直接指定
  53. 53. 53マニフェスト設定 – 機能 プロジェクト > ストア > アプリケーションマニフェストの設定 インターネット接続機能 は不要のため解除
  54. 54. 54本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  55. 55. 55パッケージの作成 プロジェクト > ストア > アプリパッケージの作成
  56. 56. 56パッケージの作成 Microsoft アカウントでサインイン
  57. 57. 57パッケージの作成 アカウント名を再入力
  58. 58. 58パッケージの作成 メールに届いたコードを入力
  59. 59. 59パッケージの作成 予約したアプリケーション名から選択
  60. 60. 60パッケージの作成 バージョンおよびプラットフォーム設定 ストアへアップロードする ファイルの保存先
  61. 61. 61パッケージの作成 ストア提出前に全てのテストを実施
  62. 62. 62パッケージの作成 AppPackages フォルダ内にパッケージ生成 ⇒ ストア公開手続き時にアップロード
  63. 63. 63本日のプログラム 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録
  64. 64. 64ストア申請 https://dev.windows.com/ja-jp/overview?from=UHF デベロッパーセンター > ダッシュボード > アプリ名
  65. 65. 65ストア申請 申請手続き開始
  66. 66. 66ストア申請 必須入力項目は 5 項目
  67. 67. 67ストア申請 – 価格と使用可能状況 価格や公開する地域(国)などを設定
  68. 68. 68ストア申請 – 価格と使用可能状況 公開方法や対象プラットフォームなどを設定
  69. 69. 69ストア申請 – アプリのプロパティ カテゴリや必要なハードウェア情報を設定
  70. 70. 70ストア申請 – 年齢区分 簡単なアンケートに答えるだけ
  71. 71. 71ストア申請 – 年齢区分 全て「いいえ」の場合
  72. 72. 72ストア申請 – パッケージ パッケージのアップロード ここからパッケージ をアップロード
  73. 73. 73ストア申請 – 説明 わかりやすい説明を設定 失敗事例… • 説明は簡潔に • URL はクリック不可 ⇒ 無意味 ストアでの表示
  74. 74. 74ストア申請 – 説明 スクリーンショット&プロモーション画像の設定
  75. 75. 75ストア申請 – 説明 機能やキーワードなどの設定 このキーワードが検索にヒット プライバシーポリシーページ へのリンク
  76. 76. 76ストア申請 必要事項入力後「ストアに提出」
  77. 77. 77ストア申請 あとは待つだけ…
  78. 78. 78ストア掲載!! 「CLRH98」で検索!!
  79. 79. 79早速ダウンロードしてみましょう 検索キーワード 「CLRH98」
  80. 80. 80ベンチマーク結果の比較 0 500 1000 1500 2000 FREETEL KATANA 02, MSM8909 Quad core @ 1.1GHz VAIO Z VJZ13A, Core i7 5557U @ 3.1GHz Shuttle SH170, Core i7 6700T @ 2.8GHz 162 1672 1698 CLRH98 Benchmark
  81. 81. 81まとめ 準備 開発 公開 UWP アプリとは Windows 10 (PC) Windows 10 Mobile Visual Studio Community 2015 Hello World 開発者登録 実機デバッグ CLRH98 Benchmark パッケージの作成 ストアへの登録 意外と簡単! しかも楽しい!
  82. 82. 82次のステップ 2015/11/20(金) 開催 1 日で Windows 10 に対応したアプリ開発手法が習得できる ハンズオン~ Windows 10 UWP Developer Workshop http://1drv.ms/1NXXWme ハンズオンの主な内容 • Hello UWP World • Page Navigation and handling Back • アダプティブ UI • タイル • インタラクティブ トースト • WebView • Hosted Web Apps • Azure App Service Mobile Apps • Voice Commands and Cortana integration • Inking 手書き入力 • アプリ内広告の実装
  83. 83. 83Windows 10 最大の課題 2016/2/19 15:00 の Windows ストア
  84. 84. 84 参考文献
  85. 85. 85 • Windowsフォーム開発者のためのWindows 10 UWPアプリ開発入門(前編) http://www.atmarkit.co.jp/ait/articles/1509/29/news020.html • Windowsフォーム開発者のためのWindows 10 UWPアプリ開発入門(後編) http://www.atmarkit.co.jp/ait/articles/1510/06/news017.html • 初めてのUWPアプリ開発 ~9.まとめ~ http://yagisou.hatenablog.com/entry/2015/12/17/031621 • 1 日で Windows 10 に対応したアプリ開発手法が習得できるハンズオン~ Windows 10 UWP Developer Workshop http://1drv.ms/1NXXWme 参考文献
  86. 86. 86Q & A ベンチマーク, Benchmark, NVMe, AHCI, SSD, HDD, CPU, CPUID, ビデオカード, メガデモ, Final Reality, 3DMark, HDBENCH, WCPUID, Direct3D, OpenGL, MIDI, GS, XG, Photoshop, HiDPI, 8K, 5K, 4K, Displayport 1.3, Thunderbolt 3, HDMI 2.0, BIOS, EFI, SMBIOS, Firmware, 逆アセンブル, 逆コン パイル, カーネルモードドライバ, コードサイニング証明書, デジタル署名, x64, x86, i386, Win32, Win64, MFC, Visual C++, Visual C#, WinForms, WPF, DirectWrite, Windows 10, GDI, GDI+, リソー スリーク, ハンドルリーク, メモリーリーク, クラッシュ, ブルースクリーン, S.M.A.R.T., PCI, PCIExpress, 10GbE, 10GBase-T, ダブルフォルト, 8月

×