How to center align text in Extended Floating Action Button?

user_9241727 0
Viewed 1252

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.

enter image description here

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.

material-components-android material-ui floating-action-button android-layout android
3 Answers

Please add these two lines in your ExtendedFloatingActionButton

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

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" />
user_51485640

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

user_12123310
Related