なんでやってみたの?
この記事を読んで、これからのWindowsアプリはUWPが基本になるかもなぁって思ったので。
http://pc.watch.impress.co.jp/docs/news/event/20160411_752422.html
対象
自分のようにこれからはUWPだ!でもどうやって開発するのかな?と思った人
そもそもUWPって何よ?
詳しい説明は公式を。
https://msdn.microsoft.com/ja-jp/library/dn975273.aspx
ざっくばらんに説明すると、
「1つのソースコードでWindows10が搭載されたいろんなデバイスでレスポンシブなアプリケーションが作れるよ!やったねたえちゃん!」
というところでしょうか。
Microsoftの今後の方針や、これからの開発者はどうなるのか?を考えながら書いていきます。
環境
MacOSX ElCapitan
Windows10 on ParallelsDesktop
VisualStudio2015 Community
筆者の経験
1年前までC++でパッケージ開発、現在はユーザー企業で社内Sler。メインはVBA。
現在、プライベートでRubyOnRails勉強中。
C#経験はは商用レベルだと殆ど無し
XAML?なにそれ美味しいの?
開発環境準備
まずはSDKをインストール
VisualStudio2015 CommunityはインストールしただけではUWPアプリケーションの開発環境はないのでSDKをインストールします。
(Proとかは最初からはいってるんでしょうか?)
VisualStudioのプロジェクトを選択して
テンプレートのC#→Windows→ユニバーサルからユニバーサルWindowsツールをインストールを選択します。
インストールする機能選択ダイアログでユニバーサルWindows開発ツールをチェックしてインストール開始。
ここでVisualStudioを終了させるのを忘れずに!
ダラダラインストールが終わるのを待ちます。割と時間かかります。
再びVisualStudio2015を起動してプロジェクトを開けば・・・・
おめでとう!UWPアプリの開発環境が完成した!
初めてのUWPプログラムと配置エラー
初めてのプログラムはお約束のHelloWorldを作ってみます。
とりあえずテンプレートから空白のアプリを選択してプロジェクトを新規作成すると、こんなん出ました。
最小プラットフォームと最大プラットフォームが選択できるようです。
ターゲットのビルドバージョンより新しいビルドバージョンでは動かなくなるのでしょうか?
それとも単にアプリストアで表示ためだけなんでしょうか。
高品質のアプリをリリースするためには最低限MinimumVersionのWindows10環境とTargetVersionのWindows10環境の両方でテストが必要になりそうです。
とりあえず起動してちょっと対象アーキテクチャを見てみましょう。
ターゲットプラットフォームにARMがあるのがユニバーサルを感じさせます。
32bitにもまだまだ対応していますね。
そして何も考えないでいきなりビルドしてみると早速怒られました。
試しに別の場所にプロジェクトファイルを保存しても配置できませんでした・・・
エラーを見ると、「ファイルがネットワーク共有にあるため、AppxManifest.xmlからの登録欲求を拒否しています。ローカルにファイルを配置してください。」 とあります。
Parallelsの共有設定を変更
筆者はすべてのディスクを共有フォルダにする設定にしていたので、一度Windows10の仮想環境をシャットダウンしてホームフォルダのみ共有する設定に変更後、Windows10を再起動しました。
再ビルドしてみると、無事ビルドが完了しました。
起動も問題ななくできました。
なぜエラーが発生したのか?
ちょっとここで疑問になったので、ビルド設定を変えて、ネットワークドライブに出力する設定にしてみると、
再び配置エラーが発生しました。
逆にソリューションがネットワークドライブにあったとしても、ビルド出力先がローカルであれば問題ないようです。
以前、C#でWindowsFormアプリケーションを作った時は大丈夫でしたが、
UWPアプリはデバッグでシュミレータ、デバイスを選択できるため、
この辺の関係でネットワークドライブに出力するような設定は気まずいのでしょうか?
HelloWorldの作成
ビルドできるようになったので、まずMainPage.xamlを開いてみます。
XMALデザイナーが開かれますが、注目は左上。画面の大きさが選択できるんです。
IoTやXBOXがあるところがマルチデバイス!って感じですね。
さすがに84"Surface Hubは解像度が大きく、3840x2160という大きさです。
フルサイズでデバッグできるモニタが限られますね・・・(4Kモニタなら大丈夫そうですね)
このサイトを参考に、写経します。
http://www.atmarkit.co.jp/ait/articles/1509/29/news020.html
細かい説明は上のサイトを見ていただくとして、出来上がったものを色々いじってみます。
先進的なのはWebページのように、ウィンドウの大きさを変えても見た目が崩れない、ということですね。
コレがWindowsFormだと右に下にスクロールバーが出たりしますし、小さめなダイアログは拡大・縮小ができないようになってたりします。
標準 | 横長 | 縦長 |
---|---|---|
![]() |
![]() |
![]() |
上のようにローカルウィンドウだけではなく、シュミレータでデバッグすることもできます。
先ほど出した、ビルドターゲットでシュミレータを選択してデバッグ実行をしてみると、
こういった画面が表示され、様々なタッチ操作をエミュレートしたデバッグが可能です。
Hiper-V環境があるWindows10Proなら、WindowsPhoneエミュレータでのデバッグもできるので、
こちらはどちらかと言うとタブレットのデバッグがメインになりそうです。
## まとめ XAMLはHTMLの感覚で書けるあたり、UIはWeb開発の感覚に近いものを感じます。 Webデザイナが今後UWPアプリのデザインも行う時代になるんでしょうか。
逆に、今までWindowsフォームをデザイン屋に頼まないで自分で作っていた開発者はこういったレスポンシブなデザインの知識を勉強していく必要が出てきそうだなぁと思いました。
私も例に漏れず、自分でフォームを実装していたので、今後、レスポンシブなデザインを勉強する必要性が出てきそうです。
UWPはこれからのプラットフォームですが、大きい可能性がありそうなので、どんどん慣れて行きたいですね。
次は簡単なアプリを作ってみて、ストアで公開してみようと思います。
気になったこと
- 自分は左側にソリューションエクスプローラーを配置して、右側がコード、右下が出力etc。。。というスタイルが好みなのですが、
フォームデザイナを起動するとXAMLエディタがとても狭い・・・・ウマイ配置はないものだろうか!
XAMLが少ししか見えないので、ちょっとやりにくいです・・・
UWPでは、XAMLエディタでコントロールのイベントのコーディングが行えるので便利なのですが、この狭さでちょっとやりにくいです。
ここはあくまで簡易的なコーディングにしておくべきかなぁ。
- レスポンシブなデザインにすると、今までのWindowsFormで使っていたツールバーを使うようなデザインは厳しそうですね。
(ツールバーそのものがタッチ操作には向いてないと思いますし、モバイルアプリに近いデザインが必要になるでしょう)