Android custom button




This article demonstrates how do I create a custom button in Android using XML Styles in android. Below is given three different examples given to the style android button.

Step 1 − Create a new project in Android Studio, go to File ⇒ New Project, and fill all required details to create a new project.

Step 2 − Add the following code to res/layout/activity_main.xml.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context=".MainActivity">

   <Button
      android:id="@+id/customButton"
      android:layout_width="200dp"
      android:layout_height="wrap_content"
      android:layout_centerInParent="true"
      android:background="@drawable/custom_button"
      android:text="My Custom button"/>

   <Button
      android:id="@+id/customButton2"
      android:layout_width="200dp"
      android:layout_height="wrap_content"
      android:layout_centerInParent="true"
      android:layout_below="@id/customButton"
      android:layout_marginTop="24sp"
      android:background="@drawable/custom_button2"
      android:text="My Custom button"/>

   <Button
      android:id="@+id/customButton3"
      android:layout_width="200dp"
      android:layout_height="200dp"
      android:layout_centerInParent="true"
      android:layout_above="@id/customButton"
      android:layout_marginBottom="24sp"
      android:layout_marginTop="24sp"
      android:background="@drawable/custom_button3"
      android:text="My Custom button"/>
</RelativeLayout>

Step 3 – Right Click on res/drawable, Select new -> Drawable resource file and add the following code in button_style.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">

   <stroke android:color="#66F9B9" android:width="4dp"/>
   <corners android:radius="16sp"/>
</shape>

Step 4 – Again Right Click on res/drawable, Select new -> Drawable resource file and add the following code in button_style2.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">

   <gradient android:startColor="#2AF598" android:centerColor="#ff1493"
      android:endColor="@color/colorPrimary"/>
   <corners android:radius="50dp"/>
</shape>

Step 5 – Again Right Click on res/drawable, Select new -> Drawable resource file and add the following code in button_style3.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle">

   <solid android:color="#80121a" />
   <corners android:radius="999dp"/>
</shape>

Step 6 − And now add the following code to src/MainActivity.java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
}

Now try to run your application. I assume you have connected your actual Android Mobile device with your computer. To run the app from the android studio, open one of your project’s activity files and click Run 

 Icon from the toolbar. Select your mobile device as an option and then check your mobile device which will display your default screen. 

Screenshot :

Android custom button
Android custom button screenshot

Recommended Post:- Download MS Office 2007 Directly Full Version for Free

Recommended Post:android-free-ui-kit-for-profile-screen-using-recyclerview/

Leave a Reply

You may also like

%d bloggers like this: