0

In a word game for Android I show a floating action button with "Play" icon, when a valid word is at the game board:

mFab.setVisibility(canPlay ? View.VISIBLE : View.GONE);

However when I hide it, there is a hole left in the bottom app bar:

screenshot

The theme of my app is Theme.MaterialComponents.Light.NoActionBar and the coordinator layout with:

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomAppBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    style="@style/Widget.MaterialComponents.BottomAppBar.Colored"
    app:navigationIcon="@drawable/ic_baseline_keyboard_arrow_up_24"
    app:collapseIcon="@drawable/ic_baseline_keyboard_arrow_down_24"
    app:fabAlignmentMode="end">

    <TextView
        android:id="@+id/expireText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#fff"
        android:textAppearance="@style/Base.TextAppearance.AppCompat.Title" />

</com.google.android.material.bottomappbar.BottomAppBar>

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:visibility="gone"
    app:srcCompat="@drawable/ic_baseline_play_arrow_24"
    app:layout_anchor="@id/bottomAppBar"
    android:contentDescription="@string/play_words" />

How to remove this cardle, i.e. get the bottom app bar rectangular again, when the FAB is hidden?

Alexander Farber
  • 21,519
  • 75
  • 241
  • 416
  • 1
    Your code looks OK, couldn't reproduce it in bare-bone project – Zain Sep 07 '22 at 22:36
  • 1
    You don't have that hole in your test project? I have coordinator layout (in the fragment) embedded in another coordinator layout (of the main activity), maybe that is the reason? – Alexander Farber Sep 08 '22 at 07:43
  • 1
    Probably this nested coordinator layouts could be a reaon – Zain Sep 08 '22 at 11:55

1 Answers1

1

If you want to hide the bottomAppBar cradlle , you should call the hide() function of FloatingActionButton to hide the floating button instead of setting the visibility to GONE. As your FloatingActionButton is mFab , so call as follows ..

mFab.hide()
thelearner
  • 46
  • 3