android - RecycleView 2 columns with horizontally expandable card
问题描述
I'm looking for how to implement this with recycleview and layout manager like at the screenshots.
Grid with 2 columns (same size). Each card could be expanded by click overlapping its horizontal neighbour. And by click it'd collapse back to its original state.
解决方案
The question is solved by overriding RecyclerView.ItemDecoration. In the adapter we change item's property on click and call notifyItemChanged for clicked card and its neighbour.
Then, we attach Decorator to RecylceView (before assigning adapter).
gridView = findViewById(R.id.gridview_words_titles);
gridView.addItemDecoration(new OverlapDecoration());
And, after that inside OverlapDecoration class we could make all the changes we need to overlap cards. In my case, I just expand rectangle depends if it is right or left in pair.
View layout = view.findViewById(R.id.layout_words_full);
ViewGroup.LayoutParams params = layout.getLayoutParams();
params.width = (int) (width_px - 15 * scale);
And,
int horizOverlap;
if (itemPosition % 2 == 0) {
horizOverlap = (int) ((width_px - 20 * scale) / 2);
outRect.set(-horizOverlap, 0, 0, 0);
} else {
horizOverlap = (int) ((width_px - 5 * scale) / 2);
outRect.set(0, 0, -horizOverlap, 0);
}
推荐阅读
- kernel-module - Archiso 上的 insmod 交叉编译模块。可能吗?
- python - 如果选择的索引大于最大索引,程序继续以滚动形式计算索引(python)
- python - 在 SQL Server 查询的 WHERE 子句中引用或 INNER JOIN 一个 Pandas 数据帧值
- php - 如何从 php while 循环创建 csv 文件并将其保存到特定目录?
- javascript - 有人请解释一下为什么在 run() 函数中 return {1,3} 在为有趣的函数返回 {a,b} 工作时会抛出错误
- xcode - Xcode 不会打开统一项目
- ios - 为什么在函数中使用已发布变量的更新值没有得到反映?
- ruby - 如何在 Ruby 中将哈希数组转换为人类可读的字符串
- excel - 替换 Word 模板中的单词
- swift - 如何通过单击按钮反转布尔值和更改文本?