Geek Answers Handbook

Android Bottom Bars toolbar overlapping toolbar

I am using the library for new base material tables and I have a very strange problem. Whenever I put this in my coordinator layout, it appears on top of the toolbar. Why is this happening, and how can I fix it? In addition, how can I do this so that the floating action button is above these bars and not overlapping it?

<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:context="com.marlonjones.kansei.MainActivity"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" app:elevation="0dp" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:elevation="4dp" android:background="?attr/colorPrimary"/> </android.support.design.widget.AppBarLayout> <include layout="@layout/content_main"/> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|end" android:layout_margin="@dimen/fab_margin" android:src="@drawable/ic_write" /> <com.luseen.luseenbottomnavigation.BottomNavigation.BottomNavigationView android:id="@+id/bottomNavigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" app:bnv_colored_background="true" app:bnv_with_text="false" app:bnv_shadow="true" app:bnv_tablet="false" app:bnv_viewpager_slide="true" app:bnv_active_color="@color/colorPrimary" app:bnv_active_text_size="@dimen/bottom_navigation_text_size_active" app:bnv_inactive_text_size="@dimen/bottom_navigation_text_size_inactive"/> </android.support.design.widget.CoordinatorLayout>

enter image description here

+6
source share
2 answers

One solution is to add a LinearLayout (or other Layout Managers ) inside the CoordinatorLayout

 <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:context="com.marlonjones.kansei.MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.design.widget.AppBarLayout android:layout_height="wrap_content" android:layout_width="match_parent" app:elevation="0dp" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:elevation="4dp" android:background="?attr/colorPrimary"/> </android.support.design.widget.AppBarLayout> <include layout="@layout/content_main"/> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|end" android:layout_margin="@dimen/fab_margin" android:src="@drawable/ic_write" /> <com.luseen.luseenbottomnavigation.BottomNavigation.BottomNavigationView android:id="@+id/bottomNavigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" app:bnv_colored_background="true" app:bnv_with_text="false" app:bnv_shadow="true" app:bnv_tablet="false" app:bnv_viewpager_slide="true" app:bnv_active_color="@color/colorPrimary" app:bnv_active_text_size="@dimen/bottom_navigation_text_size_active" app:bnv_inactive_text_size="@dimen/bottom_navigation_text_size_inactive"/> </LinearLayout> </android.support.design.widget.CoordinatorLayout>
0
source

Three alternative ways to try, I don't know if they work:

1 - Place the BottomNavigationView outside of the CoordinatorLayout, nesting everything in a RelativeLayout and setting the marginBottom for the CoordinatorLayout (as an example library:

android:layout_marginBottom="@dimen/bottom_navigation_height "

)

2 - Save the BottomNavigationView view inside CoordinatorLayout, but using the FrameLayout parameter (CoordinatorLayout is FrameLayout)

android:layout_gravity

instead

android:layout_alignParentBottom

(this is a RelativeLayout parameter). You should also add marginBottom to the main content.

3 - Better if it works. Save the BottomNavigationView view inside the CoordinatorLayout by removing android:layout_alignParentBottom and trying to give it a description of the BottomSheetBehavior, as the design library reports

app:behavior_peekHeight="XXdp" app:layout_behavior="android.support.design.widget.BottomSheetBehavior"

PeekHeight XX should be the height of the BottomNavigationView, you should also add marginBottom to the main content.

+3
source

More articles:


All Articles