Can the tab selection indicator of TabLayout be pinned to the top of the screen while scrolling?

Question

I am investigating the way to pin the tab indicator of TabLayout in CoordinatorLayout while scrolling down.

If I add scroll|enterAlwaysCollapsed flag to the TabLayout , then the tablayout itself is dissappeared while scrolling down. I want tab indicator bar be pinned to the top of the screen.

Is there a way to implement this?

Answer 1

I think you should just have no flags at all. Your layout should be something like:

<CoordinatorLayout>
    <AppBarLayout>

        <Toolbar app:layout_scrollFlags="scroll|enterAlways" />
        <TabLayout/>

    </AppBarLayout>

    < /> <!-- ViewPager or other stuff -->
</CoordinatorLayout>

If you assign the scroll flag to the TabLayout it will start reacting to scroll gestures and will move/enter/exit according to your flags. As far as I understand about your question, you don't want it to move, so just remove the flags.

See here for reference.

Answer 2

You should provide your custom Behavior for your TabLayout or AppBarLayout (only if TabLayout is only child of the AppBarLayout ), where you will translate the y of the TabLayout to the -mTabLayout.getHeight() + mTabIndicatorHeight . You should do the same if you go with offseting top and bottom.

Currently, TabLayout does not have @DefaultBehavior and it is translated by the AppBarLayout behavior. Which is plain top and bottom offseting to the total amount of scroll range (sum of heights of views that have scrolling flags).