XML Drawable onlyでドロイド君を描いてみた
Tweet
以前のエントリ「XMLなDrawableを使ってみよう」でも取り上げましたが、AndroidのXMLで表現できるDrawableはそこそこ強力です。
そんなわけでXML onlyでドロイド君を描いてみました。
画像だけだと微妙にイケてないドロイド君にしか見えませんね(。x。)
ソースは続きからどうぞ、JavaコードやPNG等の画像ファイルは一切書いておりません。
直線描けなかったからツノが酷いことになったよ!さっさとSVGネイティブ対応しろし!
layout/main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@color/droid_background"
android:padding="10dip" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="80dip"
android:layout_marginTop="5dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="82dip"
android:layout_marginTop="8dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="84dip"
android:layout_marginTop="11dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="86dip"
android:layout_marginTop="14dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="88dip"
android:layout_marginTop="17dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="90dip"
android:layout_marginTop="20dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="92dip"
android:layout_marginTop="23dip"
android:background="@drawable/green_oval" />
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="80dip"
android:layout_marginTop="5dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="82dip"
android:layout_marginTop="8dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="84dip"
android:layout_marginTop="11dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="86dip"
android:layout_marginTop="14dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="88dip"
android:layout_marginTop="17dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="90dip"
android:layout_marginTop="20dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="92dip"
android:layout_marginTop="23dip"
android:background="@drawable/green_oval" />
</FrameLayout>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="180dip"
android:layout_marginTop="5dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="178dip"
android:layout_marginTop="8dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="176dip"
android:layout_marginTop="11dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="174dip"
android:layout_marginTop="14dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="172dip"
android:layout_marginTop="17dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="170dip"
android:layout_marginTop="20dip"
android:background="@drawable/green_oval" />
<View
android:layout_width="10dip"
android:layout_height="10dip"
android:layout_marginLeft="168dip"
android:layout_marginTop="23dip"
android:background="@drawable/green_oval" />
</FrameLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:id="@+id/droid_head"
android:layout_width="170dip"
android:layout_height="160dip"
android:layout_marginLeft="50dip"
android:layout_marginTop="20dip"
android:background="@drawable/green_oval_head" />
<View
android:id="@+id/droid_body_top"
android:layout_width="170dip"
android:layout_height="10dip"
android:layout_alignBottom="@id/droid_head"
android:layout_marginBottom="80dip"
android:layout_marginLeft="50dip"
android:background="@color/droid_background" />
<View
android:id="@+id/droid_eye_left"
android:layout_width="12dip"
android:layout_height="12dip"
android:layout_marginLeft="90dip"
android:layout_marginTop="55dip"
android:background="@drawable/white_oval" />
<View
android:id="@+id/droid_eye_right"
android:layout_width="12dip"
android:layout_height="12dip"
android:layout_marginLeft="167dip"
android:layout_marginTop="55dip"
android:background="@drawable/white_oval" />
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="5dip"
android:layout_marginRight="5dip"
android:layout_marginTop="95dip" >
<View
android:id="@+id/droid_arm_left"
android:layout_width="40dip"
android:layout_height="110dip"
android:layout_marginRight="5dip"
android:background="@drawable/green_round" />
<View
android:id="@+id/droid_body"
android:layout_width="170dip"
android:layout_height="140dip"
android:layout_toRightOf="@id/droid_arm_left"
android:background="@drawable/green_round_bottom" />
<View
android:id="@+id/droid_arm_right"
android:layout_width="40dip"
android:layout_height="110dip"
android:layout_marginLeft="5dip"
android:layout_toRightOf="@id/droid_body"
android:background="@drawable/green_round" />
<View
android:id="@+id/droid_leg_left"
android:layout_width="40dip"
android:layout_height="40dip"
android:layout_below="@id/droid_body"
android:layout_marginLeft="80dip"
android:background="@drawable/green_round_bottom" />
<View
android:id="@+id/droid_leg_right"
android:layout_width="40dip"
android:layout_height="40dip"
android:layout_alignTop="@id/droid_leg_left"
android:layout_marginLeft="25dip"
android:layout_toRightOf="@id/droid_leg_left"
android:background="@drawable/green_round_bottom" />
</RelativeLayout>
</FrameLayout>
</FrameLayout>
color.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="white">#ffffff</color>
<color name="droid">#A4C639</color>
<color name="droid_light">#D4F689</color>
<color name="droid_background">#000000</color>
</resources>
green_round.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<stroke
android:width="0dip"
android:color="@color/droid" />
<gradient
android:centerColor="@color/droid_light"
android:endColor="@color/droid"
android:startColor="@color/droid" />
<corners android:radius="20dip" />
</shape>
green_round_bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<stroke
android:width="0dip"
android:color="@color/droid" />
<gradient
android:centerColor="@color/droid_light"
android:endColor="@color/droid"
android:startColor="@color/droid" />
<corners
android:bottomLeftRadius="20dip"
android:bottomRightRadius="20dip"
android:topLeftRadius="0dip"
android:topRightRadius="0dip" />
</shape>
green_oval_head.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<gradient
android:centerColor="@color/droid"
android:centerX="0.3"
android:centerY="0.1"
android:endColor="@color/droid"
android:gradientRadius="250.0"
android:startColor="@color/droid_light"
android:type="radial" />
</shape>
green_oval.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="@color/droid" />
</shape>
white_oval.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="@color/white" />
</shape>

コメントする