In my android app I have a recyclerview inside my main activity.
These recyclerview is supposed to display documents to the user.
My problem is that the items overlap the right part of the screen. I don't know why it happens. I have worked with CardViews before but I can't seem to solve this.
Here is a screenshot of my problem:
As you can see, the right side of the CardViews overlaps the screen.
Here is the main activity layout 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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/top_parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorBackground"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<include layout="#layout/toolbar"
android:id="#+id/toolbar_layout"
tools:layout_constraintTop_creator="1"
tools:layout_constraintLeft_creator="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="384dp"
android:layout_height="567dp"
android:fitsSystemWindows="true"
tools:layout_constraintTop_creator="1"
tools:layout_constraintLeft_creator="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.silverfix.dgdeditor.utils.views.EmptyViewRecyclerView
android:id="#+id/documents_rv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:focusable="true"
android:scrollbars="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:listitem="#layout/document_list_item" />
<ImageView
android:id="#+id/empty_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/empty_view"
android:scaleX="0.5"
android:scaleY="0.5" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginTop="?attr/actionBarSize"
android:background="#drawable/menu_background"
android:fitsSystemWindows="true"
android:padding="10dp"
app:menu="#menu/nav_drawer_menu"
app:headerLayout="#layout/nav_header"
app:itemTextAppearance="#style/NavDrawerTextStyle" />
</android.support.v4.widget.DrawerLayout>
</android.support.constraint.ConstraintLayout>
And here is the document_list_item code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/dg_card_view"
android:layout_width="match_parent"
android:layout_height="#dimen/dg_card_view_height"
android:clickable="true"
android:focusable="true"
android:foreground="?android:selectableItemBackground"
card_view:cardCornerRadius="4dp"
card_view:cardElevation="3dp"
card_view:cardUseCompatPadding="true"
card_view:cardPreventCornerOverlap="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:background="#drawable/nav_item_divider" />
<TextView
android:id="#+id/document_card_name_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="#dimen/card_side_padding"
android:text="Document: "
android:textAppearance="#style/TextAppearance.AppCompat" />
<TextView
android:id="#+id/document_card_date_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignTop="#+id/document_card_name_tv"
android:layout_marginRight="#dimen/card_side_padding"
android:text="Date"
android:textAppearance="#style/TextAppearance.AppCompat" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Related
I have a BottomNavigationView Bar on my App. This bar does not show on where it is placed until it's scrolled.
How can I change the Behavior so that the bar shows even without scrolling. That is I want a permanent Fixed position to the bottom, if user does not scroll id remains there, if they scroll it remains there still.
Here is my app_bar xml code
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.sckoolboy.app.AspirantOfflineActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/content_main" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:fitsSystemWindows="true"
android:background="?android:attr/windowBackground"
android:foreground="?attr/selectableItemBackground"
app:menu="#menu/master_bottom_navigation"
app:elevation="10dp"
app:labelVisibilityMode="labeled"
app:itemIconTint="#color/accent"
app:itemTextColor="#color/black"
app:itemBackground="#color/bottomNavigationBackground"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
And below is how this bar appears on my main activity
<?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"
tools:context="com.sckoolboy.app.AspirantOfflineActivity"
tools:showIn="#layout/app_bar_main"
style="#style/parent.contentLayout">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textViewUser"
style="#style/viewParent.headerText"
android:maxLines="2"
android:text="Aspirant Mode"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"/>
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profileCircleImageView"
android:layout_width="60dp"
android:layout_height="60dp"
app:civ_border_width="2dp"
app:civ_border_color="#color/colorAccent"
android:src="#drawable/icon"
android:layout_alignParentRight="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
app:cardCornerRadius="16dp"
app:cardPreventCornerOverlap="false"
app:cardBackgroundColor="#color/colorAccent"
android:minHeight="200dp"
android:layout_alignParentTop="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="10dp"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome to \nSckoolboy"
android:textColor="#color/whiteBodyColor"
android:textStyle="bold"
android:textSize="20sp"/>
<TextView
android:layout_marginTop="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="20% Complete"
android:textColor="#color/whiteBodyColor"
android:textStyle="bold"
android:textSize="13sp"/>
</LinearLayout>
<ImageView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:cropToPadding="true"
android:src="#drawable/hero"
android:elevation="44dp"/>
</LinearLayout>
</androidx.cardview.widget.CardView>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp">
<TextView
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:text="Popular"
style="#style/viewParent.headerText"/>
<TextView
android:layout_alignParentRight="true"
style="#style/viewParent"
android:text="See All"
android:layout_centerVertical="true"
android:textSize="#dimen/headerMoreTextSize"
android:textColor="#color/colorAccent"
android:textStyle="bold"/>
</RelativeLayout>
<!--remove the below layout with recycler view, use card poplar courses as model for design-->
<LinearLayout
android:layout_width="match_parent"
android:layout_marginBottom="50dp"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
android:id="#+id/includeCallEnd0"
layout="#layout/offline_exam_etest"/>
<include
android:id="#+id/includeCallEnd0"
layout="#layout/sckoolboy_community"/>
<include
android:id="#+id/includeCallEnd0"
layout="#layout/sckoolboy_radio"/>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
You can get the BottomNavigationView out of the CoordinatorLayout, and add both to another root layout:
<?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="com.sckoolboy.app.AspirantOfflineActivity">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigation">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:visibility="gone"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</com.google.android.material.appbar.AppBarLayout>
<include layout="#layout/content_main" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:fitsSystemWindows="true"
android:background="?android:attr/windowBackground"
android:foreground="?attr/selectableItemBackground"
app:menu="#menu/master_bottom_navigation"
app:elevation="10dp"
app:labelVisibilityMode="labeled"
app:itemIconTint="#color/accent"
app:itemTextColor="#color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:itemBackground="#color/bottomNavigationBackground"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I have a recyclerview populated with a list from an API. I am using RxBinding to search and filter the list. The current problem is with my layout. I would like my search bar field at the top with the list beneath it. Below is an example of my list being filtered but as you can see the searchbar text and the List Items overlap
Now below is the layout file.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true">
<android.support.v7.widget.RecyclerView
android:id="#+id/listRecycler"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.AppCompatEditText
android:id="#+id/searchView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="start|center_vertical"
android:layout_weight="1"
android:background="#android:color/transparent"
android:inputType="text" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end|center_vertical"
android:src="#android:drawable/ic_menu_search" />
</FrameLayout>
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</FrameLayout>
</FrameLayout>
Eventually I want the searchbar to be scrollable as well, so that when the user scrolls down the list, the searchbar will be rotated out. However I think this will involve me created a list of some CommonInterface which my both my SearchBar and ListItems would have to implement.
Use RelativeLayout like this so that recyclerView is below the editText and add a scrollView so that the scrolling happens on the whole layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/listRecycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/edit"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/edit">
<android.support.v7.widget.AppCompatEditText
android:id="#+id/searchView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="start|center_vertical"
android:layout_weight="1"
android:background="#android:color/transparent"
android:inputType="text" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="end|center_vertical"
android:src="#android:drawable/ic_menu_search" />
</FrameLayout>
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</FrameLayout>
</RelativeLayout>
</ScrollView>
</RelativeLayout>
And add this in your RecyclerView in Java:
recyclerView.setNestedScrollingEnabled(false);
You can try this layout
<android.support.constraint.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:background="#color/atehensGray"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/chrome_grey"
android:fitsSystemWindows="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<SearchView
android:id="#+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#drawable/rounded_corners"
android:gravity="top"
android:hapticFeedbackEnabled="true"
android:orientation="horizontal"
android:visibility="visible"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="1.0" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/white"
android:id="#+id/recyclerView_main"
android:layout_width="0dp"
android:layout_height="0dp"
app:layoutManager="android.support.v7.widget.LinearLayoutManager"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/appBarLayout" />
</android.support.constraint.ConstraintLayout>
My fragment layout contains a CoordinatorLayout with a FloatingActionButton. The parent activity also contains a CoordinatorLayout with a PageView that brings in the fragment. The problem I have is that the FAB sits under the navigation bar instead of above it. It also moves up and down as I scroll the associated RecyclerView, whereas I want it to remain fixed. Here's the XML layout code for the activity:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="uk.ac.aber.dcs.cs31620.faaversion4.ui.FAAMainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar_main" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/nav_header"
app:itemTextColor="?android:textColorPrimary"
app:itemIconTint="?colorPrimaryDark"
app:menu="#menu/menu_nav" />
</android.support.v4.widget.DrawerLayout>
Here's the code for the toolbar:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:layout_scrollFlags="scroll|enterAlways"/>
Finally, here's the code for the fragment layout:
<?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:id="#+id/coordinator"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="uk.ac.aber.dcs.cs31620.faaversion4.ui.cats.CatsFragment">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<GridLayout
android:id="#+id/gridLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:columnCount="2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Spinner
android:id="#+id/breeds_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="50"
android:layout_row="0" />
<Spinner
android:id="#+id/gender_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="50"
android:layout_row="0" />
<Spinner
android:id="#+id/age_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0"
android:layout_columnWeight="50"
android:layout_row="1" />
<TextView
android:id="#+id/proximity_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="1"
android:layout_columnWeight="50"
android:layout_row="1"
android:text="#string/distance"
android:textAppearance="#style/MyTextAppearance" />
</GridLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/cat_list"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:scrollbars="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/gridLayout" />
</android.support.constraint.ConstraintLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_add_cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:src="#drawable/ic_add_white_24dp"
android:layout_gravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>
As a workround I put a layout_MarginBottom on the FAB of 64dp but although it displayed it still moved up and down as the tab bar collapsed. Also, a generated Snackbar was also hidden under the bottom navigation bar. All the examples I've seen have the FAB and coordinator layout at the activity level, and without nesting of a further coordinator layout. Perhaps the only option is to put the FAB in the activity layout and access it from the fragments (e.g. hid it when not needed)? Thanks.
If you are going to use a ConstraintLayout you should think about harnessing the power of it so that your UIs act accordingly. ConstraintLayouts help you remove the nesting of widgets and layouts. It makes them flatter, more readable, reducing code and making your app smoother.
<?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="uk.ac.aber.dcs.cs31620.faaversion4.ui.FAAMainActivity">
<Spinner
android:id="#+id/breeds_spinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#id/gender_spinner"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Spinner
android:id="#+id/gender_spinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/breeds_spinner"
app:layout_constraintTop_toTopOf="parent" />
<Spinner
android:id="#+id/age_spinner"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#id/gender_spinner"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/breeds_spinner" />
<TextView
android:id="#+id/proximity_button"
android:layout_width="0dp"
android:layout_height="0dp"
android:text="#string/distance"
android:textAppearance="#style/MyTextAppearance"
app:layout_constraintBottom_toBottomOf="#id/age_spinner"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/age_spinner"
app:layout_constraintTop_toBottomOf="#id/gender_spinner" />
<android.support.v7.widget.RecyclerView
android:id="#+id/cat_list"
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/age_spinner" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab_add_cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:src="#drawable/ic_add_white_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:isScrollContainer="true"
tools:openDrawer="start">
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/btn_sing_in"
android:layout_gravity="start"
android:fitsSystemWindows="true"
android:nestedScrollingEnabled="true"
app:headerLayout="#layout/nav_header"
android:layout_marginEnd="-55dp"
app:menu="#menu/nav_drawer">
<TextView
android:id="#+id/btn_sing_in"
android:layout_width="match_parent"
android:layout_height="#dimen/logout_height"
android:layout_gravity="bottom"
android:background="#color/colorWhite"
android:drawablePadding="#dimen/logout_drawable_padding"
android:drawableStart="#drawable/ic_logout"
android:gravity="start|center"
android:paddingStart="#dimen/logout_padding_start"
android:text="#string/nav_item_logout" />
</android.support.design.widget.NavigationView>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorWhite"
tools:context="com.kdcos.contsync.view.dashboard.DashboardActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorWhite"
android:elevation="0dp"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorWhite"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_alignParentBottom="true"
app:itemIconTint="#drawable/selector_view"
app:itemTextColor="#color/selector_view_text"
app:menu="#menu/nav_bottom" />
<View
android:id="#+id/view_divider"
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_above="#id/bottom_navigation"
android:background="#color/colorMenuGrey"
android:paddingBottom="12dp" />
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/view_divider"
android:background="#color/colorWhite"/>
</RelativeLayout>
</LinearLayout>
<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_marginBottom="#dimen/baseline_grid_8x"
android:layout_marginEnd="#dimen/fab_margin_end"
app:srcCompat="#drawable/ic_dialpad" />
</android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.DrawerLayout>
this is navheader:
<RelativeLayout 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="#dimen/baseline_grid_22x"
android:background="#color/colorCallGradientEnd"
android:gravity="bottom"
android:orientation="vertical"
android:paddingBottom="#dimen/baseline_grid_2.5x"
android:paddingLeft="#dimen/baseline_grid_2.5x"
android:paddingRight="#dimen/baseline_grid_2.5x"
android:paddingTop="#dimen/baseline_grid_6.5x"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<com.kdcos.contsync.utilities.RoundedImageView
android:id="#+id/imageView"
android:layout_width="#dimen/baseline_grid_8x"
android:layout_height="#dimen/baseline_grid_8x"
android:src="#drawable/illustration"
app:srcCompat="#mipmap/ic_launcher_round" />
<!--app:image_url="#{viewModel.profilePic}"-->
<TextView
android:id="#+id/userNameText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/imageView"
android:paddingLeft="15dp"
android:text="Kushal Dalal"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"
android:textColor="#color/colorWhite"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/lnUpgradelayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/userNameText"
android:layout_marginLeft="#dimen/baseline_grid_2x"
android:layout_marginTop="#dimen/baseline_grid_2x"
android:layout_toRightOf="#+id/imageView"
android:background="#drawable/ic_upgrade_btn"
android:gravity="center"
android:onClick="#{()->viewModel.navigateToonUpgardePage()}"
android:orientation="vertical"
android:textStyle="bold">l
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:fontFamily="sans-serif-medium"
android:letterSpacing="-0.03"
android:text="Upgrade to Premium"
android:textColor="#351600"
android:textSize="14.4sp"
android:textStyle="normal" />
</LinearLayout>
</RelativeLayout>
this is my xml i am displaying 9 item and one nave header but in bigger device i am able to display all 9 item including navheader but in smaller device its display 8 item and nav header when i try to scroll its display till 8 the item it hides 9 item in bottom please check and suggest me how to fix this i am not able to find where is issue coming why its not display 9th which is last item in small device .
The following is my layout xml. The problem now is that the BottomNavigationView is overlapping the FrameLayout. I wanted the FrameLayout to stretch to the top of the BottomNavigationView.
I tried with trick such as adding paddingBottom in the FrameLayout but I wonder if there is other better solution. Thanks.
<?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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<include layout="#layout/user_app_bar"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="#menu/navigation"
app:itemTextColor="#color/colorPrimaryDark"
app:itemIconTint="#color/colorPrimaryDark"
/>
<FrameLayout
android:id="#+id/fragment_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="58dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchorGravity="bottom|end"
app:layout_anchor="#id/app_bar"
app:srcCompat="#drawable/ic_edit_white_24px" />
</android.support.design.widget.CoordinatorLayout>
UPDATE: more information on the user_app_bar.xml. It contains a CollapsingToolbarLayout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout 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/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_behavior="co.domain.DisableAppBarLayoutBehaviour"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false"
app:contentScrim="?attr/colorPrimary">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="parallax">
<ImageView
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:layout_marginTop="0dp"
android:contentDescription=""
app:layout_constraintBottom_toBottomOf="parent"
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="0.0"
tools:ignore="ContentDescription"
android:background="#color/gray"/>
<TextView
android:id="#+id/profileName"
style="#style/textShadow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="0dp"
android:text="user name"
android:textAlignment="center"
android:textSize="18sp"
android:textColor="#fff"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintLeft_toLeftOf="#+id/profileImage"
app:layout_constraintRight_toRightOf="#+id/profileImage"
app:layout_constraintTop_toBottomOf="#+id/profileImage" />
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profileImage"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginBottom="8dp"
android:layout_marginLeft="32dp"
android:layout_marginStart="32dp"
android:layout_marginTop="8dp"
android:alpha="0.5"
android:src="#drawable/ic_account_circle_black_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
There is simple solution for your issue. That is to put marginBottom in FrameLayout on 56dp which is according to documentation height of BottomNavigationView. I'm not sure is it changable acording to mobile screens. Even the documentation says nothing about changing of height. And I used it in some of my apps and I didn't find that height of BottomNavigationView is changing. But just in case check. Hope this will help.
Place CoordinatorLayout and BottomNavigationView inside RelativeLayout
with BottomNavigation android:layout_alignParentBottom="true" and CoordinatorLayout layout above with android:layout_above="#+id/{BottomNavigationView-ID}"
please check below layout
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<data>
</data>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/homeCoordinator"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bnHome" //above bottom navigation
>
<android.support.design.widget.AppBarLayout
android:id="#+id/homeAppbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="0dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<RelativeLayout
android:id="#+id/rlTopLayout"
android:layout_width="match_parent"
android:layout_height="?android:actionBarSize"
android:layout_alignParentTop="true"
android:background="#color/white"
android:orientation="horizontal"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivHomeLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="#dimen/_minus15sdp"
android:src="#mipmap/launcher_logo" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/tvHomeTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:layout_toEndOf="#+id/ivHomeLogo"
android:layout_toRightOf="#+id/ivHomeLogo"
android:text="#string/app_name"
android:textColor="#color/colorPrimary"
android:textSize="#dimen/_16ssp"
android:textStyle="bold" />
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivHomeSurprise"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/ivHomeSearch"
android:layout_toStartOf="#id/ivHomeSearch"
android:paddingBottom="#dimen/_13sdp"
android:paddingTop="#dimen/_13sdp"
android:src="#mipmap/surprise_icon_blue" />
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivHomeSearch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:padding="#dimen/_10sdp"
app:srcCompat="#drawable/ic_search_grey" />
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/flHomeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bnHome"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" // align parent bottom true
app:itemBackground="#color/white_smoke"
app:itemIconTint="#color/bnv_color_state"
app:itemTextColor="#color/bnv_color_state"
app:menu="#menu/bottom_navigation_main"
app:onNavigationItemSelected="#{(item)->vm.onNavigationItemSelected(item)}" />
</RelativeLayout>
<android.support.v4.widget.ContentLoadingProgressBar
android:id="#+id/clpb_progress"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="#{vm.isLoading}" />
</FrameLayout>
Good a better solutions without having to hardcode the bottomView
You can put it inside a ConstraintLayout and make the height of the content 0dp and also set it's bottomToTop="#id/bottomViewId" or whatever is the Id you put to the bottomViewNavigator.
Here is an example.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".StartActivity">
<fragment
android:id="#+id/nav_controller"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/bottom_navigation"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:defaultNavHost="true"
app:navGraph="#navigation/nav_graph" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:background="#color/colorPrimary"
app:itemIconTint="#android:color/white"
app:itemTextColor="#android:color/white"
app:menu="#menu/bottom_navigation_menu" />
</androidx.constraintlayout.widget.ConstraintLayout>
/Try to replace your code with this/
<?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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<include layout="#layout/user_app_bar"/>
<FrameLayout
android:id="#+id/fragment_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="58dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchorGravity="bottom|end"
app:layout_anchor="#id/app_bar"
app:srcCompat="#drawable/ic_edit_white_24px" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="#menu/navigation"
app:itemTextColor="#color/colorPrimaryDark"
app:itemIconTint="#color/colorPrimaryDark"
/>
</android.support.design.widget.CoordinatorLayout>
add this line in your BottomNavigationView
android:background="?android:attr/windowBackground"
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/app_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:labelVisibilityMode="labeled"
android:background="?android:attr/windowBackground"
app:menu="#menu/app_navigation" />