atelier:mitsuba

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

Xamarinであんよよいようぇあーのデザインをしやすくする

デフォルトのデザインビューは四角くって、エミュで実行するまで、どんなかんじかよくわかりません。
なので、こんなふうにしました。
f:id:c-mitsuba:20141012163833p:plain
左がエミュレータ、真ん中でデザインビュー、右がmask用の画像。
とりあえず、moto 360では画面が丸くクリップされるの、マスク用の透過pngを作って、それっぽくみえるようにします。
で、デザインビュー右上にあるThemeを[Theme.DeviceDefault.Dialog.NoFrame]にします。

すると、エミュレータとそっくりなデザインビューのできあがり!
axmlはこんなかんじ。不可視プロパティとかないんかなぁ。

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#92D8AB">
    <Button
        android:id="@+id/myButton"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />
    <ImageView
        android:layout_width="320px"
        android:layout_height="320px"
        android:id="@+id/mask"
        android:src="@drawable/mask" />
</AbsoluteLayout>

mask.pngは320px*320pxで、円を繰り抜いた画像です。
管理はしないけど、一応おいておこう。
Dropbox - mask.png

ひとまずこれで、まともにデザインできるようになりました。