How to center align text in Extended Floating Action Button?

Question

I want to center align the text in the extended floating action button but I'm not able to do that. As you can see in the image below the text is not centrally aligned.

Here's is the code for extended floating action button:

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
        android:id="@+id/compress_start_fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:text="S"
        app:backgroundTint="?android:colorAccent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:textColor="@color/textColorPrimaryDark"
        app:layout_constraintStart_toStartOf="parent"
        android:textAlignment="center"
        />

Am I doing anything wrong? Any help will be appreciated.

Centistere

Answer 1

Please add these two lines in your ExtendedFloatingActionButton

 android:paddingStart="0dp"
 android:paddingEnd="0dp

Desirable

Also needs android:gravity="center" – Intercept

Answer 2

use like this

  <com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:gravity="center"
    android:paddingStart="0dp"
    android:paddingEnd="0dp"
    android:text="@string/ic_lin_camera" />

Warm

Answer 3

When using an ExtendedFloatingActionButton for text only, in your layout xml for the fab you can use

style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton"

or extend the above style via

<style name="extended_fab_text_only" parent="Widget.MaterialComponents.ExtendedFloatingActionButton">
    <item name="android:textAppearance">@style/myTextAppearance</item>
</style>

and you that as the style of your fab in your layout xml

style="@style/extended_fab_text_only"

Documentation: https://material.io/components/buttons-floating-action-button/android#extended-fabs Under Extended FABs > Styles:

Text-only when extended style Widget.MaterialComponents.ExtendedFloatingActionButton

Tricostate