Question

我有一个图片滑块和一个包含新闻的recyclerview。

当从底部到顶部滚动recyclerview时，recyclerview将（隐藏）在图像滑块下面，如图所示我正在开发的应用程序：

这是我设备上新闻应用的屏幕截图：

正如您在上一张图片中所看到的，Recyclerview如何与图像滑块重叠。

我如何实现这一目标？

这是我的片段xml：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout android:id="@+id/framelayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:id="@+id/linearFragmentOne"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.baoyz.widget.PullRefreshLayout
            android:id="@+id/swipe_refresh"
            android:layout_width="match_parent"
            app:refreshColors="@array/colors_swipe"
            app:refreshType="ring"
            android:layout_height="200dp">

            <com.daimajia.slider.library.SliderLayout
                android:id="@+id/slider"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                custom:indicator_visibility="visible"
                custom:pager_animation="Accordion"
                custom:pager_animation_span="1100" />

        </com.baoyz.widget.PullRefreshLayout>

        <TextView
            android:id="@+id/txt_marquee"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="true"
            android:textSize="15sp"
            android:textColor="#FFFFFF"
            android:singleLine="true"
            />

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="fill_vertical"

            >

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recycler_post"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                />

        </android.support.v4.widget.NestedScrollView>

    </LinearLayout>


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

我已经将片段xml更新为：

<?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:ads="http://schemas.android.com/apk/res-auto"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:custom="http://schemas.android.com/apk/res-auto"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


        <LinearLayout
            android:orientation="vertical"
            android:id="@+id/framelayout"
            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="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
        <com.baoyz.widget.PullRefreshLayout
            android:id="@+id/swipe_refresh"
            android:layout_width="match_parent"
            app:refreshColors="@array/colors_swipe"
            app:refreshType="ring"
            android:layout_height="200dp">

            <com.daimajia.slider.library.SliderLayout
                android:id="@+id/slider"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                custom:indicator_visibility="visible"
                custom:pager_animation="Accordion"
                custom:pager_animation_span="1100" />

        </com.baoyz.widget.PullRefreshLayout>

        <TextView
            android:id="@+id/txt_marquee"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="true"
            android:textSize="15sp"
            android:textColor="#FFFFFF"
            android:singleLine="true"
            />

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="fill_vertical"

            >

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recycler_post"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:behavior_overlapTop="100dp"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                />

        </android.support.v4.widget.NestedScrollView>

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

在imageslider的顶部添加了一个简单的工具栏，没有任何改变

FINAL_UPDATE：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView

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

        <LinearLayout
            android:orientation="vertical"
            android:id="@+id/framelayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

        <com.baoyz.widget.PullRefreshLayout
            android:id="@+id/swipe_refresh"
            android:layout_width="match_parent"
            app:refreshColors="@array/colors_swipe"
            app:refreshType="ring"
            android:layout_height="200dp">

            <com.daimajia.slider.library.SliderLayout
                android:id="@+id/slider"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                custom:indicator_visibility="visible"
                custom:pager_animation="Accordion"
                custom:pager_animation_span="1100" />

        </com.baoyz.widget.PullRefreshLayout>

        <TextView
            android:id="@+id/txt_marquee"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="true"
            android:textSize="15sp"
            android:textColor="#FFFFFF"
            android:singleLine="true"
            />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recycler_post"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                />
        </LinearLayout>

</android.support.v4.widget.NestedScrollView>

Answer 1

IDK您的PullRefreshLayout小部件的功能，但您可以通过添加内置Slider的AppBarLayout和必要时的PullRefreshLayout来获得所需的行为。然后在NestedScrollView和/或RecyclerView上添加app:behavior_overlapTop="here goes the amount of dp you want to overlap over the AppBarLayout"。

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <LinearLayout
        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="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
        <com.daimajia.slider.library.SliderLayout
            android:id="@+id/slider"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            custom:indicator_visibility="visible"
            custom:pager_animation="Accordion"
            custom:pager_animation_span="1100" />
    </LinearLayout>
</android.support.design.widget.AppBarLayout>

...

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="fill_vertical"

    >

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_post"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:behavior_overlapTop="100dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        />

</android.support.v4.widget.NestedScrollView>

这样您就可以调整RecyclerView与AppBarLayout重叠的数量。如果您需要以编程方式检查setOverlayTop。

但是如果你需要完全传递，只需将所有东西都包装到NestedScrollView中并将app:layout_behavior添加到滑块中，这样当你滚动RecyclerView时它也会上升，它不会重叠，但它随着Slider向上移动，它将占据空间。

如果您想进行自定义重叠，那么获取用于自定义控件com.baoyz.widget.PullRefreshLayout和com.daimajia.slider.library.SliderLayout的库的链接会很方便。

<强>更新

澄清：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout android:id="@+id/framelayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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


        <LinearLayout
            android:orientation="vertical"
            android:id="@+id/framelayout"
            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="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
            <com.baoyz.widget.PullRefreshLayout
                android:id="@+id/swipe_refresh"
                android:layout_width="match_parent"
                app:refreshColors="@array/colors_swipe"
                app:refreshType="ring"
                android:layout_height="200dp">

                <com.daimajia.slider.library.SliderLayout
                    android:id="@+id/slider"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    custom:indicator_visibility="visible"
                    custom:pager_animation="Accordion"
                    custom:pager_animation_span="1100" />

            </com.baoyz.widget.PullRefreshLayout>

            <TextView
                android:id="@+id/txt_marquee"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:focusable="true"
                android:textSize="15sp"
                android:textColor="#FFFFFF"
                android:singleLine="true"
                />

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="fill_vertical"
        >

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_post"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:behavior_overlapTop="100dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
                />

    </android.support.v4.widget.NestedScrollView>

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

如何使recyclerview项目重叠图像滑块

1 个答案: