よりぶろ

アプリのUIとかについて書いてく予定

Facebook Origamiに端末を追加するお話

久しぶりのOrigami話。というか久しぶりにOrigami触った。バージョンも1.3になりましたね。

 

Origamiタブレット系の端末がiPadしか選べなくて、Windows ストア アプリを作りたい時にうーんってなってたんだけど、意外とさらっと追加できたので自分用メモも兼ねて記録。

最近OrigamiのFBページみてないので、ひょっとしたらみんなもう知ってるかも。。

 

編集するパッチ

Phone.qtz

Phone Dimensions.qtz

 

Phone.qtz の編集するところ

1.

Device Info というマクロパッチに潜る

 

2.

f:id:ryo_pan:20140820200304p:plain

端末の画像が繋がってる Image Multiplexer の Inputs の数を 5 にする。

 

3.

Source #4 が出てくるので、Surface の画像を繋げる。画像は

https://dl.dropboxusercontent.com/u/1279753/Surface.png

からどうぞ。

 

4.

f:id:ryo_pan:20140820200541p:plain

Device Type の Maxium Value を 4 にする。

 

5.

f:id:ryo_pan:20140820200642p:plain

Device Type の左にある Math の数を 3 にする。

 

6.

f:id:ryo_pan:20140820200714p:plain

この4つを他の端末からコピペして、 Math を繋げる。

 

7.

f:id:ryo_pan:20140820200855p:plain

ここの Math の Operand #1 を 4 にする。

 

8.

f:id:ryo_pan:20140820200805p:plain

名前と Size を変更する。今回は初代 Surface なので 1366。

 

9.

一番上の階層まで戻って、今度は Composite というパッチに潜る。

 

10.

f:id:ryo_pan:20140820201209p:plain

Device Type に Surface を追加する。

 

11.

f:id:ryo_pan:20140820201238p:plain

Swap X and Y When Rotated の Outputs を 5 にする。

 

ちなみに Composite 内に Shadow Layout という名前のパッチがあるのですが、ここに潜ると端末の影の位置を弄れます。

f:id:ryo_pan:20140820201408p:plain

 

Phone.qtz の編集は以上。

 

 

Phone Dimensions.qtz の編集するところ

1.

f:id:ryo_pan:20140820201602p:plain

Phone に Surface を追加する。

 

2. 

Phone の隣にある Width と Height の Inputs をそれぞれ 5 に変更し、

Width には 768、Height には 1366 を入れる。

 

Phone Dimensions.qtz の編集は以上。

 

 

あとはいつも通りプロジェクトを作って、Phone Dimensions から Surface を選べば…

f:id:ryo_pan:20140820201906p:plain

\ 完 成 /

 

 

…するはず!しなかったらごめんなさい。

うまくいかなかった方は以下から qtz ファイルを DL してみてください。ちなみに影の位置は調整してません。あとそんなにまだ検証してないので、どこかで不具合が出るかもしれません。

https://dl.dropboxusercontent.com/u/1279753/Phone.qtz

https://dl.dropboxusercontent.com/u/1279753/Phone%20Dimensions.qtz

 

 

おそらく、数値や画像を用意すれば、他の端末でも問題なく追加できると思います。

再度書くけど、すでに知られてたら恥ずかしい・・・!