24

I have defined a basic Coordinator layout for my view:

<android.support.design.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.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="@color/white"
            app:tabMode="fixed"/>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

There are multiple tabs in my view pager. I am posting one of my simple fragments:

<ListView
    android:id="@+id/transferList"
    android:layout_width="match_parent"
    android:layout_height="match_parent"></ListView>

<android.support.design.widget.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginBottom="@dimen/activity_vertical_margin"
    android:layout_marginRight="@dimen/activity_horizontal_margin"
    android:layout_alignParentRight="true"
    android:src="@drawable/ic_add_white" />

What happens is that the FAB goes out of screen. It's just not the FAB, but other fragments with cardviews/listviews are getting cut off at the bottom of the screen. I looked around for a solution, and came up with a hacky solution: Removing the property app:layout_scrollFlags="scroll|enterAlways" from the Toolbar.

I can't understand what might be causing this to happen, and how removing the above solved the problem. Is it some bug in the support library? Is there a better way to solve this? Another solution I had come across is from here - to keep the FAB button directly under a Coordinator layout in the activity, and make it visible only in the fragment you need. Did not seem like a good solution to me. Also, other views in my fragments were also getting cut off.

Community
  • 1
  • 1
shiladitya
  • 2,290
  • 1
  • 23
  • 36
  • 4
    I removed `app:layout_scrollFlags="scroll|enterAlways|snap"` and the scrolling worked properly and the bottom is not getting cut. Just wanted to ask what are the implications of this change? Did you come across any other solutions to this problem? – just_a_coder Apr 19 '16 at 14:10
  • 1
    I found that only removing the `scroll|` part was enough. Hopefully, by doing this, there will be less possible implications than if I'd removed the `app:layout_scrollFlags` attribute entirely(?) – ban-geoengineering Sep 27 '16 at 19:38

5 Answers5

28

I have fixed this problem by changing the Toolbar's app:layout_scrollFlags="scroll|enterAlways" attribute to just app:layout_scrollFlags="enterAlways".

ban-geoengineering
  • 18,324
  • 27
  • 171
  • 253
4

I have a layout similar to yours: activity with a toolbar going off the top and tabs. And the requirement for fragments is to have their own independent FABs.

I couldn't cope with it directly in the xml, so then I nailed it that way:

Activity layout

<android.support.design.widget.CoordinatorLayout  xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginBottom="20dp"
        android:background="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|enterAlways|snap"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

</android.support.design.widget.AppBarLayout>

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

Fragment layout:

<FrameLayout 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/scroll"
    layout="@layout/content_activity_main"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    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_gravity="bottom|right|end"
    android:src="@android:drawable/ic_input_add"
    app:borderWidth="0dp"
    app:fabSize="mini"

    app:useCompatPadding="true" />

And a bit of code to make the FAB stay where it intended to be. Fragment onCreateView:

public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        final View rootView = inflater.inflate(R.layout.fragment_tabs2, container, false);
        final FloatingActionButton fab = (FloatingActionButton) rootView.findViewById(R.id.fab);
        final TabLayout tabLayout = (TabLayout) getActivity().findViewById(R.id.tabs);
        final AppBarLayout appBarLayout = (AppBarLayout) getActivity().findViewById(R.id.appbar);
        appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {

            @Override
            public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
                int maxAbsOffset = appBarLayout.getMeasuredHeight() - tabLayout.getMeasuredHeight();
                fab.setTranslationY(-maxAbsOffset - verticalOffset);
            }

        });

        return rootView;
    }
RoK
  • 960
  • 1
  • 7
  • 6
1

This is because you are using CoordinatorLayout with ListView. You can change your implementation to RecyclerView to achieve correct scroll.

check my answer here. This may help you.

Community
  • 1
  • 1
sha
  • 1,410
  • 2
  • 18
  • 37
1

There are 2 solutions to this problem:

  • You can remove Toolbar's scroll from app:layout_scrollFlags (e.g app:layout_scrollFlags="enterAlways") or remove entire app:layout_scrollFlags
  • If you require the scroll attribute, the main layout content/fragment must use RecyclerView or NestedScrollView.

https://code.luasoftware.com/tutorials/android/bottom-of-fragment-in-viewpager-out-of-screen/

Desmond Lua
  • 6,142
  • 4
  • 37
  • 50
0

Remove scroll from the toolbar layout_scrollFlags attribute. You should have something like this: app:layout_scrollFlags="enterAlways|enterAlwaysCollapsed"

hassan_codes
  • 1
  • 1