Uwpアプリケーション開発入門

UWPアプリケーション開発のススメ
.NETラボ勉強会 2015年8月
古代魚庵
西村誠

本セッションの目的
• UWPに興味を持ってもらう
• ストアアプリとUWPの違いについて紹介する
• DEMOで移植してみる

お品書き
• 自己紹介
• UWPとは？
• 実践編
• まとめ
https://doc.co/nzBEox

自己紹介
• 西村誠
• フリーランスのプログラマー兼ライター
• Microsoft MVP - Windows Platform Development（for ギリギリ）
• EC-CUBE公式エヴァンジェリスト

自己紹介
• Twitter：coelacanth
• Facebook:西村誠
• ブログ「眠るシーラカンスと水底のプログラマー」

自己紹介
• [広告] 8月26日に「基礎から学ぶC#」発売します
• 価格2000円
• ページ数160ページぐらい

自己紹介
• [広告] CodeZine 「Windows 10で始めるIoT入門」

UWPとは？

UWPとは？
• Universal Windows Platformの略
• Windows 10 OSが搭載された様々な環境で動くアプリ（UWPアプリ）
を作成できるプラットフォーム

様々なファミリー
• Desktop
• IoT
• Mobile
• Xbox
• HoloLends
• Surface Hub

Windows 10 Desktop
• 全画面じゃなくなったストアアプリ
• Cortana
• XAMLパフォーマンス向上
• ストアから利用できる現状唯一のプラットフォーム

Windows 10 IoT
• ラズパイなどで動かせるIoT用のWindows 10
• 正式版でましたね
• [宣伝] CodeZine・・・

Windows 10 Mobile
• Windows Phone用のWindows 10
• Insider Preview
• ただいまVisual Studioと相性悪し・・・（なおった？）
追記：実機Windows 10 MobileをUSB接続しているとVisual Studio 2015
がフリーズするという現象が私の環境で発生していましたが、8月22日
現在では解消されているようでした

Windows 10 その他
• Xbox
• Hololends
• Surface Hub(Extensionはあるんだよね)

UWPに至るまで

• Visual Studioで作成するプロジェクトは一つ
• バイナリはCPUアーキテクト毎に
Oneプロジェクト Oneバイナリ
UWPプロジェクト
x64
x86
ARM

• ストアにアップロードするパッケージは最大3つ
• X86のみなどでもOK
Oneプロジェクト Oneバイナリ

・Windows 8.1、Windows Phone 8.1でもUniversal Windowsアプリって
言っていましたよね。
・8.1の頃は2プロジェクト（+共有プロジェクト）2バイナリ
8.1の頃は？

・発展形という認識でよいと思う
・コードも大部分が共有可能
・追加、変更点も多いが、WinRTの資産は活かせる
ストアアプリのWinRTとの違い

Windows 10 Desktop

Windows 10 Desktop
Bridging?

Bridge
• iOSアプリをUWPに Bridge for iOS
• AndroidアプリをUWPに Bridge for Android
• WebサイトをUWPに Bridge for Web
• WPFをUWPに Bridge for Classic Windows apps

Bridge for iOS
• iOSプロジェクトをVisual Studioで読み込めるように変換する
• 変換すると.slnが作成される
• PreviewなのでStoryboard未対応（早く！！）
• GitHubでも公開されているので誰でも利用可能
https://github.com/Microsoft/WinObjC

Bridge for Android
• AndroidアプリをUWPとして動かす
• 現在、申請すると利用可能に（申請するにはapkが必要）

Bridge for Web
• DEMO（需要があれば）
• プロジェクトの作成
• JS、CSS、HTMLなど削除
• ApplicationContentUriRules
詳しくは
http://microsoftedge.github.io/WebAppsDocs/en-US/win10/CreateHWA.htm

Bridge for Classic Windows apps
• WPFをUWPとして動かす
• 現在、申請すると利用可能に

でUWPにする？
• 適材適所で
• Windows 10普及してね

UWPのいいところ
• ストアがあるので不特定多数への配布が楽
• Windows 10が動く端末ならマルチに展開できる
• タッチ向きの画面が作りやすい
• ライバルが少ない
• ストアアプリに比べてできることが増えた

UWPが苦手なことろ
• 複雑なフォーム
• 古いOSだと動かない
• サンドボックスがある
• 社内配布など限定公開が面倒

実践編

開発ツール
• OSはWindows 10
• IDEはVisual Studio 2015
• 言語はXAML/C# or VB、HTML/JS、C++
• 画面をXAML（or HTML）で定義してロジックをC#（VB or JS or C++）で
記述する（ゲームはDirectX/C++）

開発者モードに
• 設定の更新とセキュリティから

プロジェクトの作成
• 空白のアプリ(ユニバーサル Windows)のみ
• ちなみに8.1は
• 個人的にはユニバーサル Windows 10とかにしてほしかった

初期プロジェクト
• 空白のアプリ(ユニバーサル Windows)のみ
• ストアアプリのプロジェクト構成とすごく似ている
• Project.jsonが違うぐらいか？

DEMO:Hello World
• 需要があれば
• ストアアプリと同じ

開発の流れ
• Windowsストアアプリの情報が利用可能なケースが多い
• ストアアプリとどのくらい共通なのかは後で例示します。
• 本セッションではマルチプラットフォーム対応について主に紹介
• ストアアプリの情報で動かない場合はGitHubのUWPアプリのサンプ
ルを探す
https://github.com/Microsoft/Windows-universal-samples

デバイス固有の機能を使う
• デバイス固有の機能を使いたい場合（電話のWindowsボタンなど）
は拡張（Extention）を利用
• 拡張は「参照の追加」から
bool isHWButton
=Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Wind
ows.Phone.UI.Input.HardwareButtons");

デバイス固有の機能を使う
• C:Program Files (x86)Windows Kits10Extension SDKs
のSDKManifest.xmlをのぞくと理解に役立つかな
・C:Program Files (x86)Windows Kits10References
あたりに.winmdファイルがある

Sharedで固有のコードを書く
#if WINDOWS_UWP
// UWPの場合
// さらにPCか電話かを判定する場合
DeviceManager.isMobile =
Windows.System.Profile.AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile";
#endif
#if WINDOWS_PHONE_APP
// Windows Phone 8.1の場合
#endif
#if WINDOWS_APP
// Windows 8.1の場合
#endif

Ifディレクティブの外に書くと・・・

プロジェクトに合わせて気ifディレクティブを切り替えることも

ファミリー毎にXAMLファイルを変える
• MainPage.DeviceFamily-デバイスファミリー名.xaml
• フォルダで分けてもよい
• コードビハインド（xaml.cs）は共通

Desktop版しかストアに出さない
Package.appxmanifestを編集
<Dependencies>
<TargetDeviceFamily Name="Windows.Desktop"
MinVersion="10.0.10049.0" MaxVersionTested="10.0.10049.0" />
</Dependencies>
で良いと思うが、まだストアからダウンロードできるのはデスクトッ
プ版だけなので確認できず・・・

画面幅でレイアウトを変える
VisualStateManagerで定義
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="720" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MySplitView.DisplayMode" Value="Inline" />
</VisualState.Setters>

移植例：見える継続カレンダー
• 「見える継続カレンダー」というWindows 8.1向けアプリを移植してみ
た

• 「見える継続カレンダー」というWindows 8.1向けアプリを移植してみ
た
• 基本はSharedで共有する形でXAMLもcsもAssetsも共有していく
• おおむね既存コードでよかったが一部変更点も

• ListViewのドラッグ&ドロップ機能を使ってスタンプをカレンダーに配
置するのだが、ここが8.1→UWPで変更になっていた
ListView CanDragItems="True“

UWP（Desktop）ではDragOver時に以下のコードが必要に
void tmpText_DragOver(object sender, DragEventArgs e)
{
e.AcceptedOperation =
Windows.ApplicationModel.DataTransfer.DataPackageOperation.Move;
e.Handled = true;

そもそもMobileはListViewのドラッグ＆ドロップは使えない
（これは過去のバージョンも同じ）
Mobileは画面が小さいからドラッグ&ドロップ操作は非推奨ということ
かな？
タップする操作に変更するために別XAMLに変更。
タップ対応は実装中・・・

アイコンなどの画像サイズが微妙に違っていた・・・
Windows 8.1
UWP
追記:Windows Phone 8.1が71×71アイコンがあるので揃えたのかな

で、何が違うの？
Windows 8.1（コントラクトが「三」から呼び出せる）
UWP

移植DEMO
• UWPプロジェクトの作成
• Sharedの追加
• Viewを移植
• 初期ページがMainFrame.xaml
（これはアプリの仕様）
追記：デモではほとんどエラーもなく移植できてしまいましたが、機能によっ
ては大幅な修正が必要な場合も？ FilePickerはかなり挙動が変わったとの
ことでした。

ストア
• WindowsストアアプリとWindows Phoneのストアが統一

ストア
• Windows 10のストアアプリからアプリをインストール

まとめ
• UWPの登場でさらにマルチプラットフォーム対応が進む
• ストアアプリのコードは場合によってはそのまま動く
• Windows Phoneアプリを公開している人はXamarinがもらえるので、
Windows 10 + iOS + Androidでさらにマルチに！！

御静聴ありがとうございました

UWPアプリケーション開発入門
めとべや東京勉強会 #9
古代魚庵
西村誠

本セッションの目的
• UWPについて基礎的なことを知ってもらう
• UWPに興味を持ってもらう
• 難しいことは以降の人にお任せ

Uwpアプリケーション開発入門

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (20)

Similar to Uwpアプリケーション開発入門

Similar to Uwpアプリケーション開発入門 (20)

More from Makoto Nishimura

More from Makoto Nishimura (20)

Recently uploaded

Recently uploaded (16)

Uwpアプリケーション開発入門