atelier:mitsuba

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

avaloniaを試してみてる今日このごろ。その1。

友達とゲームしながらちょっと話題に出たのがavalonia。
avaloniaui.net

書けることなら、この世のすべてのフロントエンドをXAMLで書きたいマンとしてはちょっと興味が湧いたので触ってみることにした。

いわゆるCross-PlatformなXAMLプラットフォームで、似たようなやつだとXamarin FormsとかUno Platformとかがあるかんじかな。

Xamarin Formsは言語仕様としてのXAMLっていうだけで、記法はネイティブのXAMLプラットフォーム(いわゆるUWPとかWPFとか)とは全く違う印象があるんよなー。
だから夢だけ見せられて、いやないわって思ったのがn年前。

Uno Platformはざっくり言っちゃうのUWPをポーティングしてできてるかんじ。だからAPIとかもUWP準拠されてていつもどおり書ける。
UWPだからWinUIも使われてて、いまどきのUIっぽく作れるのもいいかんじ。
ただUWPから持ってきてるからUWPで呼べない機能はもちろん呼べない(はず)(Cross Platform側で実装すればそのプラットフォームの機能は呼べるだろうけど)。
けど、ぱっとやってみたかんじはかなりよくできてて気に入ってるなー(がっつり使うタイミングがないのが悲しいけど)

でもって、今回のavalonia。
UnoがUWPならavaloniaはWPFをポーティングしたかんじ。基本的にWPFで書かれてるものの8-9割ぐらいがそのまま動く印象。
ちょっと触ってみて、かなり好感触だったので検証してみようっておもった次第。

多くのXAML系Cross PlatformがWindowsのコードでiOSAndroidが!って触れ込みなんだけど、avaloniaは元がUWPだからか、Desktop環境のCross Platformに力を入れてるみたい。
だからWPFのノリで作ったものがMacにもLinuxにも!ってかんじ。もちろんiOSAndroidでも動かせれるらしいんだけど、他と比べてDesktopへの情報が多い(とはいっても多いとはいってないみたいな状況ではある)

個人的な環境として、Windowsは開発機で、Blog書いたりデザインしたり日頃の手慰み環境はMacばっかりを使ってる。
から、このWPFのコードでMacのアプリが!っていうのが魅力的かな。

まだMacでのビルドは試してないので、とりあえずWindowsで開発環境つくって動かしてみたけど、かなり簡単。

日ごろのVisual Studioが入ってる環境で、Extentionいれるだけ。
marketplace.visualstudio.com

ちょろい!
これを入れるとプロジェクトテンプレートが追加されるから、そっから作るだけ。
一番素のがAvalonia Applicationで、MVVMテンプレが入ってるのがAvalonia MVVM Application。
それぞれにC#とF#があるみたい。
f:id:c-mitsuba:20210329074607p:plain

F#のキモチはわからんからC#一択なんだけど、個人的にかなりイイのがMVVMのテンプレ。
ぺらっぺらなんよな。
f:id:c-mitsuba:20210329074803p:plain

ってかぺらっぺらどころかほぼなんもない。
f:id:c-mitsuba:20210329075101p:plain

f:id:c-mitsuba:20210329075109p:plain

f:id:c-mitsuba:20210329075134p:plain


フォルダ構成を作ってくれて、サンプルにこう書くんやで、って書いてる程度。
PrismとかMVVMなんちゃらとか巷の分厚いMVVMプラットフォームって嫌いで、かなり好感触。
でもってちゃんとデザイナーもでてる。
f:id:c-mitsuba:20210329075142p:plain

基本的に.net coreなモノはよそのプラットフォームでも動くはず!!?
とりあえずWindows上でReactivePropertyは動いてる。


Windows固有なものコードで、System.DrawingとかSystem.MediaにはAvalonia用のがあるみたい。
Cross Platformしたかったら、こういうフロントなやつはAvaloniaの名前空間のを使っておくと大丈夫そう。
f:id:c-mitsuba:20210329075629p:plain

あとはWPFにはない機能として、StyleをCSSみたいにかけたりできるのが面白い。
f:id:c-mitsuba:20210329080445p:plain
もちろん今まで通りの記法で書くことも可能。

若干方言として、プロパティの名前が変わってるものもあるっぽい。
ItemsSourceがItemsになってたり(ItemsでBindingできる)
VisibilityがIsVisibleになっててBoolで出したり消したりできるようになってたり。

そのあたりは書きながら無いPropertyを手探りで当ててるかんじかな。
方言と名前空間さえクリアすれば、結構WPFから移植できそうで、InteractivityとかはAvalonia用のものが用意されてる。
f:id:c-mitsuba:20210329080815p:plain

なんならDirect2Dのコードがモバイルでもうごくよ!!とか書かれてって、ホントに????って感じまでする。
f:id:c-mitsuba:20210329080835p:plain


そんなかんじで、なかなかおもしろプラットフォームっぽい。
前にUWPで作ったtanzaniteのMac版を作ろう作ろうと思ってたけど、もしかしたらavaloniaならイケるかもしれない?
ひとまずそれっぽいのは作ってみたけど。

時間があるときにちまちまと触っていってみよう。