atelier:mitsuba

i love UI/UX, Blend, XAML, Behavior, P5, oF, Web, Tangible Bits and Physical computing. なにかあればお気軽にご連絡ください。atelier@c-mitsuba.com

Uno Platformを使ってXamarinで真っ当なXAMLを書きたい その1 環境構築

最近見つけたライブラリにUno Platformっていうのがあってですね、これがちょっとおもしろそう。
platform.uno

なにかっていうと日頃書いてる見知った雰囲気のXAMLクロスプラットフォーム開発ができるらしい。
.NET Coreを使ってWebAssembly、Xamarin Formsを使ってAndroidiOS、あと普通にUWPと。

Formsの出始めにXAMLでモバイルアプリが書けるぞ!!!って大歓喜したあと、なんだこのパチもんXAMLは、、、って思った身としてはかなり興味あるかんじ。
おそらく同じように思った人がいるんだろうなぁ。。
ページにもこんなことが書いてあって、ターゲットの察し感がすごい(
f:id:c-mitsuba:20191128190619p:plain

というわけで試してみました。

さくっと触ってみたいだけなら、公式にあるPlaygroundを見てみると良いです。
サンプルXAMLが真っ当なXAMLできっと感激するはず。
https://playground.platform.uno/


でもちゃんと環境つくりたいですよね。さっそく作ってみましょう。
っていっても簡単。

1.Visual StudioにXamarinを入れます。
f:id:c-mitsuba:20191128190906p:plain


2.適当にVisual Studioを立ち上げて拡張機能をインストールします。
f:id:c-mitsuba:20191128191041p:plain

するとVisual StudioのテンプレートにUno Platformが出てくるので、これでプロジェクトを作るだけ。
めっちゃ簡単ですね。
f:id:c-mitsuba:20191128190951p:plain


3.もしプロジェクトを作ったあとにnuget周りでエラーがでてたら、パッケージの復元をしてあげてください。
f:id:c-mitsuba:20191128191152p:plain
f:id:c-mitsuba:20191128191214p:plain


4.ここでソリューションエクスプローラーを見てみましょう。
こんな感じになってるはず。今までXAMLプラットフォームをやってきた人だと、Sharedプロジェクトにフフッってなるかも(
f:id:c-mitsuba:20191128191255p:plain


5.今回はまず動くことを確認したいので、SharedプロジェクトのMainPage.xamlを適当に変えてみます。
TextWrappingとかも使えていい感じですね。
f:id:c-mitsuba:20191128191416p:plain

6.ビルドしてみましょう。とかにエラーが出てなければUWPはサクッとビルドてきるはず。
Androidエミュレータにビルドしたい場合は、Windowsのハイパーバイザーを有効にしておかないとエミュレータが立ち上がってこないのでそこだけ注意。
ここいじったらちゃんと再起動してあげてね。
f:id:c-mitsuba:20191128191607p:plain

7.実行して、うまく行けばこうなるはず!ねっ、簡単でしょう?
f:id:c-mitsuba:20191128191711p:plain



AndroidをXamarinでラップしてさらにUnoでラップしてる以上、たぶんきっとおそらく色々制限とかある気がするし、完全にすべてのXAMLを書けるわけでもないはず。。
でもでも好きになりそう。もうちょっと触っていってみようかなー。