Android Button with Example
Difficulty level : Very-Easy * Last Updated On : 26th May, 2021
A Button is a user interface that is used to perform some action when clicked or tapped. It is a very common widget in Android and developers often use it. There are 3 types of buttons.
- Button (this consists of only text on the button)
- ImageButton (this consists of only image on the button)
- Button with Image and Text (this consists of image and text both on the button)
Below is the picture showing the types of buttons in light and dark mode that are given above
The Source Code for the above output is as follows: -
To display the button on the screen xml code is used.
XML CODE : (file name - activity_main.xml)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<!-- First Button Starts -->
<Button
android:id="@+id/normalButton"
android:layout_width="match_parent"
android:layout_height="70dp"
android:text="Normal Button"
android:backgroundTint="@color/color3"
android:textColor="@color/black"
android:layout_marginTop="20dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"/>
<!-- First Button Ends -->
<!-- Second Button Starts -->
<ImageButton
android:id="@+id/imageButton"
android:layout_width="match_parent"
android:layout_height="70dp"
android:layout_marginTop="20dp"
android:backgroundTint="@color/color3"
android:layout_below="@id/normalButton"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:src="@drawable/image"
android:drawablePadding="4dp"
app:tint="@color/color4" />
<!-- Second Button Ends -->
<!-- Third Button Starts -->
<Button
android:id="@+id/imageButtonText"
android:layout_width="match_parent"
android:layout_height="70dp"
android:text="Button With Image and Text"
android:padding="10dp"
android:layout_below="@id/imageButton"
android:drawableLeft="@drawable/image"
android:drawableTint="@color/color4"
android:backgroundTint="@color/color3"
android:textColor="@color/black"
android:layout_marginTop="20dp"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"
tools:ignore="RtlHardcoded"
tools:targetApi="m" />
<!-- Third Button Ends -->
</RelativeLayout>
The colors that are used in the application or on the widget are written in the colors file of the android project.
COLORS FILE CODE : (file name - colors.xml)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="purple_200">#FFBB86FC</color>
<color name="purple_500">#FF6200EE</color>
<color name="purple_700">#FF3700B3</color>
<color name="teal_200">#FF03DAC5</color>
<color name="teal_700">#FF018786</color>
<color name="black">#FF000000</color>
<color name="white">#FFFFFFFF</color>
<color name="color1">#EE82EE</color>
<color name="color2">#FDBE3B</color>
<color name="color3">#FF4842</color>
<color name="color4">#3a52fc</color>
<color name="color5">#000000</color>
</resources>
Manifest file is generated automatically. You can view this file by clicking on the manifest option that is show the project structure image.
MANIFEST FILE CODE: (file name - manifest.xml)
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.differentandroidcodes">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.DifferentStyleButtons">
<activity android:name="com.example.differentandroidcodes.MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
OUTPUT :
Light Theme
Dark Theme
Project Structure in Android Studio
0 Comments