Recyclerview与滚动背景

时间:2015-04-04 17:24:52

标签: android android-layout android-recyclerview

我正在尝试使用滚动背景创建一个RecyclerView,如下所示。 我的想法是,当我向上/向下滚动视图时,背景(浅绿色)图像也应同步向上/向下移动。关于如何做到这一点的任何线索?

enter image description here

这是我的基本RecyclerView配置

<android.support.v7.widget.RecyclerView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/item_margin"
android:clipToPadding="false"
android:background="@drawable/ic_light_green_image"/>

2 个答案:

答案 0 :(得分:5)

我有same use-case - 滚动显示位于沿Z轴的应用栏上方的卡片列表,就像Google Play音乐一样。它实际上非常简单,但RecyclerView#computeVerticalScrollOffset()的文档完全具有误导性。它不计算滚动条 thumb的偏移量,而是根据RecyclerView本身滚动的数量来计算(这正是我们需要的)。

mPostList.addOnScrollListener(new RecyclerView.OnScrollListener() {
    @Override
    public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        super.onScrolled(recyclerView, dx, dy);
        int scrollY = mPostList.computeVerticalScrollOffset();
        // mAppBarBg corresponds to your light green background view
        mAppBarBg.setTranslationY(-scrollY);
        // I also have a drop shadow on the Toolbar, this removes the
        // shadow when the list is scrolled to the top
        mToolbarCard.setCardElevation(scrollY <= 0 ? 0 : toolbarElevation);
    }
});

如果有帮助,我的布局如下:

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- this corresponds to your light green background -->
    <FrameLayout
        android:id="@+id/app_bar_bg"
        android:layout_width="match_parent"
        android:layout_height="@dimen/toolbar_container_height"
        android:background="@color/primary" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!-- CardView adds a drop shadow to the Toolbar -->    
        <android.support.v7.widget.CardView
            android:id="@+id/toolbar_card"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:cardCornerRadius="0dp">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

        </android.support.v7.widget.CardView>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/post_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:clipToPadding="false"
            android:scrollbarStyle="outsideOverlay"
            android:scrollbars="vertical" />

    </LinearLayout>

</FrameLayout>

希望这有帮助!

答案 1 :(得分:2)

我可能不会使用RecyclerView的背景来移动实际的东西。也许不要在RecyclerView上放置背景,而不是实际移动的RecyclerView背后的不同视图。然后,您可以在RecyclerView上覆盖onDraw或onLayout,并将背景的位置更新为相对于RecyclerView的滚动百分比的任何位置。

像这样...... XML:

<RelativeLayout ...>
    <SomeBackgroundView id="backgroundView" ...>
    <MyRecyclerView ...>
</RelativeLayout>

代码:

class MyRecyclerView extends RecyclerView {
    protected int mLastScroll = Integer.MAX_VALUE;
    protected ScrollChangedListener mScrollChangedListener;

    // ...

    @Override
    void onDraw(Canvas c) {
        int scrollY = getScrollY();
        if (scrollY != mLastScroll) {
            mLastScroll = scrollY;
            if (mScrollChangedListener!= null)
                mScrollChangedListener.onScrollChanged(scrollY);
        }

        super.onDraw(c);
    }

    public void setScrollChangedListener(ScrollChangedListener listener) {
        mScrollChangedListener = listener;
    }

    public interface ScrollChangedListener {
        void onScrollChanged(int newScroll);
    }
}

class SomeActivity extends Activity implements ScrollChangedListener {
    // ... 

    @Override
    void onScrollChanged(int newScroll) {
        // Set the background view's position based on newScroll
    }

}