BottomNavigationView is visible even if view is top of it - android

I have screen with 3 main parts
toolbar
homeContaner(will host fragments of BottomNavigationView)
mainContainer (host splash screen or any screen that take full of screen)
when replace mainContainer with splash BottomNavigationView is also shown
I tried to add background color to mainContainer and found that BottomNavigationView is on Top of mainContainer
also tried to add elevation to mainContainer but got no new results
Screen shots
full code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".feature.home_Activity.HomeActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:titleTextColor="#android:color/white"/>
<FrameLayout
android:id="#+id/homeContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#id/dummy"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<View
android:id="#+id/dummy"
android:layout_width="match_parent"
android:layout_height="#dimen/_10sdp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/navigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="1dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation" />
<FrameLayout
android:id="#+id/mainContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:elevation="10dp"
android:background="#ffaaff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Wrap BottomNavigationView with LinearLayout solved the problem
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".feature.home_Activity.HomeActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent"
app:titleTextColor="#android:color/white" />
<FrameLayout
android:id="#+id/homeContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#id/dummy"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<View
android:id="#+id/dummy"
android:layout_width="match_parent"
android:layout_height="#dimen/_10sdp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/navigationContainer" />
<androidx.appcompat.widget.LinearLayoutCompat
android:id="#+id/navigationContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bn_bg"
app:elevation="1dp"
app:itemBackground="#drawable/bn_item__bg"
app:itemIconTint="#color/secondaryTextColor"
app:itemTextColor="#color/primaryTextColor"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation" />
</androidx.appcompat.widget.LinearLayoutCompat>
<FrameLayout
android:id="#+id/mainContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:elevation="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Related

how to hide bottomnavigation and app bar on scroll when app bar inside FragmentContainerView

I know we can hide bottomnavigation and app bar on scroll when both are the direct children of coordinate layout, But my issue is different, I have one home fragment and bottom view is a part of this fragment with FragmentContainerView, now my app bar inside the fragment which i am setting in container view, when i am scrolling, app bar getting scroll properly but i am not sure how to scroll bottom navigation as well,
home_fragment:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/rootFragmentContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/bottomNavigationView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemIconTint="#drawable/nav_bar_tab_color"
android:background="?android:attr/windowBackground"
app:itemTextAppearanceActive="#style/navText"
app:itemTextAppearanceInactive="#style/navText"
app:itemTextColor="#drawable/nav_bar_tab_color"
app:labelVisibilityMode="unlabeled"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/navigation_items" />
</androidx.constraintlayout.widget.ConstraintLayout>
another fragment:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/appbar"
app:layout_behavior="#string/appbar_scrolling_view_behavior" >
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvLay"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/rvProgressBar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ProgressBar
android:id="#+id/rvProgressBar"
android:visibility="gone"
android:layout_width="0dp"
android:layout_height="50dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/colorWhite"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat" >
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/twentyfour_24dp"
android:paddingBottom="#dimen/eighteen_18dp"
android:text="#string/t2"
android:gravity="center"
android:textAllCaps="true"
style="#style/text_16px_franklin_gothic_normal_" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Can some one please explain me, how to achieve it?
Have you tried to add app:layout_behavior="#string/hide_bottom_view_on_scroll_behavior" inside your BottomNavigationView? In my case, it works just fine :)
I also suggest you to use CoordinatorLayout instead of ConstraintLayout in your home_fragment.xml

Android Toolbar isn't showing up

I use drawer, bottom navigation bar and toolbar in my app.
So I put my toolbar by including layout in drawer layout .
Drawer works well by swiping, but Toolbar isn't showing up.
I think toolbar is covered by fragment,but I don't know why...
I already setSupportActionBar in MainActivity.
What's the problem??
toolbar_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="56dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#android:color/transparent"
android:id="#+id/toolbar"
>
<Button
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/ic_menu"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
<Button
android:layout_width="24dp"
android:layout_height="24dp"
android:background="#drawable/ic_search"
android:layout_marginEnd="16dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
/>
</androidx.appcompat.widget.Toolbar>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer"
android:fitsSystemWindows="true"
>
<androidx.constraintlayout.widget.ConstraintLayout
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">
<include
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/toolbar_layout"
/>
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/navigationView"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0">
</FrameLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/gray7"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:itemBackground="#color/gray7"
app:labelVisibilityMode="labeled"
android:theme="#style/Widget.BottomNavigationView"
app:itemIconTint="#drawable/menu_selector_color"
app:itemTextColor="#drawable/menu_selector_color"
app:menu="#menu/bottom_navigationbar" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="#+id/nvDrawer"
android:layout_width="304dp"
android:layout_height="match_parent"
android:layout_gravity="start"
>
<include layout="#layout/drawer_layout"/>
</com.google.android.material.navigation.NavigationView>
</androidx.drawerlayout.widget.DrawerLayout>
You are setting your FrameLayout containter from the top of the parent view
change this
app:layout_constraintTop_toTopOf="parent"
with
app:layout_constraintTop_toBottomOf="#+id/toolbar"

ConstraintLayout does not get constrained to bottom when lower subviwe gets hidden

I tried to make the title as descriptive as possible.
I have a ConstraintLayout with two LinearLayout children that have ScrollViews inside as there are a lot of stuff inside. Each child has a weight of 1. The layout has constraints to top of toolbar, bottom, left and right to parent and a margin to top. So basically, this layout acts as a bottom sheet that slides up and down.
Both sub-views (LinearLayouts-s) can be "expanded", in which case, the other sub-view changes its visibility to gone.
So what happens is when I expand one layout and hide another, for some reason, the whole layout's alignment stays to top of the parent, preserving the margin, but gets cut to the bottom, leaving an empty space. I want it to move to the bottom of the screen is such case. I have also added app:layout_constraintVertical_bias="1.0", which I thought would take care of it. But it does not work. I will attach pictures.
So what I am trying to achieve is to make the sheet to get aligned bottom all the time. Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:layout_constraintVertical_bias="1.0" />
</android.support.constraint.ConstraintLayout>
This should work. Please try.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:layout_constraintVertical_bias="1.0" >
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
Try this
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="0dp"
android:layout_height="0dp"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
</android.support.constraint.ConstraintLayout>
So, the answer from #Arti Patel kinda worked, but the filter view would still go beyond toolbar. I ended up using LinearLayout and FrameLayout.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<include layout="#layout/merge_screen_container" />
</LinearLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/filter_margin_top"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible" />
</FrameLayout>

Overlay Toolbar with a Constraint layout for inApp Notification system

i'm searching a way for overlay the toolbar with a ConstraintLayout but it seems the toolbar have a priority over the ConstraintLayout
Layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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:background="#eaecf0"
tools:context="co.android.yalla.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/Overlay"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#eaecf0"
app:layout_constraintBottom_toTopOf="#+id/navigation"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar" />
<com.ittianyu.bottomnavigationviewex.BottomNavigationViewEx
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#FFFFFF"
app:itemIconTint="#color/bottom_color"
app:itemTextColor="#color/bottom_color"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_navigation_items" />
<android.support.constraint.ConstraintLayout
android:id="#+id/notification"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/notification"
android:layout_marginTop="20dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/grey_pop_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:text="#string/d_selected_matches"
android:textColor="#android:color/white"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
I need to do this for a inApp Notification System
I've tried RelativeLayout and FrameLayout
I'm using the theme Theme.AppCompat.NoActionBar
I don't know if the Toolbar have some specific property about this problem
Thanks

Fragment Content Overlaps Toolbar and Bottom Navigation View

I have implemented a bottom navigation view in my android application. With five fragments. However, I have a problem that each time I change the fragment the content of the fragment overlaps the toolbar.
layout for the bottom navigation view
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
tools:context=".DashboardActivity">
<include layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</include>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_above="#+id/navigationView"
android:layout_height="match_parent"
/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:itemBackground="#android:color/white"
app:itemIconTint="#color/cardview_dark_background"
app:itemTextColor="#android:color/black"
app:menu="#menu/navigation_menu"
/>
</android.support.constraint.ConstraintLayout>
an example of one of the fragments layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".AttendanceFragment">
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.7" />
<android.support.v7.widget.CardView
android:id="#+id/cardView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/barrier3"
app:layout_constraintEnd_toStartOf="#+id/guideline"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Spinner
android:id="#+id/spinner_courses"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:paddingBottom="4dp"
android:paddingTop="4dp"
app:layout_constraintEnd_toStartOf="#+id/guideline"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.v7.widget.CardView>
<TextView
android:id="#+id/tv_time"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#color/colorPrimaryDark"
android:textSize="12sp"
app:layout_constraintBottom_toTopOf="#+id/barrier3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#+id/guideline"
app:layout_constraintTop_toTopOf="parent"
tools:text="Date" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/add_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="16dp"
android:src="#drawable/ic_add_icon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<!--<android.support.design.widget.FloatingActionButton
android:id="#+id/floatingActionButton"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginBottom="4dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:clickable="true"
app:srcCompat="#drawable/ic_more_vert_black_24dp"
app:fabSize="mini"
app:layout_constraintBottom_toBottomOf="#+id/textView3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/spinner"
app:layout_constraintTop_toTopOf="parent"
android:focusable="true" />-->
<android.support.constraint.Barrier
android:id="#+id/barrier3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="cardView2,tv_time"
tools:layout_editor_absoluteY="511dp" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="4dp"
app:cardBackgroundColor="#color/colorMainBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/barrier3">
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_register"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
This is what the screen look like with overlapping content
I removed from my ConstraintLayout the default generated marginTop field, and changed my fragment's layout_height to 0dp. Then in all of my Fragments' layout's the outermost layout_height I always set to match parent.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Add margins to container:
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_above="#+id/navigationView"
android:layout_height="match_parent"
android:layout_marginBottom="{bottom_navigation_height}"
android:layout_marginTop="{tool_bar_height}"
/>
You should add constraints to your #id/container.
To the top to your toolbar and to the bottom to the BottomNavigationBar. The same should you do to these elements. Toolbar top to parent and toolbar bottom to container. BottomNavigationBar top to container and bottom to parent. Then set the height of the container to 0dp.
<include layout="#layout/toolbar"
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<FrameLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/navigationView"
app:layout_constraintTop_toTopOf="#id/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
Didn't test the code but should work.
Its overlapping because You have not giving proper constraint to your controls.
You can try this way.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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">
<include
android:id="#+id/include"
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<FrameLayout
android:id="#+id/container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigationView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/include" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigationView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:itemBackground="#android:color/white"
app:itemIconTint="#color/cardview_dark_background"
app:itemTextColor="#android:color/black"
app:menu="#menu/navigation_menu"
/>
</android.support.constraint.ConstraintLayout>
In Recent Android Studio Versions (4.0.beta 1), if the hierarchy on the default generated activity_main.xml (omitted attributes) is as following,
<androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView />
<fragment />
</androidx.constraintlayout.widget.ConstraintLayout>
The fragments seems overlapping the bottom navigation, just rearranging it as shown below,
<androidx.constraintlayout.widget.ConstraintLayout>
<fragment />
<com.google.android.material.bottomnavigation.BottomNavigationView />
</androidx.constraintlayout.widget.ConstraintLayout>
fixed the problem for me without touching any constraints and NOT adding any padding or margins
your fragment container used "match_parent",which take up the position of toolbar and navigationBar,maybe you can choice nested LinearLayout and use height=warp_content, weight=1

Categories

Resources