myunuts's blog

プログラム関係をメモっています

グラデーションかけてみる

グラデーションにチャレンジ中。

maim.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:orientation="vertical"
  android:background="@drawable/background">

  <TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello" />
  <Button android:text="@string/back" android:id="@+id/Button01" android:layout_width="wrap_content"
     android:layout_height="wrap_content"></Button>
  <Button android:text="@string/back" android:id="@+id/Button02" android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:background="@drawable/original_button"></Button>

drawable/background.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient
  android:startColor="#FF000000"
  android:endColor="#FFFFFFFF"
  android:angle="270"
  android:type="linear"/>
</shape>

drawable/original_button.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
  <!-- ボタンが押されている -->
  <item android:state_pressed="true"
	android:state_focused="false">
    <layer-list>
      <item >
	<shape xmlns:android="http://schemas.android.com/apk/res/android"
	  android:shape="rectangle">
	<gradient
	  android:angle="270"
	  android:startColor="#00E000"
	  android:centerColor="#00C100"
	  android:endColor="#00FF00"
	  android:type="linear" />
	<padding
	  android:left="5dp"
	  android:top="5dp"
	  android:right="5dp"
	  android:bottom="5dp" />
	<corners
	  android:bottomRightRadius="10dp"
	  android:bottomLeftRadius="10dp"
	  android:topLeftRadius="10dp"
	  android:topRightRadius="10dp"
	  android:radius="10dip" />
	<stroke
	  android:width="2dip"
	  android:color="#000000"/>
	</shape>
      </item>
    </layer-list>
  </item>
  <!-- ボタンが押されていない -->
  <item android:state_pressed="false" android:state_focused="false">
    <layer-list>
      <item>
	<shape xmlns:android="http://schemas.android.com/apk/res/android"
		android:shape="rectangle">
	<gradient
		android:angle="270"
		android:startColor="#00FF00"
		android:centerColor="#00C100"
		android:endColor="#00E000"
		android:type="linear" />
	<padding
		android:left="5dp"
		android:top="5dp"
		android:right="5dp"
		android:bottom="5dp" />
	<corners android:radius="2dip" />
        android:bottomRightRadius="10dp"
	android:bottomLeftRadius="10dp"
	android:topLeftRadius="10dp"
	android:topRightRadius="10dp"
	<stroke android:width="2dip"
		android:color="#000000"/>
	</shape>
      </item>
    </layer-list>
  </item>
</selector>

で、こんな感じ。
f:id:myunuts:20120228191042p:plain

ボタンをきれいに枠どりして表示するのがまだわからない。