Android: How to change size of app:fabSize=“normal

Question

When using the new FloatingActionButton, the size is determined by app:fabSize="normal". How can I set what in dp is the size referenced by "normal"?

I tried to create values/attrs.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="app">
        <attr name="fabSize">
            <enum name="mini" value="50dp" />
            <enum name="normal" value="100dp" />
        </attr>
    </declare-styleable>
</resources>

But I get the error

"normal" in attribute "fabSize" is not a valid integer

Answer 1

• Standard Sizes

There are three options for standard FAB sizes (according to developer.android) which you can set them using app:fabSize.

1. normal: The normal sized button.
2. mini: The mini sized button.
3. auto: Size which will change based on the window size

.

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_add_black_24dp"
    app:tint="#404D54"
    app:backgroundTint="#ffd500"
    app:fabSize="normal" />

.

• Custom Sizes

To set custom FAB size you can set app:fabCustomSize. Note that android:layout_width and android:layout_height should be "wrap_content".

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_add_black_24dp"
    app:tint="#404D54"
    app:backgroundTint="#ffd500"
    app:fabCustomSize="36dp" />

Answer 2

To change Fab size and to see large image init i have made below changes in android api 28:- thew are as

    <android.support.design.widget.FloatingActionButton
    android:id="@+id/profile_imageview"
    android:layout_width="@dimen/design_fab_size_mini"
    android:layout_height="@dimen/design_fab_size_mini"
    android:layout_marginTop="10dp"
    android:src="@drawable/pin_check"
    app:borderWidth="0dp"
    app:elevation="0dp"
    app:maxImageSize="90dp" />

where in dimens.xml

<dimen name="design_fab_size_mini" tools:override="true">90dp</dimen>
<dimen name="design_fab_content_size" tools:override="true">58dp</dimen>

Answer 3

<dimen name="design_fab_size_normal">90dp</dimen>
<dimen name="design_fab_size_mini">30dp</dimen>
Set this in dimen file.

Answer 4

Just user app:fabCustomSize in xml

app:fabCustomSize="100dp"

Bingo.

Answer 5

There are two different sizes of FAB available: normal or mini

1. Normal (56dp) — This size should be used in most situations.

2. Mini (40dp) — Should only be used when there is a need for visual continuity with other components displayed on the screen.

Answer 6

I know it's not recommended, but for those that absolutely need to change the default sizes, I was able to do it by wrapping the FloatingActionButton in a LinearLayout.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:layout_centerInParent="true"
    android:orientation="horizontal" >

    <android.support.design.widget.FloatingActionButton
        android:layout_width="@dimen/custom_fab_size"
        android:layout_height="@dimen/custom_fab_size"
        app:fabSize="normal"
        android:clickable="true"
        android:src="@drawable/ic_mic_white_24dp"
        android:scaleType="center"/>
</LinearLayout>