Theming Floating Action Buttons in Android with Example
Last Updated :
15 Jul, 2025
Prerequisite:
Android application developers want to seek the attention of the users by customizing and theming the android application widgets and keep more traffic of customers only by the design of the application. In this article, it has been discussed theming one of the most important UI elements that is Floating Action Buttons (extended as well as normal). Below are some sample images of Theming Floating Action Buttons.
Steps for Creating Theming Floating Action Buttons
Step 1: Create an Empty Activity Android Studio Project
Step 2: Add a dependency to the app level Gradle file.
- Here we are using the Floating action button which is designed and developed by Google Material Design Team.
- Add the dependency in the build.gradle(app) file as:
implementation ‘com.google.android.material:material:1.3.0-alpha02’
- Make sure that add the dependency to the app level Gradle file. After adding the dependency you need to click on the “Sync Now” button which appears at the top right corner of the Android Studio IDE.
- When you click on the Sync Now button make sure that you are connected to the network so that it can download the required files.
- Refer the below image if you can’t get the steps mentioned above or if you can’t locate the app level Gradle file:
Step 3: Change the base application theme in the styles.xml file
- The theme needs to be changed as the ExtendedFloating action button is the child class of the Google Material Design Buttons. So it needs the MaterialComponent theme to be applied to the Base theme of the application. Otherwise, the app will crash immediately as soon as we launch the application.
- You may refer to this article: Material Design Buttons in Android with Example, as the ExtendedMaterial design button, is child class of the Material design buttons. The article says, the advantages of having Material design buttons, and why the theme needs to be changed.
- Go to app -> src -> main -> res -> values -> styles.xml and change the base application theme. The MaterialComponents contains various action bar theme styles, one may invoke any of the MaterialComponents action bar theme styles, except AppCompat styles. Below is the code for the styles.xml file.
XML
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
<!-- Customize your theme here -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
If you are unable to get the things in the step mentioned above you may refer to this image.
Step 4: Import some of the vector icons in the drawable folder
- In this case, simple add vector, add alarm, vector, add person vector icons are imported for demonstration purpose.
- To import any vector in the project one needs to right-click on the drawable folder -> New -> Vector Asset.
- A new pop window will be opened and choose any vector you want by clicking on the Clip Art button.
- You can refer to the following image to how to open the vector asset selector.
- You may refer the following image to how to locate the Clip Art button and choose the vectors.
Step 5: Working with the activity_main.xml file
- Now in the activity_main.xml file, add a normal Floating Action Button and an Extended Floating Action Button. Make sure to use the ConstraintLayout.
- Invoke both of the Floating Action Button, so that it can be seen how these both buttons changes after manipulating the styles.xml file.
- Invoke the following code to add both Floating Action Buttons:
XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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"
tools:ignore="HardcodedText">
<!--Google material normal Floating Action Button-->
<!--one needs to keep the margin of 16dp from the screen to button-->
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginBottom="16dp"
android:src="@drawable/ic_add_black_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<!--Google material Extended Floating Action Button-->
<!--one needs to keep the margin of 16dp from the screen to button-->
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:text="Actions"
app:icon="@drawable/ic_add_black_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
After invoking the code, the following UI is produced:
- To change the background color of both the FABs invoke the following attribute while defining these two of the FABs in the activity_main.xml file (add backgroundTint manually because all FAB will be applied with the default SmallComponent theme).
android:backgroundTint="@color/colorAccent"
Now let's discuss how to change the theme of both of the Floating action Buttons in a single code:
- To change the theme of both FABs we need to override the default theme that is SmallComponent theme in the styles.xml file:
XML
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<!--to do the changes in the corner, the cornerFamily
attribute is the part of the SmallComponent-->
<!--so we need to override the shapeAppearanceSmallComponent-->
<!--which is the default theme applied for all of the
Google MDC buttons it may be FAB or MDC Buttons-->
<item name="shapeAppearanceSmallComponent">@style/ShapeAppearance.App.SmallComponent</item>
</style>
<style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
<item name="cornerFamily">cut</item>
</style>
</resources>
Output: Run on Emulator (after making changes to styles.xml):
- One can observe that in the above code the "cornerFamily" attribute is invoked as "cut" value. So let's overriding the corner family in from the SmallComponent theme.
- The "cornerFamily" attribute contains the two values that are "cut" and "rounded". For more information on these continue reading the article on how to change the corner size with the help of "cornerSize" attribute.
- So this method of changing the theme affects all of the FAB types whether it may be an Extended or Normal FAB.
- Even it changes the shape and theme of the Google Material Design Buttons if there are implemented in the application. Please refer to this: Material Design Buttons in Android with Example.
Now let's discuss how to separately change the theme of both type of FABs:
- Now in the same styles.xml file, we need to do small changes.
- In the previous case, we have invoked the item "shapeAppearanceSmallComponent" inside the AppTheme style.
- Now we need to add the items "extendedFloatingActionButtonStyle" for Extended FAB and "floatingActionButtonStyle" for normal FAB, to differentiate the theming of both.
- Refer to the following code on how it has been done:
XML
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<!--this attribute is to change the theme of the extended FAB-->
<item name="extendedFloatingActionButtonStyle">
@style/Widget.App.ExtendedFloatingActionButton</item>
<!--this attribute is to change the theme of the normal FAB-->
<item name="floatingActionButtonStyle">@style/Widget.App.FloatingActionButton</item>
</style>
<!--changing the theme of the base application ends here-->
<!--Now changing theme of extended FAB begins from here-->
<!--make sure to change the value of the parent as
Widget.MaterialComponents.ExtendedFloatingActionButton-->
<!--as we are only changing the theme of the extended FAB-->
<!--inside Widget.App.ExtendedFloatingActionButton there are two attribute-->
<!--which are making the change of the theme of the extended FAB-->
<!--those are materialThemeOverlay and shapeAppearanceOverlay-->
<style name="Widget.App.ExtendedFloatingActionButton" parent="Widget.MaterialComponents.ExtendedFloatingActionButton">
<!--the following attribute will changes in the appearance
of the extended FAB in terms of colors-->
<item name="materialThemeOverlay">@style/myCustomThemeForExtendedFab</item>
<!--the following attribute will change in the
shape appearance of the extended FAB-->
<item name="shapeAppearanceOverlay">@style/customExtendedFAB</item>
<!--to make the code look cleaner and readable, the above
two children are implemented separately-->
</style>
<!--this style is the child of the shapeAppearanceOverlay attribute
which in turn is the child of materialThemeOverlay-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--and the cornerSize makes the cut for all 4 corners of the FAB as 10dp-->
<item name="cornerSize">10dp</item>
</style>
<!--Here no need of mentioning the parent-->
<!--because this is already the child of the
shapeAppearanceOverlay which in turn is the child-->
<!--of the Widget.App.ExtendedFloatingActionButton-->
<style name="myCustomThemeForExtendedFab" parent="">
<!--this attribute gives makes the change in the background of the FAB-->
<item name="colorSecondary">@color/colorPrimary</item>
<!--this attribute gives makes the change in the text and icon color of the FAB-->
<item name="colorOnSecondary">@android:color/white</item>
</style>
<!--Changing the theme of the extended FAB completes here-->
<!--Now changing theme of normal FAB begins from here-->
<!--make sure to change the value of the parent as
Widget.MaterialComponents.FloatingActionButton-->
<!--as we are only changing the theme of the normal FAB-->
<!--inside Widget.App.FloatingActionButton there are two attribute-->
<!--which are making the change of the theme of the normal FAB-->
<!--those are materialThemeOverlay and shapeAppearanceOverlay-->
<style name="Widget.App.FloatingActionButton" parent="Widget.MaterialComponents.FloatingActionButton">
<!--the following attribute will changes in the appearance of
the normal FAB in terms of colors-->
<item name="materialThemeOverlay">@style/myCustomThemeForNormalFab</item>
<!--the following attribute will change in the shape appearance of the normal FAB-->
<item name="shapeAppearanceOverlay">@style/customNormalFAB</item>
<!--to make the code look cleaner and readable, the above
two children are implemented separately-->
</style>
<style name="customNormalFAB">
<!--for the normal FAB the cornerFamily is given the value as the rounded-->
<!--in this case it has been done to differentiate the
themes of the normal FAB and extended FAB-->
<item name="cornerFamily">rounded</item>
<!--and the cornerSize makes rounded corner for all
4 corners of the FAB as 20dp radius-->
<item name="cornerSize">20dp</item>
</style>
<style name="myCustomThemeForNormalFab" parent="">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="colorSecondary">@android:color/holo_green_dark</item>
<!--this attribute gives makes the change in the text and icon color of the FAB-->
<item name="colorOnSecondary">@android:color/white</item>
</style>
<!--Changing the theme of the normal FAB completes here-->
</resources>
After making changes to the styles.xml file the following UI is produced:
- Now different themes are established separately for the normal FAB and extended FAB.
Note: The colors of both FABs are made different in this case, for demonstration purpose only, as this is not recommended the colors of the all FABs must be same for entire application according to material design recommendations.
Experiment with the customNormalFAB and customExtendedFAB
- Now onward experiment with the children "customNormalFAB" and "customExtendedFAB" (and remaining other things are unchanged) to make changes in the shapes of both the FABs.
- Also experiment with "cornerSizeTopRight", "cornerSizeTopLeft", "cornerSizeBottomRight" and "cornerSizeBottomLeft".
- Now make changes to both children as follows:
Example 1:
XML
<!--for Extended FAB-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">0dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">0dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
<!--for Normal FAB-->
<style name="customNormalFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">0dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">0dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Output UI will be:
Example 2:
XML
<!--for Extended FAB-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
<!--for Normal FAB-->
<style name="customNormalFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Output UI will be:
Example 3:
XML
<!--for Extended FAB-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">0dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">14dp</item>
</style>
<!--for Normal FAB-->
<style name="customNormalFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">cut</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">0dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">14dp</item>
</style>
Output UI will be:
Example 4:
XML
<!--for Extended FAB-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">rounded</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
<!--for Normal FAB-->
<style name="customNormalFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">rounded</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">0dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">14dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Output UI will be:
Example 5:
XML
<!--for Extended FAB-->
<style name="customExtendedFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">rounded</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">14dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">0dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
<!--for Normal FAB-->
<style name="customNormalFAB">
<!--for the extended FAB the cornerFamily is given the value as the cut-->
<item name="cornerFamily">rounded</item>
<!--this attribute will make changes to Top Right according to value-->
<item name="cornerSizeTopRight">14dp</item>
<!--this attribute will make changes to Top Left according to value-->
<item name="cornerSizeTopLeft">14dp</item>
<!--this attribute will make changes to Bottom Right according to value-->
<item name="cornerSizeBottomRight">0dp</item>
<!--this attribute will make changes to Bottom Left according to value-->
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Output UI will be:
Similar Reads
Android Tutorial In this Android Tutorial, we cover both basic and advanced concepts. So whether you are a fresher (graduate) or an experienced candidate with several years of Android Development experience, you can follow this Android tutorial to kick-start your journey in Android app development. Our Android Tutor
15+ min read
Basics
Introduction to Android DevelopmentAndroid operating system is the largest installed base among various mobile platforms across the globe. Hundreds of millions of mobile devices are powered by Android in more than 190 countries of the world. It conquered around 71% of the global market share by the end of 2021, and this trend is grow
5 min read
History of AndroidAndroid devices form a very essential part of a huge section of mobile phone users in today's world. With the global turmoil in the COVID-19 eras, the population has now entered a digital sphere. Android is the most used OS in smartphones during these days of transformation. But when did something l
15+ min read
Best Way to Become Android Developer – A Complete RoadmapAndroid is an open-source operating system, based on the Linux kernel and used in mobile devices like smartphones, tablets, etc. Further, it was developed for smartwatches and Android TV. Each of them has a specialized interface. Android has been one of the best-selling OS for smartphones. Android O
7 min read
Android Development Prerequisites [2025] - Things to Learn Before Android DevelopmentHave you ever wondered how your phone's apps—such as those for making calls, playing games, or checking the weather—are created? Android Development is the procedure used to generate these apps. The Android operating system powers the majority of phones, just like an engine powers a car. To ensure t
8 min read
Android App Development Fundamentals for BeginnersAndroid is an operating system that is built basically for Mobile phones. It is based on the Linux Kernel and other open-source software and is developed by Google. It is used for touchscreen mobile devices such as smartphones and tablets. But nowadays these are used in Android Auto cars, TV, watche
6 min read
Android ArchitectureAndroid architecture contains a different number of components to support any Android device's needs. Android software contains an open-source Linux Kernel having a collection of a number of C/C++ libraries which are exposed through application framework services. Among all the components Linux Kern
5 min read
Android System ArchitectureThe Android software stack generally consists of a Linux kernel and a collection of C/C++ libraries that are exposed through an application framework that provides services, and management of the applications and run time. Linux KernelAndroid was created on the open-source kernel of Linux. One main
3 min read
Android Boot ProcessBooting Process In computing, booting is starting up a computer or computer appliance until it can be used. It can be initiated by hardware such as a button press, or by software command. After the power is switched on the computer is relatively dumb, and can read only part of its storage called Rea
4 min read
Difference between Java and Kotlin in Android with ExamplesKotlin KOTLIN is a cross platform, statically types, general purpose programming language with type inference. KOTLIN is designed to interoperate fully with java but type inference allows its syntax to be more concise.KOTLIN is sponsored by JetBrains and Google through the Kotlin Foundation. Java JA
3 min read
Interesting Facts About AndroidAndroid is a Mobile Operating System that was released on 23, September 2008. Android is free, open-source operating system and is based on modified version of Linux kernel. Open Handset Alliance (OHA) developed the Android and Google commercially sponsored it. It is mainly designed for touchscreen
3 min read
Software Setup and Configuration
Android Studio Tutorial It is stated that "If you give me six hours to chop down a tree then I will spend the first four hours in sharpening the axe". So in the Android Development World if we consider Android Development as the tree then Android Studio should be the axe. Yes, if you are starting Android Development then y
9 min read
File Structure & Components
Core Topics
How Does Android App Work?Developing an android application involves several processes that happen in a sequential manner. After writing the source code files, when developers click the Run button on the Android studio, plenty of operations and process starts at the backend. Every operation happening in the background is a c
7 min read
Activity Lifecycle in Android with Demo AppIn Android, an activity is referred to as one screen in an application. It is very similar to a single window of any desktop application. An Android app consists of one or more screens or activities. Each activity goes through various stages or a lifecycle and is managed by activity stacks. So when
9 min read
Introduction to GradleGradle is an open-source construction tool that is capable of controlling the development tasks with compilation and packaging, including testing, deployment and publishing. It is an automation tool that is based on Apache Ant and Apache Maven. This tool is capable of developing applications with in
4 min read
What is Context in Android?Android Applications are popular for a long time and it is evolving to a greater level as users' expectations are that they need to view the data that they want in an easier smoother view. Hence, the android developers must know the important terminologies before developing the app. In Android Progr
9 min read
Bundle in Android with ExampleIt is known that Intents are used in Android to pass to the data from one activity to another. But there is one another way, that can be used to pass the data from one activity to another in a better way and less code space ie by using Bundles in Android. Android Bundles are generally used for passi
6 min read
Activity State Changes In Android with ExamplePrerequisites: Activity lifecycle in android As it is known that every Android app has at least one activity associated with it. When the application begins to execute and runs, there are various state changes that activity goes through. Different events some user-triggered and some system triggered
6 min read
Processes and Application Lifecycle in AndroidAs an android developer, if one does not know the application lifecycle of android application or does not have in-depth knowledge about it, there are very high chances that the application will not have a good user experience. Not having proper knowledge of the application lifecycle will not affect
7 min read
Desugaring in AndroidGoogle has officially announced Kotlin as a recommended language for Android Development and that's why so many developers are switching from Java to Kotlin for Android development. So day by day new APIs are been introduced in Android by the Google Team and which are available in newer versions of
4 min read
Difference Between AndroidX and Android Support LibrariesSupport library packages in Android are a set of code libraries whose prime purpose is to provide backward-compatibility to the code and Android API framework. In the real world, there is a strong possibility that an application that is developed on the latest Android version is used on an older ver
3 min read
Memory Leaks in AndroidA memory leak is basically a failure of releasing unused objects from the memory. As a developer one does not need to think about memory allocation, memory deallocation, and garbage collection. All of these are the automatic process that the garbage collector does by itself, but the situation become
7 min read
Layout & View
Layouts in Android UI DesignLayout Managers (or simply layouts) are said to be extensions of the ViewGroup class. They are used to set the position of child Views within the UI we are building. We can nest the layouts, and therefore we can create arbitrarily complex UIs using a combination of layouts.There is a number of layou
3 min read
Android UI LayoutsLayouts in Android define the user interface and hold UI controls or widgets that appear on the screen of an application. Every Android application consists of View and ViewGroup elements. Since an application contains multiple activities—each representing a separate screen—every activity has multip
5 min read
LinearLayout and its Important Attributes with Examples in AndroidLinearLayout is one of the most basic layouts in android studio, that arranges multiple sub-views (UI elements) sequentially in a single direction i.e. horizontal or vertical manner by specifying the android:orientation attribute. If one applies android:orientation="vertical" then elements will be a
3 min read
Android LinearLayout in KotlinLinearLayout in Android is a ViewGroup subclass, used to arrange child view elements one by one in a singular direction either horizontally or vertically based on the orientation attribute. We can specify the linear layout orientation using the android:orientation attribute. All the child elements a
2 min read
Android RelativeLayout in KotlinRelativeLayout in Android is a ViewGroup subclass, that allows users to position child views relative to each other (e.g., view A to the right of view B) or relative to the parent (e.g., aligned to the top of the parent). Instead of using LinearLayout, we have to use RelativeLayout to design the use
4 min read
ConstraintLayout in AndroidConstraintLayout is the most advanced layout in Android that lets you create complex and responsive UIs while minimizing nested views due to its flat view hierarchy. ConstraintLayout is similar to that of other View Groups which we have seen in Android such as RelativeLayout, LinearLayout, and many
6 min read
TextView widget in Android with ExamplesWidget refers to the elements of the UI (User Interface) that help the user interact with the Android App. TextView is one of many such widgets which can be used to improve the UI of the app. TextView refers to the widget which displays some text on the screen based on the layout, size, colour, etc
5 min read
TextView in KotlinAndroid TextView is simply a view that are used to display the text to the user and optionally allow us to modify or edit it. First of all, open Kotlin project in Android Studio. Following steps are used to create Steps to Implement TextViewSteps by Step implementation for creating an application wh
3 min read
Working With the TextView in AndroidTextView in Android is one of the basic and important UI elements. This plays a very important role in the UI experience and depends on how the information is displayed to the user. This TextView widget in Android can be dynamized in various contexts. For example, if the important part of the inform
7 min read
Autosizing TextView in AndroidIf the user is giving the input and the input needs to be shown as TextView and if the user inputs the stuff which can go out of the screen, then in this case the font TextView should be decreased gradually. So, in this article, it has been discussed how the developer can reduce the size of TextView
6 min read
Button
Intent and Intent Filters
What is Intent in Android?In Android, it is quite usual for users to witness a jump from one application to another as a part of the whole process, for example, searching for a location on the browser and witnessing a direct jump into Google Maps or receiving payment links in Messages Application (SMS) and on clicking jumpin
4 min read
Implicit and Explicit Intents in Android with ExamplesPre-requisites: Android App Development Fundamentals for Beginners Guide to Install and Set up Android Studio Android | Starting with the first app/android project Android | Running your first Android app This article aims to tell about the Implicit and Explicit intents and how to use them in an and
6 min read
How to Send Data From One Activity to Second Activity in Android?This article aims to tell and show how to "Send the data from one activity to second activity using Intent" . In this example, we have two activities, activity_first which are the source activity, and activity_second which is the destination activity. We can send the data using the putExtra() method
7 min read
How to open dialer in Android through Intent?The phone dialer is an activity available with the Android operating system to call a number. Usually, such activity may or may not have an EditText, for taking the number as input, and a Call button. When the user presses the Call button, it invokes the dialer app activity. Use of 'tel:' prefix is
3 min read
Creating Multiple Screen Applications in AndroidThis article shows how to create an android application to move from one activity to another using the concept of Explicit Intents. Below are the steps for Creating a Simple Android Application to move from one activity to another activity.Step By Step ImplementationStep 1: Create a New Project in A
6 min read
How to Open Camera Through Intent and Display Captured Image in Android?The purpose of this article is to show how to open a Camera from inside an App and click the image and then display this image inside the same app. An android application has been developed in this article to achieve this. The opening of the Camera from inside our app is achieved with the help of th
6 min read
Toast & RecyclerView
Toasts for Android StudioA toast provides a simple popup message that is displayed on the current activity UI screen (e.g. Main Activity). Example: Syntax:// To get ContextContext context = getApplicationContext(); // Message to displayString text = "Toast message"; // Toast time duration, can also set manual value int dura
2 min read
What is Toast and How to Use it in Android with Examples?Pre-requisites: Android App Development Fundamentals for BeginnersGuide to Install and Set up Android StudioAndroid | Starting with the first app/android projectAndroid | Running your first Android appWhat is Toast in Android? A Toast is a feedback message. It takes a very little space for displayin
6 min read
Android Toast in KotlinA Toast is a short alert message shown on the Android screen for a short interval of time. Android Toast is a short popup notification which is used to display information when we perform any operation in our app. In this tutorial, we shall not just limit ourselves by creating a lame toast but also
3 min read
How to Change Toast font in Android?A Toast is a feedback message. It takes a very little space for displaying while overall activity is interactive and visible to the user. It disappears after a few seconds. It disappears automatically. If user wants permanent visible message, Notification can be used. Note: Toast disappears automati
3 min read
How to add a custom styled Toast in AndroidA Toast is a feedback message. It takes very little space for displaying and it is displayed on top of the main content of an activity, and only remains visible for a short time period. This article explains how to create Custom Toast messages, which has custom background, image, icon, etc, which ar
4 min read
RecyclerView in Android with ExampleRecyclerView is a ViewGroup added to the android studio as a successor of the GridView and ListView. It is an improvement on both of them and can be found in the latest v-7 support packages. It has been created to make possible construction of any lists with XML layouts as an item which can be custo
7 min read
Android | Horizontal RecyclerView with ExamplesRecycler View is a ViewGroup added to Android Studio as a successor of the GridView and ListView. It is an improvement on both of them and can be found in the latest v-7 support packages. It has been created to make possible construction of any lists with XML layouts as an item which can be customiz
4 min read
How to create a nested RecyclerView in AndroidA nested RecyclerView is an implementation of a RecyclerView within a RecyclerView. An example of such a layout can be seen in a variety of apps such as the Play Store, where the outer (parent) RecyclerView is of vertical orientation, whereas the inner (child) RecyclerViews are of horizontal orienta
5 min read
How to Create RecyclerView with Multiple ViewType in Android?RecyclerView forms a crucial part of the UI in Android app development. It is especially important to optimize memory consumption when displaying a long list of items. A RecyclerView inflates a customized list of items, which can have either similar layouts or multiple distinct layouts. Here, we dev
6 min read
RecyclerView using ListView in Android With ExampleRecyclerView is a more flexible and advanced version of ListView and GridView. RecyclerView is used for providing a limited window to a large data set, which means it is used to display a large amount of data that can be scrolled very efficiently by maintaining a limited number of Views. In Recycler
5 min read