My Life with Android
Introduction Android Componets UserInterface Advanced UI Data Storage Advanced Concepts Others New Studio

Android Button Control

Button is a push-button. Push-buttons can be pressed, or clicked, by the user to perform an action.

Button Attributes

Attribute Description
android:id This is the ID which uniquely identifies the control.
android:text Text to display.
android:textColor Text color. May be a color value, in the form of "#rgb", "#argb", "#rrggbb", or "#aarrggbb".
android:textSize Size of the text. Recommended dimension type for text is "sp" for scaled-pixels (example: 15sp).
android:textStyle Style (bold, italic, bold|italic) for the text. You can use or more of the following values separated by '|'.
android:typeface Typeface (normal, sans, serif, monospace) for the text.

Syntax :


<Button
  android:id="@+id/btn_submit"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="Submit" />

Default Button

In res/layout/your_filename.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="30dp" >


    <Button
        android:id="@+id/btnSubmit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Submit"
        />

</LinearLayout>
Result

Ex - 2 : Applying color as background

In res/layout/your_filename.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="30dp" >


    <Button
        android:id="@+id/btnRegister"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#E91E63"
        android:paddingLeft="8dp"
        android:paddingRight="8dp"
        android:text="Register"
        android:textColor="#FFF"
  
  />

</LinearLayout>
Result

Ex - 3 : Applying image as background

Step 1: Creating drawable folder to place image.
Step 2: Place your image in drawable folder
Step 3: In your layout file res/layout/your_filename.xml 

<Button
        android:id="@+id/btnRegister"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/btn"
        
 />
Result

Ex - 4 : Applying XML Drawable as background

Step 1: Creating Android XML file in Drawable folder.

In res/drawable/round_corner.xml 

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

    <corners android:radius="8dp" />

    <solid android:color="#0F0" />

    <stroke
        android:width="1dp"
        android:color="#F00" />

    <padding
        android:bottom="8dp"
        android:left="8dp"
        android:right="8dp"
        android:top="8dp" />

</shape>
Step 3: In your layout file res/layout/your_filename.xml 

<Button
        android:id="@+id/btnSubmit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Submit"
        android:background="@drawable/round_corner"
        
 />
Result

Ex - 5 : Createing Transparent Button

Step 1:- In res/drawable/round_corner_transparent_btn.xml

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

   <item android:state_pressed="true"><shape android:shape="rectangle">
            <corners android:radius="100dp" />

            <solid android:color="#AA000000" />

            <stroke android:width="2dp" android:color="#FFF" />

            <padding android:bottom="8dp" android:left="8dp" android:right="8dp" android:top="8dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#77000000" />

            <stroke android:width="1dp" android:color="#FFF" />

            <corners android:radius="100dp" />

            <padding android:bottom="8dp" android:left="8dp" android:right="8dp" android:top="8dp" />
        </shape>
     </item>

</selector>
Step 2:- In res/layout/your_filename.xml 

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

    <Button
        android:id="@+id/bntLogin"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_margin="75dp"
       android:background="@drawable/round_corner_transparent_btn"
        android:text="LOGIN"
        android:textColor="#FFF"
        android:textStyle="bold" />
    <Button
        android:id="@+id/bntReg"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="75dp"
        android:layout_marginRight="75dp"
         android:background="@drawable/round_corner_transparent_btn"
        android:text="REGISTRATION"
        android:textColor="#FFF"
        android:textStyle="bold" />

</LinearLayout>