Android: CoordinatorLayout RecyclerView First Item not visible
I had to implement a
Toolbar with tabs, together with
CoordinatorLayout, and the content of each tab had to be a list of items, for which I used
RecyclerView. But when I ran the app, the first item in the list was overlapped by the tabs, so it was not fully visible.
This is how my xml file looked like:
<?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" android:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" 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:layout_scrollFlags="enterAlwaysCollapsed" /> <android.support.design.widget.TabLayout android:id="@+id/tab_layout" android:layout_width="match_parent" android:layout_height="wrap_content" app:layout_scrollFlags="scroll|enterAlways" app:tabIndicatorColor="@color/white" app:tabMode="scrollable" app:tabSelectedTextColor="@color/white" app:tabTextColor="@color/white_transparent" /> </android.support.design.widget.AppBarLayout> <!-- As the main content view, the view below consumes the entire space available using match_parent in both dimensions. --> <FrameLayout android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/light_gray"/> </android.support.design.widget.CoordinatorLayout> <android.support.design.widget.NavigationView android:id="@+id/navigation_drawer" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:background="@color/white" app:headerLayout="@layout/drawer_header" app:menu="@menu/drawer" /> </android.support.v4.widget.DrawerLayout>
FrameLayout is replaced in the code with a fragment containing the
This property MUST be added to your scrolling view in order to make all list’s items visible:
In my case, as I was using a
FrameLayout which contained a RecyclerView, I had to add this property to the
FrameLayout, and not directly to the
RecyclerView as it was in another xml file and wouldn’t work. But if you declare your
RecyclerView directly inside
CoordinatorLayout, you should add this property to it, and everything should be fine.
Just a final Note
If you are using
ListView instead of
RecyclerView together with
CoordinatorLayout, you will encounter different scrolling and UI issues that will be difficult to handle. At first I had a ListView and tried to make the app work with it, but I ended up in refactoring the code and used RecyclerView instead. This way, all the UI issues were solved much more easily.
So my recommandation is to refactor your code and replace ListViews with RecyclerViews if you intend to benefit from the power of
Search In Blog
Want to donate?
Recent Posts: My Android Solutions
If you ever wondered how to read and parse a simple JSON file stored in the assets directory of your Android project, here is a way to do it.
In this tutorial I will create a simple Sectioned RecyclerView that will show 2 sections and a few items in each section and how to move an item from one section to another. Note: For RecyclerView I used AndroidX imports and not android.support.v7.widget.RecyclerView! Setup We need to import the recycler view from AndroidX. The build.gradle…
Recently, I had to add a perfect square CardView and I wanted to achieve this without hardcoding its width and height. I happily discovered the power of ConstraintLayout and this is how I managed to create a perfect square which should work on every dimension. In my project I created a RecyclerView with 2 columns,…