I have the following XML code to form relation between BottomAppBar
and FloatingActionButton
.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="@+id/nav_host_fragment_activity_main"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
app:defaultNavHost="true"
app:navGraph="@navigation/mobile_navigation" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="@+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--
Workaround: android:layout_gravity="bottom" is required so that bottom bar stays at bottom
most.
-->
<com.google.android.material.bottomappbar.BottomAppBar
android:layout_gravity="bottom"
android:backgroundTint="#ffff00"
android:id="@+id/bottom_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--
Workaround: android:layout_marginEnd="16dp" is required to balance the mystery
marginStart.
-->
<!--
Workaround: app:elevation="0dp" and app:backgroundTint="@android:color/transparent" is
used due to the following reason :-
https://stackoverflow.com/questions/63518075/android-problem-in-transparent-bottom-navigation-inside-the-bottom-app-bar
-->
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_marginEnd="16dp"
app:elevation="0dp"
app:backgroundTint="@android:color/transparent"
android:id="@+id/nav_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="@menu/bottom_nav_menu" />
</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:contentDescription="@string/app_name"
android:src="@drawable/ic_android_black_24dp"
app:layout_anchor="@id/bottom_app_bar" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</LinearLayout>
This is what we are getting.
However, this isn't exactly what we wish for. We wish to remove the space/ curve/ cradle among BottomAppBar
and FloatingActionButton
.
We tried to place the following attribute in BottomAppBar
app:fabAnchorMode="embed"
The space/ curve/ cradle are no longer seen. However, the position of FloatingActionButton
also moved downward, which is not we wish for too.
How can we remove space/ curve/ cradle among BottomAppBar
and FloatingActionButton
, yet make the FloatingActionButton
position stay slightly above BottomAppBar
?
from How to remove space/ curve/ cradle among FAB and BottomAppBar?
No comments:
Post a Comment