ViewHolder 中的嵌套 RecyclerView 破坏了折叠工具栏布局
Posted
技术标签:
【中文标题】ViewHolder 中的嵌套 RecyclerView 破坏了折叠工具栏布局【英文标题】:Nested RecyclerView in ViewHolder breaks Collapsing Toolbar Layout 【发布时间】:2015-10-16 09:44:08 【问题描述】:我有一个垂直 RecyclerView 托管在 CoordinatorLayout 中,具有折叠工具栏布局。此 RecyclerView 的 ViewHolder 包含另一个带有 GridLayoutManager 的 RecyclerView。
这种嵌套的原因是内部 RecyclerView 显示的图片集合可以包含 1 到 20 张图片。我不知道会有多少张图片,但是Grid的span必须始终为3。每次绑定ViewHolder时,我都会调整RecyclerView的布局参数以适应内容。
如果没有 CollapsingToolBarLayout,这将非常有用。但是,如果有一个折叠工具栏,用我的手指在内部 RecyclerView 上滚动不会滚动折叠工具栏,但是在另一个项目上滚动。
再次强调,在绑定的 ViewHolder 中,如果我开始在嵌套的 RecyclerView 之外的任何其他项目上滚动,滚动工作正常。但是,如果我在嵌套的 RecyclerView 上开始滚动,它就会中断。
是否可以防止内部 RecyclerView 上的滚动拦截而只让 Parent 滚动?不过,我希望内部 RecyclerView 仍能处理点击次数。
这是该现象的 YouTube 链接:https://youtu.be/fzj7HmqskzU
这是父 RecyclerView 的 XML:
<android.support.design.widget.CoordinatorLayout 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_
android:layout_
tools:context=".MainActivityFragment">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_
android:layout_
android:scrollbars="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_
android:layout_>
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_
android:layout_
android:elevation="4dp"
app:contentScrim="?attr/colorPrimary"
app:layout_collapseParallaxMultiplier="0.7"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<View
android:id="@+id/header_view"
android:layout_
android:layout_
android:animateLayoutChanges="true"
android:background="@color/primary" />
<android.support.v7.widget.Toolbar
android:id="@+id/action_bar"
android:layout_
android:layout_
android:elevation="4dp"
app:layout_collapseMode="pin"
app:popupTheme="@style/Theme.AppCompat.NoActionBar"
app:theme="@style/Theme.AppCompat.NoActionBar" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
这是托管嵌套 RecyclerView 的主 ViewHolder:
public class SimpleAdapter extends RecyclerView.Adapter<SimpleAdapter.ViewHolder>
private static final int MODEL_OBJECT = 1;
private List<ModelObject> modelObjects;
private Context context;
private int imageSize;
public SimpleAdapter(List<ModelObject> modelObjects)
this.modelObjects = modelObjects;
setHasStableIds(true);
@Override
public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType)
context = viewGroup.getContext();
int screenWidth= context.getResources().getDisplayMetrics().widthPixels;
imageSize = screenWidth / 3;
final LayoutInflater inflater = LayoutInflater.from(context);
View itemView;
itemView = inflater.inflate(R.layout.fragment_main_row, viewGroup, false);
return new ViewHolder(itemView, viewType);
@Override
public void onBindViewHolder(ViewHolder viewHolder, final int position)
final ModelObject modelObject = modelObjects.get(position);
// set text
modelObject.setPosition(position + 1);
viewHolder.titleTextView.setText(modelObject.getTitle());
viewHolder.positionTextView.setText("" + (position + 1));
adjustsizes(viewHolder.recyclerView, modelObject, imageSize);
final NestedAdapter nestedAdapter = new NestedAdapter(modelObject.getPhotos());
// Create and set GridLayoutManager for RecyclerView
final GridLayoutManager recylerViewGridLayoutManager = new GridLayoutManager(context, 3);
recylerViewGridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup()
@Override
public int getSpanSize(int position)
return 1;
);
viewHolder.recyclerView.setAdapter(nestedAdapter);
viewHolder.recyclerView.setLayoutManager(recylerViewGridLayoutManager);
@Override
public int getItemViewType(int position)
return MODEL_OBJECT;
@Override
public int getItemCount()
return modelObjects.size();
@Override
public long getItemId(int position)
return modelObjects.get(position).hashCode();
private void adjustsizes(RecyclerView recyclerView, ModelObject modelObject, int imageSize)
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) recyclerView.getLayoutParams();
if (modelObject.getPhotos() != null)
Double numberOfRowsDouble = modelObject.getPhotos().size() / 3.0;
int numberOfRowsInt = (numberOfRowsDouble.intValue() < numberOfRowsDouble)
? numberOfRowsDouble.intValue() + 1
: numberOfRowsDouble.intValue();
params.height = imageSize * numberOfRowsInt;
public static class ViewHolder extends RecyclerView.ViewHolder
public int viewType;
public ViewGroup mContainer;
public View mDragHandle;
public TextView titleTextView;
public TextView positionTextView;
public RecyclerView recyclerView;
public ViewHolder(View itemView, int viewType)
super(itemView);
this.viewType = viewType;
mContainer = (ViewGroup) itemView.findViewById(R.id.container);
mDragHandle = itemView.findViewById(R.id.drag_handle);
titleTextView = (TextView) itemView.findViewById(R.id.title);
positionTextView = (TextView) itemView.findViewById(R.id.position);
recyclerView = (RecyclerView) itemView.findViewById(R.id.recycler_view);
最后,这是带有图片的嵌套子对象的适配器:
public class NestedAdapter extends RecyclerView.Adapter<NestedAdapter.PhotoViewHolder>
private static final int PHOTO = 1;
private Context context;
ArrayList<String> photos;
/**
* Default constructor, takes no data as nothing has been recieved from the API
*/
public NestedAdapter(ArrayList<String> photos)
this.photos = photos;
@Override
public PhotoViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType)
this.context = viewGroup.getContext();
View itemView;
switch (viewType)
default: // Load default Message layout as bucketLists all have the same layout
itemView = LayoutInflater.from(context).inflate(R.layout.fragment_photo_row, viewGroup, false);
break;
return new PhotoViewHolder(itemView, viewType);
@Override
public void onBindViewHolder(PhotoViewHolder viewHolder, final int position)
// Switch depending on the kind of View
switch (getItemViewType(position))
case PHOTO: // Subtract 1, padding has taken up a space
final String photo = photos.get(position);
Picasso.with(context)
.load(photo)
.placeholder(R.drawable.rocks) // Must use place holder or fit won't work!
.fit()
.centerCrop()
.into(viewHolder.photo);
break;
@Override
public int getItemViewType(int position)
return PHOTO;
@Override
public int getItemCount()
return photos.size();
// ViewHolder for actual content
public final static class PhotoViewHolder extends RecyclerView.ViewHolder
public int viewType; // Used to specify the view type.
public ImageView photo;
public PhotoViewHolder(View itemView, int ViewType)
super(itemView);
switch (ViewType)
case PHOTO:
viewType = PHOTO;
photo = (ImageView) itemView.findViewById(R.id.photo);
break;
【问题讨论】:
【参考方案1】:我在 RecyclerView 和 CollapsingToolbarLayout 中遇到了同样的问题,其中 RecyclerView 位于 NestedScrollView 子布局内。
对我来说,解决方案是以编程方式设置:
mRecyclerView.setNestedScrollingEnabled(false);
注意:我尝试在 XML 中的 RecyclerView 上进行设置,但没有成功?
android:nestedScrollingEnabled="false"
另一个让 CollapsingToolbarLayout 滚动的技巧是为 嵌套滚动视图
android:minHeight="1000dp"
为什么是 1000dp? SupportDesignDemos 示例在这里: https://android.googlesource.com/platform/development/+/e088638/samples/SupportDesignDemos/res/layout/include_appbar_scrollview.xml
布局:
<android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.AppBarLayout>
<android.support.design.widget.CollapsingToolbarLayout >
<ImageView/>
<android.support.v7.widget.Toolbar/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout android:minHeight="1000dp">
<android.support.v7.widget.RecyclerView
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
【讨论】:
这适用于嵌套在外部 RecyclerView 中的 RecyclerView,方法是在外部设置 setNestedScrollingEnabled(false)。【参考方案2】:mRecyclerView.setNestedScrollingEnabled(false);
【讨论】:
虽然此代码可能会回答问题,但提供有关它如何和/或为什么解决问题的额外上下文将提高答案的长期价值。【参考方案3】:因此,尽管上述情况仍然成立,但我找到了解决方法。
解决方法包括将 ViewHolder RecyclerView 包装在一个 RelativeLayout 中,并在其上覆盖一个透明的可点击视图。就我而言,我使用了 TextView。
现在虽然修复了滚动,但仍然存在将点击传递到 ViewHolderRecyclerView 中右侧 ViewHolder 的问题。为了解决第二个挫折,我扩展了 GestureDetector.SimpleOnGestureListener 类以包含一个 recyclerView。然后,我在 wrapperTextView 上设置了一个 OnTouchListener,然后将 MotionEvent 转发到 GestureDetector.SimpleOnGestureListener 子类。
子类最终解释运动事件并将其传递给内部的RecyclerView,RecyclerView依次从点击的坐标中计算出被点击的子视图并调用子视图的performClick()。
【讨论】:
以上是关于ViewHolder 中的嵌套 RecyclerView 破坏了折叠工具栏布局的主要内容,如果未能解决你的问题,请参考以下文章
Recyclerview ViewHolder中的TextView - OnClickListener
ViewHolder 中的 kotlin-android-extensions
ViewHolder 中的 onClick 无权访问适配器中的单击项目
DataBinding:如何使用 Kotlin 中的泛型创建具有多个 ViewHolder(多个布局)的 Recyclerview