Make View scrolls along RecyclerView

Question

Well, I'm trying to make a top bar like the one that is on Youtube's app. It works on almost all cases but when I use the ScrollListener from RecyclerView I get a problem.

As you can see the View doesn't change its position at certain moment when scrolled.

Here is my code:

rvTop.addOnScrollListener(new RecyclerView.OnScrollListener() {
        @Override
        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
            super.onScrolled(recyclerView, dx, dy);

            LinearLayoutManager layoutManager = (LinearLayoutManager) layoutManagerTop;
            if(filterTopAdapter.lastSelected >= layoutManager.findFirstVisibleItemPosition() && filterTopAdapter.lastSelected <= layoutManager.findLastVisibleItemPosition()) {
                selectionLine.setVisibility(View.VISIBLE);
                final View view = rvTop.findViewHolderForAdapterPosition(filterTopAdapter.lastSelected).itemView;
                selectionLine.setTranslationX(view.getLeft() - rvTop.getScrollX());
                Log.d("Scroll", String.valueOf(view.getLeft() - rvTop.getScrollX()));
            }
            else {
                selectionLine.setVisibility(View.GONE);
            }

        }

        @Override
        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
            super.onScrollStateChanged(recyclerView, newState);
            LinearLayoutManager layoutManager = (LinearLayoutManager) layoutManagerTop;
            if(filterTopAdapter.lastSelected >= layoutManager.findFirstVisibleItemPosition() && filterTopAdapter.lastSelected <= layoutManager.findLastVisibleItemPosition()) {
                selectionLine.setVisibility(View.VISIBLE);
                final View view = rvTop.findViewHolderForAdapterPosition(filterTopAdapter.lastSelected).itemView;
                selectionLine.setTranslationX(view.getLeft() - rvTop.getScrollX());
                Log.d("Scroll", String.valueOf(view.getLeft() - rvTop.getScrollX()));
            }
            else {
                selectionLine.setVisibility(View.GONE);
            }

        }


    });

Answer 1

You should try TabLayout with ViewPager

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="fill_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context="stellar.kade_c.com.MainActivity">

    <android.support.design.widget.TabLayout
        android:id="@+id/sliding_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="scrollable" />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

Answer 2

You should use TabLayout with ViewPager for this