How to add a gradient to buttons in android through xml?
Create a new xml file and put it in drawable and then add it to button as background
gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- Gradient Bg for listrow -->
<gradient
android:startColor="#f1f1f2"
android:centerColor="#e7e7e8"
android:endColor="#cfcfcf"
android:angle="270" />
</shape>
layout.xml
<Button
android:id="@+id/Button01"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="@drawable/gradient"
android:text="Übernehmen" >
Create gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<gradient
android:angle="270"
android:endColor="@color/greenstart"
android:startColor="@color/greenend" />
</shape>
Try this :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#70c656" />
<stroke
android:width="1dp"
android:color="#53933f" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="#70c656"
android:endColor="#53933f"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#53933f" />
<corners
android:radius="4dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
So here we go with the gradient. As above @Dusean Singh said. If you will use an angle 270 then your gradient will start from top to down : TOP -> Center -> bottom
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#FF0000"
android:centerColor="#00FF00"
android:endColor="#0000FF"
android:angle="270" />
</shape>
If you will use an angle 360 then your gradient will start from left to right : Left -> Center -> Right
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- Gradient Bg for listrow -->
<gradient
android:startColor="#FF0000"
android:centerColor="#00FF00"
android:endColor="#0000FF"
android:angle="360" />
</shape>
Here we go with the effect. and how to apply the same on button
<LinearLayout
android:id="@+id/design_bottom_sheet"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:drawableLeft="@drawable/ic_grid"
android:layout_width="match_parent"
android:text="Find"
android:background="@drawable/gradient_button"
android:textColor="@color/white"
android:textAllCaps="false"
android:layout_height="wrap_content"
android:layout_weight="1" />
<Button
android:drawableLeft="@drawable/ic_card"
android:layout_width="match_parent"
android:textColor="@color/white"
android:text="Match"
android:background="@drawable/gradient_button"
android:textAllCaps="false"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>