如何使用CoordinatorLayout将视图作为RecyclerView的一部分进行移动

时间:2016-11-11 22:57:32

标签: android android-recyclerview android-coordinatorlayout nestedscrollview

我正在学习Android CoordinatorLayout / RecyclerView / Behavior / Nested滚动内容。我发现API不是很直接。因此我做了一个小实验,但发现CoordinatorLayout中的视图行为没有按预期出现。

这是我想要做的:我希望将CoordinatoryLayout作为父容器。在它里面,有一个RecyclerView作为它的孩子。同样作为它的孩子,还有另一个红色的视图。我希望红色视图随着RecyclerView滚动而移动。我希望两个视图的移动如此同步,以至于看起来红色视图是RecyclerView的一部分。

注意:我知道要实现我刚才所说的,有更简单的方法。但我只想用CoordinatorLayout和Behavior类来做,这样我就可以了解它们是如何工作的。

这是我的布局文件:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="io.github.seemuch.coordinatorlayoutexperiment.MainActivity">

<android.support.v7.widget.RecyclerView
    android:id="@+id/list_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="40dp"
    android:layout_marginLeft="16dp"
    android:layout_marginRight="16dp"
    android:dividerHeight="10dp"
    />

<View
    android:id="@+id/red_view"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_marginBottom="20dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:background="#ff0000"
    app:layout_scrollFlags="scroll|enterAlways"
    />

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

这是我的行为类:

package io.github.seemuch.coordinatorlayoutexperiment;

import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.ViewCompat;
import android.support.v7.widget.RecyclerView;
import android.view.View;


public class MyBehavior extends CoordinatorLayout.Behavior<View> {
    @Override
    public boolean layoutDependsOn(CoordinatorLayout parent, View toolbar, View dependency) {
        return dependency instanceof RecyclerView;
    }


    @Override
    public boolean onStartNestedScroll (CoordinatorLayout coordinatorLayout,
                             View child,
                             View directTargetChild,
                             View target,
                             int nestedScrollAxes) {

        int vertical = (nestedScrollAxes & ViewCompat.SCROLL_AXIS_VERTICAL);
        int horizontal = (nestedScrollAxes & ViewCompat.SCROLL_AXIS_HORIZONTAL);

        return (vertical != 0 && horizontal == 0);
    }

    @Override
    public void onNestedPreScroll (CoordinatorLayout coordinatorLayout,
                        View child,
                        View target,
                        int dx,
                        int dy,
                        int[] consumed) {

        float currY = child.getY();
        if (currY <= 0 && dy >= 0) {
        return;
        }
        child.setY(currY - dy);
    }

}

正如您在onNestedPreScroll方法中看到的那样,我希望子项(即red_view)移动与它所依赖的视图一样多,这就是RecyclerView。

实际发生的事情是:如果您以非常大的移动方式滚动RecyclerView,红色视图会按预期移动;但如果移动很少,red_view的移动速度比RecyclerView要快得多。

以下是屏幕录制视频的链接:https://youtu.be/zK4g61F2aa0 这是该项目的Github回购,如果您想下载并自行运行:https://github.com/seemuch/CoordinatorLayoutExperiment

那么,谁知道发生了什么? 谢谢!

2 个答案:

答案 0 :(得分:0)

找到解决方案:不要覆盖onNestedPreScroll,而是覆盖onNestedScroll()。就那么简单。 但它并没有处理。 Flings需要单独处理。

答案 1 :(得分:0)

我已经通过简单的方法解决了这个问题。首先,我定义了RecyclerView不可滚动(我们仍然可以触摸每一行),然后在布局中放置了ScrollView

下面是一些代码:

layout.xml

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">
    <androidx.constraintlayout.widget.ConstraintLayout 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"
        tools:context=".MainActivity">


        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recycler"
            android:layout_width="409dp"
            android:layout_height="729dp"
            android:layout_marginTop="200dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.505" />

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.089" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

MainActivity.kt

class MainActivity : AppCompatActivity() {

        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_main)

            val adapter = PersonAdapter { /*handle touch*/ }
            val manager = CustomGridLayoutManager(this)
            manager.setScrollEnabled(false)
            recycler.layoutManager = manager
            recycler.adapter = adapter
        }
    }

CustomGridLayoutManager.kt

class CustomGridLayoutManager(context: Context?) :
    LinearLayoutManager(context) {
    private var isScrollEnabled = true
    fun setScrollEnabled(flag: Boolean) {
        isScrollEnabled = flag
    }

    override fun canScrollVertically(): Boolean { 
        return isScrollEnabled && super.canScrollVertically()
    }
}

PersonAdapter.kt

class PersonAdapter(val onItemClick : (Int) -> (Unit))
: RecyclerView.Adapter<PersonAdapter.ViewHolder>() {

private val personList = arrayOf("marco", "anna", "gianna", "giulia", "alice", "sini", "marco", "anna", "gianna",
    "giulia", "alice", "sini", "marco", "anna", "gianna", "giulia", "alice", "sini", "marco", "anna", "gianna", "giulia", "alice", "sini")

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
    return ViewHolder(LayoutInflater.from(parent.context).inflate(R.layout.row_layout, parent, false))
}

override fun getItemCount(): Int {
    return personList.size
}

override fun onBindViewHolder(holder: ViewHolder, position: Int) {

    val element = personList[position]

    holder.text.text = element

    holder.text.setOnClickListener {
        onItemClick(position)
    }

    }

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        val text = itemView.findViewById<TextView>(R.id.textRow)
    }
}