{"id":1373,"date":"2023-05-16T11:26:15","date_gmt":"2023-05-16T11:26:15","guid":{"rendered":"https:\/\/www.sysgeeker.com\/blog\/?p=1373"},"modified":"2023-05-16T11:28:45","modified_gmt":"2023-05-16T11:28:45","slug":"how-to-add-floating-action-button-in-android","status":"publish","type":"post","link":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html","title":{"rendered":"How to Add Floating Action Button in Android"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_31 counter-hierarchy counter-disc\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" style=\"display: none;\"><label for=\"item\" aria-label=\"Table of Content\"><i class=\"ez-toc-glyphicon ez-toc-icon-toggle\"><\/i><\/label><input type=\"checkbox\" id=\"item\"><\/a><\/span><\/div>\n<nav><ul class=\"ez-toc-list ez-toc-list-level-1\"><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Video_Tutorial\" title=\"Video Tutorial:\">Video Tutorial:<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Whats_Needed\" title=\"What&#8217;s Needed\">What&#8217;s Needed<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#What_requires_your_focus\" title=\"What requires your focus?\">What requires your focus?<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Method_1_Using_the_Design_Support_Library\" title=\"Method 1: Using the Design Support Library\">Method 1: Using the Design Support Library<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Method_2_Using_the_FloatingActionButton_Component\" title=\"Method 2: Using the FloatingActionButton Component\">Method 2: Using the FloatingActionButton Component<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Method_3_Creating_a_Custom_FAB\" title=\"Method 3: Creating a Custom FAB\">Method 3: Creating a Custom FAB<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Why_Cant_I_Add_a_FAB_to_My_Android_Application\" title=\"Why Can&#8217;t I Add a FAB to My Android Application?\">Why Can&#8217;t I Add a FAB to My Android Application?<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#Implications_and_Recommendations\" title=\"Implications and Recommendations\">Implications and Recommendations<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#FAQs\" title=\"FAQs\">FAQs<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\/#In_Conclusion\" title=\"In Conclusion\">In Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<p>Floating Action Button (FAB) is a popular user interface component in Android applications. It is a circular button that appears to be floating above the UI and is used to initiate an action. FABs have become the standard way to initiate a primary action in an application. <\/p>\n<p>There are several ways to add FABs in Android applications. In this article, we will discuss the most common ways to add a FAB to an Android application. We will also discuss the pros and cons of each method.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Video_Tutorial\"><\/span>Video Tutorial:<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<lite-youtube videoid=\"cASXtRa6yDc\" playlabel=\"Play: Keynote (Google I\/O '18)\"><\/lite-youtube>\n<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Whats_Needed\"><\/span>What&#8217;s Needed<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>To add a FAB to your Android application, you will need:<\/p>\n<p>&#8211; Android Studio<br \/>\n&#8211; A basic understanding of Android development<br \/>\n&#8211; A layout for your application<\/p>\n<h2><span class=\"ez-toc-section\" id=\"What_requires_your_focus\"><\/span>What requires your focus?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Before adding a FAB to your Android application, consider the following:<\/p>\n<p>&#8211; The position of the FAB on the screen. You want to make sure that the FAB is easily accessible to the user.<br \/>\n&#8211; The color scheme of the FAB. You want to make sure that the FAB is visible and stands out from the rest of the UI.<br \/>\n&#8211; The action that the FAB will initiate. You want to make sure that the action is relevant and important to the user.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Method_1_Using_the_Design_Support_Library\"><\/span>Method 1: Using the Design Support Library<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>The Design Support Library is a library that provides a set of UI components for Android applications. It includes a FAB that can be easily added to your Android application.<\/p>\n<p>Steps:<br \/>\n1. Open Android Studio and create a new project<br \/>\n2. Open the app\\build.gradle file and add the following dependencies to the dependencies block:<\/p>\n<p>implementation &#8216;com.android.support:design:28.0.0&#8217;<\/p>\n<p>3. Open the layout file for your activity and add the following code to the XML layout:<\/p>\n<p><a target=\"_blank\"ndroid.support.design.widget.FloatingActionButton\nandroid:id=\"@+id\/myFAB\"\nandroid:layout_width=\"wrap_content\"\nandroid:layout_height=\"wrap_content\"\nandroid:layout_alignParentBottom=\"true\"\nandroid:layout_alignParentEnd=\"true\"\nandroid:layout_margin=\"@dimen\/fab_margin\"\nandroid:src=\"@drawable\/ic_add\" \/><\/p>\n<p>4. In your activity&#8217;s Java file, add the following code to initialize the FAB:<\/p>\n<p>FloatingActionButton myFAB = findViewById(R.id.myFAB);<br \/>\nmyFAB.setOnClickListener(new View.OnClickListener() {<br \/>\n    @Override<br \/>\n    public void onClick(View v) {<br \/>\n        \/\/ Action to be performed on FAB click<br \/>\n    }<br \/>\n});<\/p>\n<p>Pros:<br \/>\n&#8211; Easy to add FAB to your application<br \/>\n&#8211; Design Support Library includes other useful UI components<\/p>\n<p>Cons:<br \/>\n&#8211; Adds an extra dependency to your project<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Method_2_Using_the_FloatingActionButton_Component\"><\/span>Method 2: Using the FloatingActionButton Component<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>The FloatingActionButton component is a UI component provided by the Android framework. It can be easily added to your Android application.<\/p>\n<p>Steps:<br \/>\n1. Open Android Studio and create a new project<br \/>\n2. Open the layout file for your activity and add the following code to the XML layout:<br \/>\n<a target=\"_blank\"ndroid.support.design.widget.FloatingActionButton\nandroid:id=\"@+id\/myFAB\"\nandroid:layout_width=\"wrap_content\"\nandroid:layout_height=\"wrap_content\"\nandroid:layout_alignParentBottom=\"true\"\nandroid:layout_alignParentEnd=\"true\"\nandroid:layout_margin=\"@dimen\/fab_margin\"\nandroid:src=\"@drawable\/ic_add\" \/><\/p>\n<p>3. In your activity&#8217;s Java file, add the following code to initialize the FAB:<br \/>\nFloatingActionButton myFAB = findViewById(R.id.myFAB);<br \/>\nmyFAB.setOnClickListener(new View.OnClickListener() {<br \/>\n    @Override<br \/>\n    public void onClick(View v) {<br \/>\n        \/\/ Action to be performed on FAB click<br \/>\n    }<br \/>\n});<\/p>\n<p>Pros:<br \/>\n&#8211; Easy to add FAB to your application<br \/>\n&#8211; No extra dependencies<\/p>\n<p>Cons:<br \/>\n&#8211; No other useful UI components provided<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Method_3_Creating_a_Custom_FAB\"><\/span>Method 3: Creating a Custom FAB<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Creating a custom FAB allows you to have more control over the design and behavior of the FAB.<\/p>\n<p>Steps:<br \/>\n1. Open Android Studio and create a new project<br \/>\n2. Open the layout file for your activity and add the following code to the XML layout:<br \/>\n\"<strong>`<br \/>\n<ImageView\nandroid:id=\"@+id\/myFAB\"\nandroid:layout_width=\"wrap_content\"\nandroid:layout_height=\"wrap_content\"\nandroid:layout_alignParentBottom=\"true\"\nandroid:layout_alignParentEnd=\"true\"\nandroid:layout_marginBottom=\"@dimen\/fab_margin\"\nandroid:layout_marginEnd=\"@dimen\/fab_margin\"\nandroid:src=\"@drawable\/my_fab_background\"\nandroid:clickable=\"true\" \/><br \/>\n3. In your activity&#8217;s Java file, add the following code to initialize the FAB:<br \/>\nImageView myFAB = findViewById(R.id.myFAB);<br \/>\nmyFAB.setOnClickListener(new View.OnClickListener() {<br \/>\n    @Override<br \/>\n    public void onClick(View v) {<br \/>\n        \/\/ Action to be performed on FAB click<br \/>\n    }<br \/>\n});<\/p>\n<p>Pros:<br \/>\n&#8211; Full control over design and behavior of the FAB<\/p>\n<p>Cons:<br \/>\n&#8211; Requires more time and effort to create the custom FAB<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Why_Cant_I_Add_a_FAB_to_My_Android_Application\"><\/span>Why Can&#8217;t I Add a FAB to My Android Application?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>There are some common reasons why you might not be able to add a FAB to your Android application:<\/p>\n<p>1. Dependency issues &#8211; If you are using an older version of Android Studio or the Android SDK, you may not have access to the Design Support Library, which includes the FAB component.<\/p>\n<p>Fix: Upgrade your Android Studio and SDK to the latest version.<\/p>\n<p>2. XML Layout issues &#8211; If your XML layout is not properly configured, the FAB may not appear on the UI.<\/p>\n<p>Fix: Ensure that you have properly added the FAB to your XML layout and that it is properly aligned with the other UI components.<\/p>\n<p>3. Java code issues &#8211; If your Java code is not properly configured, the FAB may not behave as expected.<\/p>\n<p>Fix: Ensure that you have properly initialized the FAB in your Java code and that the onClickListener is properly implemented.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Implications_and_Recommendations\"><\/span>Implications and Recommendations<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Adding a FAB to your Android application can improve the user experience by making it easier for users to initiate an action. However, it is important to consider the position, color, and action of the FAB to ensure that it is relevant and important to the user.<\/p>\n<p>It is recommended to use the Design Support Library or the FloatingActionButton component to add a FAB to your Android application. If you require more control over the design and behavior of the FAB, consider creating a custom FAB.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"FAQs\"><\/span>FAQs<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h4>Q: Can I change the color of the FAB?<\/h4>\n<p>A: Yes, you can change the color of the FAB by modifying the background color property in the XML layout.<\/p>\n<h4>Q: Can I change the icon of the FAB?<\/h4>\n<p>A: Yes, you can change the icon of the FAB by modifying the src property in the XML layout.<\/p>\n<h4>Q: Can I add text to the FAB?<\/h4>\n<p>A: No, the FAB is designed to be a simple icon button and does not allow for text.<\/p>\n<h4>Q: Can I add animations to the FAB?<\/h4>\n<p>A: Yes, you can add animations to the FAB using the Animation API in Android.<\/p>\n<h4>Q: Can I disable the FAB?<\/h4>\n<p>A: Yes, you can disable the FAB by setting the clickable property to false in the XML layout or by using the setClickable() method in the Java code.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"In_Conclusion\"><\/span>In Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Adding a FAB to your Android application can improve the user experience by making it easier for users to initiate an action. There are several ways to add a FAB to your Android application, including using the Design Support Library, the FloatingActionButton component, or creating a custom FAB. It is recommended to consider the position, color, and action of the FAB to ensure that it is relevant and important to the user.<script type=\"application\/ld+json\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@type\":\"FAQPage\",\"mainEntity\":[{\"@type\":\"Question\",\"name\":\"Q: Can I change the color of the FAB?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\\nA: Yes, you can change the color of the FAB by modifying the background color property in the XML layout.\\n\\n\"}},{\"@type\":\"Question\",\"name\":\"Q: Can I change the icon of the FAB?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\\nA: Yes, you can change the icon of the FAB by modifying the src property in the XML layout.\\n\\n\"}},{\"@type\":\"Question\",\"name\":\"Q: Can I add text to the FAB?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\\nA: No, the FAB is designed to be a simple icon button and does not allow for text.\\n\\n\"}},{\"@type\":\"Question\",\"name\":\"Q: Can I add animations to the FAB?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\\nA: Yes, you can add animations to the FAB using the Animation API in Android.\\n\\n\"}},{\"@type\":\"Question\",\"name\":\"Q: Can I disable the FAB?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\\nA: Yes, you can disable the FAB by setting the clickable property to false in the XML layout or by using the setClickable() method in the Java code.\\n\\n\\n\\nAdding a FAB to your Android application can improve the user experience by making it easier for users to initiate an action. There are several ways to add a FAB to your Android application, including using the Design Support Library, the FloatingActionButton component, or creating a custom FAB. It is recommended to consider the position, color, and action of the FAB to ensure that it is relevant and important to the user.\"}}]}<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Floating Action Button (FAB) is a popular user interface component in Android applications. It is a circular button that appears to be floating above the UI and is used to initiate an action. FABs have become the standard way to initiate a primary action in an application. There are several ways to add FABs in [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[3],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Add Floating Action Button in Android<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Add Floating Action Button in Android\" \/>\n<meta property=\"og:description\" content=\"Floating Action Button (FAB) is a popular user interface component in Android applications. It is a circular button that appears to be floating above the UI and is used to initiate an action. FABs have become the standard way to initiate a primary action in an application. There are several ways to add FABs in [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\" \/>\n<meta property=\"og:site_name\" content=\"SYSGEEKER\" \/>\n<meta property=\"article:published_time\" content=\"2023-05-16T11:26:15+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-05-16T11:28:45+00:00\" \/>\n<meta name=\"author\" content=\"Ethan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ethan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#organization\",\"name\":\"SYSGEEKER\",\"url\":\"https:\/\/www.sysgeeker.com\/blog\/\",\"sameAs\":[],\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.sysgeeker.com\/blog\/wp-content\/uploads\/2024\/03\/logo-1.png\",\"contentUrl\":\"https:\/\/www.sysgeeker.com\/blog\/wp-content\/uploads\/2024\/03\/logo-1.png\",\"width\":27,\"height\":32,\"caption\":\"SYSGEEKER\"},\"image\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#website\",\"url\":\"https:\/\/www.sysgeeker.com\/blog\/\",\"name\":\"SYSGEEKER\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.sysgeeker.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\",\"url\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\",\"name\":\"How to Add Floating Action Button in Android\",\"isPartOf\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#website\"},\"datePublished\":\"2023-05-16T11:26:15+00:00\",\"dateModified\":\"2023-05-16T11:28:45+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.sysgeeker.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Add Floating Action Button in Android\"}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\"},\"author\":{\"name\":\"Ethan\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/664e46503e85d8c801422c31e9a06f02\"},\"headline\":\"How to Add Floating Action Button in Android\",\"datePublished\":\"2023-05-16T11:26:15+00:00\",\"dateModified\":\"2023-05-16T11:28:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html\"},\"wordCount\":1034,\"publisher\":{\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#organization\"},\"articleSection\":[\"Android\"],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/664e46503e85d8c801422c31e9a06f02\",\"name\":\"Ethan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/76ba51202f70d3d00fe8ba074bfe4f5c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/76ba51202f70d3d00fe8ba074bfe4f5c?s=96&d=mm&r=g\",\"caption\":\"Ethan\"},\"url\":\"https:\/\/www.sysgeeker.com\/blog\/author\/ethan\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Add Floating Action Button in Android","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html","og_locale":"en_US","og_type":"article","og_title":"How to Add Floating Action Button in Android","og_description":"Floating Action Button (FAB) is a popular user interface component in Android applications. It is a circular button that appears to be floating above the UI and is used to initiate an action. FABs have become the standard way to initiate a primary action in an application. There are several ways to add FABs in [&hellip;]","og_url":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html","og_site_name":"SYSGEEKER","article_published_time":"2023-05-16T11:26:15+00:00","article_modified_time":"2023-05-16T11:28:45+00:00","author":"Ethan","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Ethan","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Organization","@id":"https:\/\/www.sysgeeker.com\/blog\/#organization","name":"SYSGEEKER","url":"https:\/\/www.sysgeeker.com\/blog\/","sameAs":[],"logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.sysgeeker.com\/blog\/wp-content\/uploads\/2024\/03\/logo-1.png","contentUrl":"https:\/\/www.sysgeeker.com\/blog\/wp-content\/uploads\/2024\/03\/logo-1.png","width":27,"height":32,"caption":"SYSGEEKER"},"image":{"@id":"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"WebSite","@id":"https:\/\/www.sysgeeker.com\/blog\/#website","url":"https:\/\/www.sysgeeker.com\/blog\/","name":"SYSGEEKER","description":"","publisher":{"@id":"https:\/\/www.sysgeeker.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.sysgeeker.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html","url":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html","name":"How to Add Floating Action Button in Android","isPartOf":{"@id":"https:\/\/www.sysgeeker.com\/blog\/#website"},"datePublished":"2023-05-16T11:26:15+00:00","dateModified":"2023-05-16T11:28:45+00:00","breadcrumb":{"@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.sysgeeker.com\/blog"},{"@type":"ListItem","position":2,"name":"How to Add Floating Action Button in Android"}]},{"@type":"Article","@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html#article","isPartOf":{"@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html"},"author":{"name":"Ethan","@id":"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/664e46503e85d8c801422c31e9a06f02"},"headline":"How to Add Floating Action Button in Android","datePublished":"2023-05-16T11:26:15+00:00","dateModified":"2023-05-16T11:28:45+00:00","mainEntityOfPage":{"@id":"https:\/\/www.sysgeeker.com\/blog\/how-to-add-floating-action-button-in-android.html"},"wordCount":1034,"publisher":{"@id":"https:\/\/www.sysgeeker.com\/blog\/#organization"},"articleSection":["Android"],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/664e46503e85d8c801422c31e9a06f02","name":"Ethan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.sysgeeker.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/76ba51202f70d3d00fe8ba074bfe4f5c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/76ba51202f70d3d00fe8ba074bfe4f5c?s=96&d=mm&r=g","caption":"Ethan"},"url":"https:\/\/www.sysgeeker.com\/blog\/author\/ethan"}]}},"_links":{"self":[{"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/posts\/1373"}],"collection":[{"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/comments?post=1373"}],"version-history":[{"count":2,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/posts\/1373\/revisions"}],"predecessor-version":[{"id":1376,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/posts\/1373\/revisions\/1376"}],"wp:attachment":[{"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/media?parent=1373"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/categories?post=1373"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sysgeeker.com\/blog\/wp-json\/wp\/v2\/tags?post=1373"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}