问题描述
我正在设计一个相对复杂的UI，我已经搜索了stackoverflow并且没有找到类似的设计。可能有很多方法，但是我想问专家如何实现这一目标，我想分享我的方法，并确保我以正确的方式来做。我的方法是我创建了带有标头和内部标头recycleview的recycleview，我正在使用h6ah4i（taken from github）开发的可扩展recycleview库。请告诉我是否有更好的方法。
以下图像预览是我想要获得的最终结果的实时模型。这不是实际的屏幕。我的问题是实现此目标的最佳方法是什么，我应该在recycleview标头中使用可扩展的recycleview还是可扩展的listview。我很感激任何作为方法或库的答案，它不必与我的代码相似。任何建议都欢迎。我希望这篇文章也能帮助像我这样的其他人寻找类似的解决方案。
RecycleView适配器
public class RecycleAdapterPlantSearch extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private static final int TYPE_HEADER = 0;
private static final int TYPE_ITEM = 1;
private List<Plants> plantsList;
private Context context;
private OnItemClickListener onItemClickListener;
public RecycleAdapterPlantSearch(Context context,List<Plants> plantsList,OnItemClickListener onClickListener) {
this.context = context;
this.plantsList = plantsList;
onItemClickListener = onClickListener;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent,int viewType) {
if (viewType == TYPE_ITEM) {
// Here Inflating your recyclerview item layout
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_view_plant_search_plant_item,parent,false);
return new ItemViewHolder(itemView,onItemClickListener);
} else if (viewType == TYPE_HEADER) {
// Here Inflating your header view
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_view_plant_search_header,false);
return new HeaderViewHolder(itemView,onItemClickListener);
} else return null;
}
@Override
public void onBindViewHolder(final RecyclerView.ViewHolder holder,int position) {
/*
position 0 is for header
*/
if (holder instanceof HeaderViewHolder) {
// setheadersdata_flag = true;
HeaderViewHolder headerViewHolder = (HeaderViewHolder) holder;
// You have to set your header items values with the help of model class and you can modify as per your needs
// Setup expandable feature and RecyclerView
RecyclerViewExpandableItemmanager expMgr = new RecyclerViewExpandableItemmanager(null);
SimpleDemoExpandableItemAdapter.OnListItemClickMessageListener clickListener = message -> {
Toast.makeText(context,message,Toast.LENGTH_SHORT).show();
};
List<BadgesVM> badgesVMList = null;
badgesVMList = new ArrayList() {{
add(new BadgesVM("447","Bienenfreundlich","bienenfreundlich",false));
add(new BadgesVM("320,322","Vogelfreundlich","vogelfreundlich",false));
add(new BadgesVM("321","Insektenfreundlich","insektenfreundlich",false));
add(new BadgesVM("445","Ökologisch wertvoll","oekologisch",false));
add(new BadgesVM("531","Schmetterlings freundlich","schmetterlings",false));
add(new BadgesVM("530","Heimische Pflanze'","heimische Pflanze'",false));
}};
// Create wrapped adapter: MyItemAdapter -> expMgr.createWrappedAdapter -> MyheaderfooterAdapter
RecyclerView.Adapter adapter;
adapter = new SimpleDemoExpandableItemAdapter(context,expMgr,badgesVMList,clickListener);
adapter = expMgr.createWrappedAdapter(adapter);
//adapter = new DemoheaderfooterAdapter(adapter,null);
headerViewHolder.recyclerViewExpandable.setAdapter(adapter);
headerViewHolder.recyclerViewExpandable.setLayoutManager(new linearlayoutmanager(context));
// NOTE: need to disable change animations to ripple effect work properly
((SimpleItemAnimator) headerViewHolder.recyclerViewExpandable.getItemAnimator()).setSupportsChangeAnimations(false);
expMgr.attachRecyclerView(headerViewHolder.recyclerViewExpandable);
} else if (holder instanceof ItemViewHolder) {
final ItemViewHolder itemViewHolder = (ItemViewHolder) holder;
itemViewHolder.plantDescText.setText(plantsList.get(position - 1).getDescription());
RequestOptions options = new RequestOptions()
.centerCrop()
.placeholder(R.drawable.background_small);
String imageUrl = APP_URL.BASE_ROUTE_INTERN + plantsList.get(position - 1).getimages().get(0).getSrcAttr();
Glide.with(context).load(imageUrl).apply(options).into(itemViewHolder.plantImg);
}
}
@Override
public int getItemViewType(int position) {
if (position == 0) {
return TYPE_HEADER;
}
return TYPE_ITEM;
}
@Override
public long getItemId(int position) {
return position;
}
// getItemCount increasing the position to 1. This will be the row of header
@Override
public int getItemCount() {
return plantsList.size() + 1;
}
public interface OnItemClickListener {
void OnItemClickListener(View view,int position);
void RecycleViewExTradetails(ChipGroup chipGroup);
void nestedRecycleViewsspecialOdd(RecyclerView nestedRecycleView);
}
private class HeaderViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
private TextView searchNameTxt,searchFamilyTxt,plantGroupTxt,plantFamilySearchTxt,ecologyFilterTxt,frostSearchTxt;
private ChipGroup chipGroup;
private Button filterSearchBtn;
private CardView ecologyCv;
private CardView detailSearchCv;
private RecyclerView recyclerViewExpandable;
public HeaderViewHolder(View headerView,OnItemClickListener onItemClickListener) {
super(headerView);
searchNameTxt = headerView.findViewById(R.id.textView_plant_search_header_plant_search);
searchFamilyTxt = headerView.findViewById(R.id.textView_plant_search_header_plant_search);
ecologyCv = headerView.findViewById(R.id.cardView_plant_search_header_ecology);
detailSearchCv = headerView.findViewById(R.id.cardView_plant_search_header_detail_search);
plantGroupTxt = headerView.findViewById(R.id.textView_plant_search_header_plant_group);
plantFamilySearchTxt = headerView.findViewById(R.id.textView_plant_search_header_plant_family);
ecologyFilterTxt = headerView.findViewById(R.id.textView_plant_search_header_ecology_filter);
frostSearchTxt = headerView.findViewById(R.id.textView_plant_search_header_frost_filter);
chipGroup = headerView.findViewById(R.id.chip_group_plant_search_header);
filterSearchBtn = headerView.findViewById(R.id.button_plant_search_header_filter_search);
recyclerViewExpandable = headerView.findViewById(R.id.expandable_list_view_plant_search);
searchNameTxt.setonClickListener(this);
searchFamilyTxt.setonClickListener(this);
ecologyCv.setonClickListener(this);
detailSearchCv.setonClickListener(this);
plantGroupTxt.setonClickListener(this);
plantFamilySearchTxt.setonClickListener(this);
ecologyFilterTxt.setonClickListener(this);
filterSearchBtn.setonClickListener(this);
frostSearchTxt.setonClickListener(this);
}
@Override
public void onClick(View view) {
onItemClickListener.OnItemClickListener(view,getAdapterPosition());
onItemClickListener.RecycleViewExTradetails(chipGroup);
}
}
public class ItemViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
private Button readMoreBtn;
private TextView plantDescText;
private ImageView plantImg;
public ItemViewHolder(View itemView,OnItemClickListener onItemClickListener) {
super(itemView);
plantDescText = itemView.findViewById(R.id.textView_plant_search_plants_item_description_text);
readMoreBtn = itemView.findViewById(R.id.button_plant_search_plant_item_read_more);
plantImg = itemView.findViewById(R.id.imageView_plant_search_plants_item_plant_image);
readMoreBtn.setonClickListener(this);
}
@Override
public void onClick(View view) {
onItemClickListener.OnItemClickListener(view,getAdapterPosition() - 1);
}
}
}
嵌套标头回收视图
public class SimpleDemoExpandableItemAdapter extends AbstractExpandableItemAdapter<SimpleDemoExpandableItemAdapter.MyGroupViewHolder,SimpleDemoExpandableItemAdapter.MyChildViewHolder> implements View.OnClickListener {
RecyclerViewExpandableItemmanager mExpandableItemmanager;
List<MyBaseItem> mItems;
OnListItemClickMessageListener mOnItemClickListener;
List<BadgesVM> badgesVMList;
Context context;
static class MyBaseItem {
public final int id;
public final String text;
public MyBaseItem(int id,String text) {
this.id = id;
this.text = text;
}
}
static abstract class MyBaseViewHolder extends AbstractExpandableItemViewHolder {
TextView textView;
Slider frostSlider;
RecyclerView detailRecycleView;
public MyBaseViewHolder(View itemView) {
super(itemView);
textView = itemView.findViewById(android.R.id.text1);
frostSlider = itemView.findViewById(R.id.slider_plant_search_expandable);
detailRecycleView = itemView.findViewById(R.id.recycle_view_plant_search_detail_search);
}
}
static class MyGroupViewHolder extends MyBaseViewHolder {
public MyGroupViewHolder(View itemView) {
super(itemView);
}
}
static class MyChildViewHolder extends MyBaseViewHolder {
public MyChildViewHolder(View itemView) {
super(itemView);
}
}
public SimpleDemoExpandableItemAdapter(Context context,RecyclerViewExpandableItemmanager expMgr,List<BadgesVM> badgesVMList,OnListItemClickMessageListener clickListener) {
mExpandableItemmanager = expMgr;
mOnItemClickListener = clickListener;
this.badgesVMList = badgesVMList;
this.context = context;
setHasstableIds(true); // this is required for expandable feature.
mItems = new ArrayList<>();
mItems.add(new MyBaseItem(0,"Filter nach ökologischen Kriterien"));
mItems.add(new MyBaseItem(1,"Frosthärte"));
mItems.add(new MyBaseItem(2,"Detailsuche"));
}
@Override
public int getGroupCount() {
return mItems.size();
}
@Override
public int getChildCount(int groupPosition) {
int childCount = 0;
int groupId = mItems.get(groupPosition).id;
if (groupId == 0) {
childCount = badgesVMList.size();
} else if (groupId == 1) {
childCount = 1; //contains only one item
} else if (groupId == 2) {
childCount = 1; //contains only one item
}
return childCount;
}
@Override
public long getGroupId(int groupPosition) {
// This method need to return unique value within all group items.
return mItems.get(groupPosition).id;
}
@Override
public long getChildId(int groupPosition,int childPosition) {
// This method need to return unique value within the group.
int groupId = mItems.get(groupPosition).id;
int childId = 0;
if (groupId == 0) {
badgesVMList.get(childPosition).getId();
} else if (groupId == 1) {
childId = 0;
} else if (groupId == 2) {
childId = 0;
}
return childId;
}
@Override
@NonNull
public MyGroupViewHolder onCreateGroupViewHolder(@NonNull ViewGroup parent,int viewType) {
View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_group_item_for_expandable_minimal,false);
MyGroupViewHolder vh = new MyGroupViewHolder(v);
vh.itemView.setonClickListener(this);
return vh;
}
@Override
@NonNull
public MyChildViewHolder onCreateChildViewHolder(@NonNull ViewGroup parent,int viewType) {
View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_child_item_for_expandable_minimal,false);
MyChildViewHolder vh = new MyChildViewHolder(v);
vh.itemView.setonClickListener(this);
return vh;
}
@Override
public void onBindGroupViewHolder(@NonNull MyGroupViewHolder holder,int groupPosition,int viewType) {
MyBaseItem group = mItems.get(groupPosition);
holder.textView.setText(group.text);
}
@Override
public void onBindChildViewHolder(@NonNull MyChildViewHolder holder,int childPosition,int viewType) {
int groupId = mItems.get(groupPosition).id;
if (groupId == 0) {
BadgesVM badgesVM = badgesVMList.get(childPosition);
holder.textView.setVisibility(View.VISIBLE);
holder.frostSlider.setVisibility(View.GONE);
holder.detailRecycleView.setVisibility(View.GONE);
holder.textView.setText(badgesVM.getName());
} else if (groupId == 1) {
holder.textView.setVisibility(View.GONE);
holder.frostSlider.setVisibility(View.VISIBLE);
holder.detailRecycleView.setVisibility(View.GONE);
} else if (groupId == 2) {
holder.textView.setVisibility(View.GONE);
holder.frostSlider.setVisibility(View.GONE);
holder.detailRecycleView.setVisibility(View.VISIBLE);
// Setup expandable feature and RecyclerView
RecyclerViewExpandableItemmanager expMgr = new RecyclerViewExpandableItemmanager(null);
DetailSearchExpandableItemAdapter.OnListItemClickMessageListener clickListener = message -> {
Toast.makeText(context,false));
}};
// Create wrapped adapter: MyItemAdapter -> expMgr.createWrappedAdapter -> MyheaderfooterAdapter
RecyclerView.Adapter adapter2;
adapter2 = new DetailSearchExpandableItemAdapter(context,clickListener);
adapter2 = expMgr.createWrappedAdapter(adapter2);
//adapter = new DemoheaderfooterAdapter(adapter,null);
holder.detailRecycleView.setAdapter(adapter2);
holder.detailRecycleView.setLayoutManager(new linearlayoutmanager(context));
// NOTE: need to disable change animations to ripple effect work properly
((SimpleItemAnimator) holder.detailRecycleView.getItemAnimator()).setSupportsChangeAnimations(false);
expMgr.attachRecyclerView(holder.detailRecycleView);
}
}
@Override
public boolean onCheckCanExpandOrCollapseGroup(@NonNull MyGroupViewHolder holder,int x,int y,boolean expand) {
// handles click event manually (to show Snackbar message)
return false;
}
@Override
public void onClick(View v) {
RecyclerView rv = RecyclerViewAdapterUtils.getParentRecyclerView(v);
RecyclerView.ViewHolder vh = rv.findContainingViewHolder(v);
int rootPosition = vh.getAdapterPosition();
if (rootPosition == RecyclerView.NO_POSITION) {
return;
}
// need to determine adapter local flat position like this:
RecyclerView.Adapter rootAdapter = rv.getAdapter();
int localFlatPosition = WrapperAdapterUtils.unwrapPosition(rootAdapter,this,rootPosition);
long expandablePosition = mExpandableItemmanager.getExpandablePosition(localFlatPosition);
int groupPosition = RecyclerViewExpandableItemmanager.getPackedPositionGroup(expandablePosition);
int childPosition = RecyclerViewExpandableItemmanager.getPackedPositionChild(expandablePosition);
String message;
if (childPosition == RecyclerView.NO_POSITION) {
// Clicked item is a group!
// toggle expand/collapse
if (mExpandableItemmanager.isGroupExpanded(groupPosition)) {
mExpandableItemmanager.collapseGroup(groupPosition);
message = "COLLAPSE: Group " + groupPosition;
} else {
mExpandableItemmanager.expandGroup(groupPosition);
message = "EXPAND: Group " + groupPosition;
}
} else {
// Clicked item is a child!
message = "CLICKED: Child " + groupPosition + "-" + childPosition;
}
mOnItemClickListener.onItemClicked(message);
}
public interface OnListItemClickMessageListener {
void onItemClicked(String message);
}
}
解决方法
您应该搜索可以为您完成大部分工作的图书馆，但是我不喜欢您选择的图书馆。它似乎不太灵活和简洁。我建议看一下Groupie，它的API很干净。另外，请检查Reddit以获得有关库的一些讨论。
如果您想自己编写，我想您可以解决而无需嵌套Adapter。只需创建一个“可扩展组”项目类型。然后，在getItemCount()中计算所有项目及其嵌套项目（展开时）。看看Groupie的源代码。
关于您的代码的一些其他反馈：
- 我将标题显式添加到您提供给适配器的项目列表中。因此，您可以提供
List<Plants>而不是List<Item>和HeaderItem来代替PlantsItem。这样，您就可以清楚地区分域模型（Plants）和适配器中的视图模型（项目）。 - 您的
onBindViewHolder()方法做的太多了。让您的ViewHolder子类来解决这个问题。使用抽象ViewHolder方法创建抽象bindTo(Item item)。然后在您的HeaderViewHolder子类中，并进行实际工作（在instanceof检查之后）。 - 看看view binding，它可以使您的代码更简洁。 （Kotlin也是如此。）
您可以使用ConcatAdapter将多个适配器与ViewHolders一起使用，这些适配器可以容纳不同类型的布局，即使是包含RecyclerViews的布局，我在上一个项目中也使用过，而且效果很好，您可以查看{{3 }}，仪表板模块使用多个适配器来具有不同类型的布局。
您还可以使用他们在Google here中使用的方法，以一种更好的方式拥有一个具有多种布局的适配器，从而将逻辑从适配器移动到ViewHolders及其包装类ViewBinders。 iosched app负责 调用onViewHolder，onCreateViewHolder并将数据类型绑定到ViewBinder，并将ViewBinder绑定到布局。有一篇关于如何在媒介中使用它的文章，如果可以找到的话，我会发布链接。您还可以查看我为动画创建的此示例，但以简单的形式使用ViewBinder来创建不同类型的布局。
下面是我希望在GridLayout中显示的数据和布局的类型以及顺序
val data = mutableListOf<Any>().apply {
// Add Vector Drawables
add(HeaderModel("Animated Vector Drawable"))
add(AVDModel(R.drawable.avd_likes))
add(AVDModel(R.drawable.avd_settings))
add(HeaderModel("Seekable Vector Drawable"))
add(SeekableVDModel(R.drawable.avd_compass_rotation))
add(SeekableVDModel(R.drawable.avd_views))
add(SeekableVDModel(R.drawable.avd_hourglass))
add(HeaderModel("Clocks"))
add(AVDModel(R.drawable.avd_clock_alarm))
add(AVDModel(R.drawable.avd_clock_clock))
add(AVDModel(R.drawable.avd_clock_stopwatch))
}
这些是我想在RecyclerView中使用的数据的对应类型，它们是这些类中与ViewHolder的类型和绑定以及布局。
private fun createViewBinders(): HashMap<ItemClazz,MappableItemBinder> {
val avdViewBinder = AVDViewBinder()
val seekableVDViewBinder = SeekableVDViewBinder()
val headViewBinder = HeaderViewBinder()
return HashMap<ItemClazz,MappableItemBinder>()
.apply {
put(
avdViewBinder.modelClazz,avdViewBinder as MappableItemBinder
)
put(
seekableVDViewBinder.modelClazz,seekableVDViewBinder as MappableItemBinder
)
put(
headViewBinder.modelClazz,headViewBinder as MappableItemBinder
)
}
}
并将数据列表设置为适配器，并让适配器调用绑定到数据的相应布局
val dataList:List<Any> = getVectorDrawableItemList()
val recyclerView = findViewById<RecyclerView>(R.id.recyclerView)
val adapter = MultipleViewBinderListAdapter(
createViewBinders(),RecyclerView.Adapter.StateRestorationPolicy.ALLOW
).apply {
submitList(dataList)
}
对于可扩展列表，使用iosched应用程序是实现此目标的一种好方法，该视频提供了有关如何在RecyclerVİewViewBinders中对可扩展项进行动画处理的视频。您可以在ViewHolder中设置状态，甚至可以使用MotionLayout从折叠状态展开到可扩展状态。无需任何第三方库和非常简洁的方式就可以完成所有操作。
