Normal button looks like:
Now, please let me know, How can i make a simple button same as an attached image button (i.e. button corner shape is round and also there is no gap between two buttons)
1- create shapes (with desired colors) for pressed and released states
To create the shapes I would suggest this great website the will do it for you: http://angrytools.com/android/button/
drawable\botton_shape_pressed.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="@color/pressed_button_background"
android:endColor="@color/pressed_button_background"
android:angle="45"/>
<padding android:left="7dp"
android:top="7dp"
android:right="7dp"
android:bottom="7dp" />
<corners android:radius="8dp" />
</shape>
drawable\botton_shape_released.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="@color/released_button_background"
android:endColor="@color/released_button_background"
android:angle="45"/>
<padding android:left="7dp"
android:top="7dp"
android:right="7dp"
android:bottom="7dp" />
<corners android:radius="8dp" />
</shape>
2- create a selector for the two shapes
drawable\botton_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/botton_shape_pressed"
android:state_pressed="true" />
<item android:drawable="@drawable/botton_shape_pressed"
android:state_selected="true" />
<item android:drawable="@drawable/botton_shape_released" />
</selector>
3- use the selector for the button
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/test"
android:textColor="@color/blue_text"
android:onClick="testOnClickListener"
android:background="@drawable/botton_selector" />
9-patch would work fine here, but I try to avoid them since it's hard for me to do them :(
You can try having a selector
and using a shape for each state:
The shape would look like this:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#AAFFFFFF"/>
<corners android:bottomRightRadius="7dp"
android:bottomLeftRadius="7dp"
android:topLeftRadius="7dp"
android:topRightRadius="7dp"/>
</shape>
You need to create a 9-patch drawable. In order to have no gap (margin) between the buttons you need to create the appropriate layout in XML and set the margin to 0.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With