尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

Android达成RecyclerView粘性头部效果,模拟微信账单列表的月份标题平移

Android达成RecyclerView粘性头部效果,模拟微信账单列表的月份标题平移
📅 发布时间:2026/6/18 14:57:33

效果链接

https://live.csdn.net/v/494980

1、在res/values/colors.xml中添加:


#07C160#FF3B30

2、月份标题布局 (item_header.xml)



3、主布局 (activity_main.xml)



4、账单项布局 (item_bill.xml)



5、自定义StickyHeaderDecoration 类

/*** @author: 魏* @date: 2025/9/29* 自定义StickyHeaderDecoration类*/
public class StickyHeaderDecoration extends RecyclerView.ItemDecoration {private StickyHeaderListener listener;private View currentStickyView;private int currentStickyPosition = RecyclerView.NO_POSITION;private int lastTranslateY = 0;public StickyHeaderDecoration(StickyHeaderListener listener) {this.listener = listener;}@Overridepublic void onDrawOver(@NonNull Canvas c, @NonNull RecyclerView parent,@NonNull RecyclerView.State state) {super.onDrawOver(c, parent, state);// 查找当前需要置顶的月份标题位置int topChildPosition = findTopVisibleItemPosition(parent);if (topChildPosition == RecyclerView.NO_POSITION) {return;}// 获取当前月份标题位置int headerPosition = listener.getHeaderPositionForItem(topChildPosition);if (headerPosition == RecyclerView.NO_POSITION) {return;}// 获取或创建月份标题视图if (currentStickyPosition != headerPosition || currentStickyView == null) {currentStickyView = listener.getHeaderView(parent, headerPosition);measureHeaderView(currentStickyView, parent);currentStickyPosition = headerPosition;}// 计算标题绘制位置int nextHeaderPosition = findNextHeaderPosition(parent, topChildPosition);int translateY = 0;if (nextHeaderPosition != RecyclerView.NO_POSITION) {View nextHeader = parent.getChildAt(nextHeaderPosition - topChildPosition);if (nextHeader != null) {int bottom = currentStickyView.getBottom();int nextHeaderTop = nextHeader.getTop();// 当两个标题相遇时的动画效果if (nextHeaderTop < bottom) {translateY = nextHeaderTop - bottom;}}}// 平滑过渡动画if (Math.abs(translateY - lastTranslateY) > 1) {ValueAnimator animator = ValueAnimator.ofInt(lastTranslateY, translateY);animator.setDuration(200);animator.setInterpolator(new DecelerateInterpolator());animator.addUpdateListener(animation -> {parent.invalidate();});animator.start();lastTranslateY = translateY;}// 绘制月份标题c.save();c.translate(0, translateY);currentStickyView.draw(c);c.restore();}private int findTopVisibleItemPosition(RecyclerView parent) {LinearLayoutManager layoutManager = (LinearLayoutManager) parent.getLayoutManager();return layoutManager.findFirstVisibleItemPosition();}private int findNextHeaderPosition(RecyclerView parent, int position) {int itemCount = parent.getAdapter().getItemCount();for (int i = position + 1; i < itemCount; i++) {if (listener.isHeader(i)) {return i;}}return RecyclerView.NO_POSITION;}private void measureHeaderView(View headerView, ViewGroup parent) {int widthSpec = View.MeasureSpec.makeMeasureSpec(parent.getWidth(), View.MeasureSpec.EXACTLY);int heightSpec = View.MeasureSpec.makeMeasureSpec(parent.getHeight(), View.MeasureSpec.UNSPECIFIED);int childWidth = ViewGroup.getChildMeasureSpec(widthSpec,parent.getPaddingLeft() + parent.getPaddingRight(), headerView.getLayoutParams().width);int childHeight = ViewGroup.getChildMeasureSpec(heightSpec,parent.getPaddingTop() + parent.getPaddingBottom(), headerView.getLayoutParams().height);headerView.measure(childWidth, childHeight);headerView.layout(0, 0, headerView.getMeasuredWidth(), headerView.getMeasuredHeight());}
}

6、定义粘性头部监听接口

/*** @author: 魏* @date: 2025/9/29* 定义粘性头部监听接口*/
public interface StickyHeaderListener {// 判断是否是头部项boolean isHeader(int position);// 获取指定位置对应的头部位置int getHeaderPositionForItem(int itemPosition);// 获取头部视图View getHeaderView(RecyclerView parent, int headerPosition);
}

7、账单数据模型

/*** @author: 魏* @date: 2025/9/29* 数据模型与适配器* 账单数据模型*/
public class BillItem {public static final int TYPE_HEADER = 0;public static final int TYPE_ITEM = 1;private int type;private String month; // 用于标题private String date;  // 用于账单项private String description;private double amount;private boolean isIncome; // 收入或支出public BillItem(int type, String month, String date, String description, double amount, boolean isIncome) {this.type = type;this.month = month;this.date = date;this.description = description;this.amount = amount;this.isIncome = isIncome;}// Getter方法public int getType() { return type; }public String getMonth() { return month; }public String getDate() { return date; }public String getDescription() { return description; }public double getAmount() { return amount; }public boolean isIncome() { return isIncome; }
}

8、账单适配器实现

/*** @author: 魏* @date: 2025/9/29* 账单适配器实现*/
public class BillAdapter extends RecyclerView.Adapterimplements StickyHeaderListener {private List billItems;private Context context;public BillAdapter(Context context, List billItems) {this.context = context;this.billItems = billItems;}@Overridepublic int getItemViewType(int position) {return billItems.get(position).getType();}@NonNull@Overridepublic RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {if (viewType == BillItem.TYPE_HEADER) {View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_header, parent, false);return new HeaderViewHolder(view);} else {View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_bill, parent, false);return new BillViewHolder(view);}}@Overridepublic void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {BillItem item = billItems.get(position);if (holder instanceof HeaderViewHolder) {((HeaderViewHolder) holder).tvMonth.setText(item.getMonth());} else if (holder instanceof BillViewHolder) {BillViewHolder billHolder = (BillViewHolder) holder;billHolder.tvDate.setText(item.getDate());billHolder.tvDescription.setText(item.getDescription());// 设置金额颜色(收入绿色,支出红色)if (item.isIncome()) {billHolder.tvAmount.setTextColor(ContextCompat.getColor(context, R.color.green));billHolder.tvAmount.setText(String.format("+¥%.2f", item.getAmount()));} else {billHolder.tvAmount.setTextColor(ContextCompat.getColor(context, R.color.red));billHolder.tvAmount.setText(String.format("-¥%.2f", item.getAmount()));}}}@Overridepublic int getItemCount() {return billItems.size();}// StickyHeaderListener接口实现@Overridepublic boolean isHeader(int position) {return billItems.get(position).getType() == BillItem.TYPE_HEADER;}@Overridepublic int getHeaderPositionForItem(int itemPosition) {for (int i = itemPosition; i >= 0; i--) {if (isHeader(i)) {return i;}}return RecyclerView.NO_POSITION;}@Overridepublic View getHeaderView(RecyclerView parent, int headerPosition) {HeaderViewHolder holder = new HeaderViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.item_header, parent, false));holder.tvMonth.setText(billItems.get(headerPosition).getMonth());return holder.itemView;}public static class HeaderViewHolder extends RecyclerView.ViewHolder {TextView tvMonth;public HeaderViewHolder(@NonNull View itemView) {super(itemView);tvMonth = itemView.findViewById(R.id.tv_month);}}public static class BillViewHolder extends RecyclerView.ViewHolder {TextView tvDate;TextView tvDescription;TextView tvAmount;public BillViewHolder(@NonNull View itemView) {super(itemView);tvDate = itemView.findViewById(R.id.tv_date);tvDescription = itemView.findViewById(R.id.tv_description);tvAmount = itemView.findViewById(R.id.tv_amount);}}
}

9、Activity集成

/*** @param* @return* @author 魏* @time 2025/9/29 14:40*/
public class MainActivity extends AppCompatActivity {private RecyclerView recyclerView;private BillAdapter adapter;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);recyclerView = findViewById(R.id.recycler_view);recyclerView.setLayoutManager(new LinearLayoutManager(this));// 生成测试数据List billItems = generateTestData();adapter = new BillAdapter(this, billItems);recyclerView.setAdapter(adapter);// 添加粘性头部装饰器recyclerView.addItemDecoration(new StickyHeaderDecoration(adapter));}private List generateTestData() {List items = new ArrayList<>();// 添加测试数据items.add(new BillItem(BillItem.TYPE_HEADER, "2025年9月", null, null, 0, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月29日", "微信支付-超市购物", 128.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月28日", "微信支付-工资", 20000.00, true));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月27日", "微信支付-餐饮", 56.80, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月26日", "微信支付-超市购物", 128.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月25日", "微信支付-工资", 20000.00, true));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月24日", "微信支付-餐饮", 56.80, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月23日", "微信支付-超市购物", 128.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月22日", "微信支付-工资", 20000.00, true));items.add(new BillItem(BillItem.TYPE_ITEM, null, "9月21日", "微信支付-餐饮", 56.80, false));items.add(new BillItem(BillItem.TYPE_HEADER, "2025年8月", null, null, 0, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月31日", "水电费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月30日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月29日", "水电费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月28日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月27日", "水电费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月26日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月25日", "水电费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月24日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月23日", "水电费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月22日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_HEADER, "2025年7月", null, null, 0, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "7月29日", "旅游消费", 1200.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "7月28日", "电影票", 80.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月27日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月26日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月25日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月24日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月23日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月22日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月21日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月20日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月19日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月18日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月17日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月16日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月15日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月14日", "房租", 2500.00, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月13日", "旅游消费", 320.50, false));items.add(new BillItem(BillItem.TYPE_ITEM, null, "8月12日", "房租", 2500.00, false));return items;}
}

完整的示例地址:
https://gitee.com/weicongxiang/imitation-we-chat-bill-list.git

拿走,拿走!!!

相关新闻

  • m3u8转mp4软件中文版推荐与使用指南
  • Unity简易事件分发器
  • 题解:P12410 「知りたくなかった、失うのなら」

最新新闻

  • 如何在Chrome浏览器中快速生成和识别二维码:终极二维码处理技巧指南
  • 风力发电机运行数据的分析与应用技巧
  • 24CW系列EEPROM软件写保护与硬件地址配置实战指南
  • 深入解析T1023RDB开发板:从Power Architecture核心到高速接口的硬件设计实战
  • 如何实现Windows内核级硬件伪装:EASY-HWID-SPOOFER完整指南
  • 每日算法快闪赛:提升你的编程实力

日新闻

  • 5分钟掌握Python进化算法:Geatpy高性能优化工具完全指南
  • Microchip 24AA044 EEPROM选型与应用全指南:从参数解析到实战编程
  • 华为的鸿蒙到底有多牛?为什么称作遥遥领先?

周新闻

  • 3步解锁iOS设备:applera1n激活锁绕过完全指南
  • 39 2026 人工智能证书终极盘点,普通人选 AI 证书可以从这些方向入手
  • Redis 暴露公网有多危险?从端口检查到补救步骤

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号