Search code examples
androidmaterial-designfloating-action-buttonandroid-motionlayout

Motion layout Material design Expanded Button bug


I have an app with an expanded button implemented.

The button shrinks and expands perfectly fine in constraint layout or any other layout except in motion layout.

In which the button does not get expanded after shrink and in the extended state when the state of the button change to shrink on the click of a button then the text gets disappears but the size remains the same.

Version of material design link "implementation 'com.google.android.material:material:1.3.0-beta01'"

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
        android:id="@+id/btn_call_helpline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/dimen_20dp"
        android:text="@string/txt_emergency"
        android:textColor="@color/color_white"
        app:backgroundTint="@color/red"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:cornerRadius="@dimen/dimen_20dp"
        app:elevation="@dimen/dimen_10dp"
        app:icon="@drawable/ic_baseline_call_24"
        app:iconTint="@color/color_white"
        app:rippleColor="@color/color_white" />

I have verified the code and it does not have any such constraint that prevents shrinking and expanding.


Solution

  • The FAB seems to be having trouble with being measured twice. (motionLayout needs to do that)

    A Simple work around is to wrap the fab in a container Like linearLayout put the LinearLayout in MotionLayout

     <LinearLayout
       android:id="@+id/fabwrap"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_marginBottom="20dp"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintBottom_toBottomOf="parent"
       >
    
       <com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    
        android:text="hello"
        android:textColor="@color/white"
        app:backgroundTint="#F00"
        app:icon="@drawable/ic_battery"/>
       </LinearLayout>