How to create a circle button in the right bottom corner on Android 5+?

Question

Is there any standard tools or existing libraries to create a circle button like on Gmail App? enter image description here

Its called the Floating Action Button: http://stackoverflow.com/questions/24459352/how-can-i-add-the-new-floating-action-button-between-two-widgets-layouts — Morrison Chang, Jun 21 '15 at 18:03
http://stackoverflow.com/questions/30483210/is-there-a-native-component-for-the-floating-action-button-in-android-material-d/30527761#30527761 — Gabriele Mariotti, Jun 22 '15 at 20:18

Psypher · Answer 1 · 2015-06-21T18:26:09.027

In the android support design support library one of the widgets provided is the Floating Action Button, which is usually added in the bottom right corner(but need not be used only there)

A floating action button is a round button denoting a primary action on your interface. The Design library’s FloatingActionButton gives you a single consistent implementation, by default colored using the colorAccent from your theme.

To get the android design support library in your build.gradle file, add this:

compile 'com.android.support:design:22.2.0'

In your layout file"

<RelativeLayout
 ...
 xmlns:app="http://schemas.android.com/apk/res-auto">

       <android.support.design.widget.FloatingActionButton
            android:id="@+id/myFAB"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"  
            app:layout_anchor="@id/appbar"
            app:layout_anchorGravity="bottom|right|end"
            android:src="@drawable/ic_discuss"
            android:layout_margin="10dp"
            android:clickable="true"/>
</RelativeLayout>

Details of android design support library here

Also there are many other libraries providing the FAB like

score 2 · Answer 2 · edited Sep 19 '15 at 01:25

1.First important thing use Android Studio

2.Add as a dependency to your build.gradle:

dependencies {
compile 'com.melnykov:floatingactionbutton:1.3.0'
}

3. Create a layout

<ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

<com.melnykov.fab.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_margin="16dp"
        android:src="@drawable/ic_action_content_new"
        fab:fab_colorNormal="@color/primary"
        fab:fab_colorPressed="@color/primary_pressed"
        fab:fab_colorRipple="@color/ripple" />

4.Add the namespace

xmlns:fab="http://schemas.android.com/apk/res-auto"

to your layout file.

You can also Set the button type (normal or mini) via the fab_type xml attribute (default is normal):

fab:fab_type="mini"

or

fab.setType(FloatingActionButton.TYPE_MINI);

score 1 · Answer 3 · answered Jun 21 '15 at 18:10

Yes, with the new Design Support Library a default implementation of the floating action button is provided here.

In order to have access to the new FAB class you will need to add this dependency to your gradle build file.

compile 'com.android.support:design:22.2.0'

How to create a circle button in the right bottom corner on Android 5+?

3 Answers3