CODEWITHSUNDEEP
androidandroid-coordinatorlayoutandroid-appbarlayout
Graeme
Graeme

Reputation: 25864

CoordinatorLayout/AppBarLayout ExpandableListView being rendered off screen

Yet more problem in using CoordinatorLayout and AppBarLayout.

I'm trying to achieve the basic functionality of having the Toolbar scroll off screen when scrolling down and coming back on screen when scrolling up.

However, my current set up is showing a problem: Not only is the Toolbar not scrolling off, the ListView seems to be rendering off screen at the bottom. It's almost as if it's been offset by the AppBarLayout height.

Here is a gif describing the issue, note that the final item is cut off also the ScrollBar is off screen:

enter image description here

My layout is pretty standard:

<?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"
                                                 android:layout_width="match_parent"
                                                 android:layout_height="match_parent"
                                                 android:background="@color/background">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            android:background="@color/orange"
            app:layout_scrollFlags="scroll|enterAlways"/>

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


    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeToRefresh"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <ExpandableListView
            android:id="@+id/listView"
            android:groupIndicator="@android:color/transparent"
            android:layout_width="match_parent"
            android:dividerHeight="0px"
            android:layout_height="match_parent"/>
    </android.support.v4.widget.SwipeRefreshLayout>

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

Upvotes: 7

Views: 3598

Answers (3)

Ahamadullah Saikat
Ahamadullah Saikat

Reputation: 4644

private int mPreviousVisibleItem;


    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        expListView.setNestedScrollingEnabled(true);
    } else {
        expListView.setOnScrollListener(new AbsListView.OnScrollListener() {

            @Override
            public void onScrollStateChanged(AbsListView view, int scrollState) {
            }

            @Override
            public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
                if (firstVisibleItem > mPreviousVisibleItem) {
                    appBarLayout.setExpanded(false, true);
                } else if (firstVisibleItem < mPreviousVisibleItem) {
                    appBarLayout.setExpanded(true, true);
                }
                mPreviousVisibleItem = firstVisibleItem;
            }
        });
    }

Upvotes: 0

waleedsarwar86
waleedsarwar86

Reputation: 2374

CoordinatorLayout only works with RecyclerView or NestedScrollView.Try Wrapping your ExapandableListView inside NestedScrollView or use the below code to make NestedScrollingEnable for ExpandableListView.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
     expandablelistView.setNestedScrollingEnabled(true);
}else {
     CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) mSwipeLayout.getLayoutParams();
     params.bottomMargin = heightOfAppBarCompat;
     mSwipeLayout.setLayoutParams(params);
}

Edit You can make scrolling work as expected pre-21 with the else statement.

Upvotes: 10

Martin Pfeffer
Martin Pfeffer

Reputation: 12627

I would write it as a comment, but in terms of readability I will drop this info as an answer. If it won't work, let me know and I will delete it... I guess you should tell your Toolbar how to interact. In my app the toolbar looks like this:

<android.support.v7.widget.Toolbar
            android:id="@+id/anim_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

please note the "app:layout_collapseMode"

Upvotes: 0

Related Questions