How to create a floating action button (FAB) in android, using AppCompat v21?
There is no longer a need for creating your own FAB nor using a third party library, it was included in AppCompat 22.
https://developer.android.com/reference/android/support/design/widget/FloatingActionButton.html
Just add the new support library called design in in your gradle-file:
compile 'com.android.support:design:22.2.0'
...and you are good to go:
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="16dp"
android:clickable="true"
android:src="@drawable/ic_happy_image" />
Android L - Floating Action Button (FAB)
UPDATE: there's now an official widget for FAB: FloatingActionButton, see Gabriele Mariotti reply for full information.
According to Adam Powell and Chet Haase they didn't create a widget for the FAB button cause it's a very easy component to reproduce.
There was a question in the Google IO 2014 speech "Google I/O 2014 - Material science: Developing Android applications with material design", at the end of the speech (at about 37:50) there was exactly that question, you can hear it here:
https://www.youtube.com/watch?v=lSH9aKXjgt8#t=2280
Chet Haase says there's a RoundedBitmapDrawable (I didn't check if that's the name) that should already do the job of defining the Outline.
But you can do it with your own drawable, set an Elevation to it and define an circle Outline programmatically.
This should give you the round button with shadow on L release.
But I think You'll have to build the Shadow pre-L on your own.
I should check the code for CardView to see how it reproduce the shadow pre-L. I'll probably do that, but do not have time now. If no one pops in with the details I'll do it after I've found the time to go and check it up.
EDIT:
Gabriele Mariotti (see his answer below, thank you) added some code to show you how to do it.
Thanks to @shomeser comments, he wrote a library to make the fab button:
https://github.com/shamanland/floating-action-button
To use it:
dependencies {
compile 'com.shamanland:fab:0.0.3'
}
You can also read his answer to another question: How can I add the new "Floating Action Button" between two widgets/layouts
How can I add the new Floating Action Button between two widgets/layouts
Best practice:
- Add
compile 'com.android.support:design:25.0.1'
to gradle file - Use
CoordinatorLayout
as root view. - Add
layout_anchor
to the FAB and set it to the top view - Add
layout_anchorGravity
to the FAB and set it to:bottom|right|end
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="@+id/viewA"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.6"
android:background="@android:color/holo_purple"
android:orientation="horizontal"/>
<LinearLayout
android:id="@+id/viewB"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.4"
android:background="@android:color/holo_orange_light"
android:orientation="horizontal"/>
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:clickable="true"
android:src="@drawable/ic_done"
app:layout_anchor="@id/viewA"
app:layout_anchorGravity="bottom|right|end"/>
</android.support.design.widget.CoordinatorLayout>
Related Topics
Is There a Faster Way to Decode HTML Characters to a String Than HTML.Fromhtml()
Startactivityforresult from Activitygroup
Android - Expandable Textview with Animation
Running Google Map Application on Android Emulator
Cordova "Hello World" App Won't Display
Fcm Remote Notifications Payload for iOS and Android
Eclipse Indexer Errors When Using Stl with Android Ndk
Couldn't Get Connection Factory Client - Fighting with Google Maps
Difference Between <Supports-Screens> and <Compatible-Screens> on Android
Get Font Scaling Factor to Calculate the Fontsize
Android Input Connection Error
Android 4.3 and Phonegap, Cant Tap Link
When Should I Recycle a Bitmap Using Lrucache
Android Clickablespan Not Calling Onclick
How to Compile Ffmpeg-2.2.2 on Windows with Cygwin and Android Ndk R9C