atelier:mitsuba

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

pure XAML UWPでHologramsみたいなやつできた!

youtu.be

どうしてもこれが作りたくて、HoloLens買ったときからずっと謎だったやつがやっとできた!
HoloLensでpure UWPから3Dモデルをボコボコ増やすやつ。


コードだけいうとこれだけ

        public async void AddStarPinButton_Click(object sender, RoutedEventArgs e)
        {
            var tile = new SecondaryTile(Guid.NewGuid().ToString())
            {
                DisplayName = "My Tile",
                Arguments = "myArgs"
            };

            tile.VisualElements.Square150x150Logo = new Uri("ms-appx:///Assets/MyTile/Square150x150Logo.png");

            var model = tile.VisualElements.MixedRealityModel;
            model.Uri = new Uri("ms-appx:///Assets/estrellica.glb");
            model.ActivationBehavior = TileMixedRealityModelActivationBehavior.None;
            model.BoundingBox = new SpatialBoundingBox
            {
                Center = new Vector3 {X = 1, Y = 0, Z = 0},
                Extents = new Vector3 {X = 3, Y = 5, Z = 4}
            };

            await tile.RequestCreateAsync();
        }

お分かりいただけただろうか....
こいつ、セカンダリータイルだ!!!

まずは今はなきWindows Phoneと同じように、セカンダリータイルを作ります。

            var tile = new SecondaryTile(Guid.NewGuid().ToString())
            {
                DisplayName = "My Tile",
                Arguments = "myArgs"
            };

            tile.VisualElements.Square150x150Logo = new Uri("ms-appx:///Assets/MyTile/Square150x150Logo.png");


で、このタイルのプロパティにMixedRealityModelが生えてるんですよ!
そこにモデルのUriを設定します。

            var model = tile.VisualElements.MixedRealityModel;
            model.Uri = new Uri("ms-appx:///Assets/estrellica.glb");

ちなみにモデルは「コンテンツ」になるように設定します。
f:id:c-mitsuba:20190320104901p:plain


で、このビヘイビアはタイルの振る舞いを設定。
今回はモデルを表示したいだけなので、「None」に。
「Default」にすると、モデルをタップするたびに新しいUWPのウィンドウが作成されます。

            model.ActivationBehavior = TileMixedRealityModelActivationBehavior.None;

で、最後はモデルにBoundaryBoxを追加します。
これで、モデルの移動回転拡大縮小ができるようになります。
で、タイル作成。

            model.BoundingBox = new SpatialBoundingBox
            {
                Center = new Vector3 {X = 1, Y = 0, Z = 0},
                Extents = new Vector3 {X = 3, Y = 5, Z = 4}
            };

            await tile.RequestCreateAsync();


わかっちゃえば簡単です。





で、どうやってこれに辿り着いたかというと、、、
Hologramsを立ち上げて、タスクマネージャーのプロセスから、Hologramsのプロセスを探して、右クリック。
で、ファイルの場所を開くを選択。
f:id:c-mitsuba:20190320105639p:plain


すると、アプリの実体のexeがあるフォルダが現れます。
f:id:c-mitsuba:20190320105833p:plain

ってことはこのアプリで使ってるDLLが丸見えになるんですよね。
早速DLLを全部引っこ抜いて、適当なUWPプロジェクトを作ったVSに突っ込みます。

こっから粗探し。適当になんか漁って見てそれっぽいのを当てずっぽうの手当たり次第で探す探す。

すると、「MixedRealityModel」っていうクラスを発見。
さらにさらに「TileMixedRealityModel」を発見。

ここで、あれ?こいつもしかしてSecondary Tileか???って当たりがついてー。

あとはmsdocsとー
docs.microsoft.com

var model = new SecondaryTile().VisualElements.MixedRealityModel;

を見つけたので、こっちのもの(๑•̀ㅂ•́)و✧
今回のサンプルアプリの開発に行き着きました。


HoloLensってUnityの絡んだ情報が大半で、pure UWPの情報が少ないし、長年の問題が解決したので、すごく満足です。

以上、Global Summit 2019のパーティからでした!