功能强大的StickyHeaderListView:标题渐变、吸附悬停、筛选分类、动态头部
StickyHeaderListView 主要是通过 ListView 添加头部实现,将复杂的头部分解为若干部分,如下图:Header 1(广告位)、Header 2(频道位)、Header 3(运营位)、Header 4(分割线) 和 Header 5(筛选头部),这样各个Header部分的UI和逻辑可以单独拿出去处理,具体可以参考我的 开源代码。

StickyHeaderListView_sumary.png
Header 1: 它的高度影响标题栏的颜色渐变。
Header 2: 使用GridView实现,自定义FixedGridView,高度不受ListView的影响,一行显示几个自己可以根据需求设置。
Header 3: 和Header 2一样的实现方式,要注意的地方就是分割线的设置,我实现的思路是设置GridView的背景颜色的分割线的颜色,再设置如下的四个属性:paddingTop、paddingBottom、horizontalSpacing、verticalSpacing为1px,这样分割线就均等了。
android:background="@color/font_black_5"
android:paddingTop="1px"
android:paddingBottom="1px"
android:horizontalSpacing="1px"
android:verticalSpacing="1px"
Header 4: 这个头部布局是需求上的,UI加上整体更加好看,为什么我要单独拿出来,主要考虑到以下的原因:如果让Header 5达到吸附悬停的效果,需要知道Header 5到顶部的距离,如果把分割线加到Header 5上,那在移动的时候还需要减去这个高度;而如果加到Header 3上,Header 3是服务器动态配置的,如果没有Header 3的头部怎么办,那就加到Header 2上等,这样逻辑就比较麻烦,干脆我直接单独拿出来,作为一个头部布局动态添加。
Header 5: 这个筛选头部是个假的布局,主要处理未吸附悬停时的点击事件,点击之后滑动到顶部这时顶部的隐藏的筛选布局显示出来达到吸附悬停的效果。同时我将这个筛选布局定义一个 FilterView,将分类、排序和筛选的UI处理和逻辑封装起来,方便其它页面的二次使用。
还有两点需要特别注意:
一、如果数据不满一屏,比如就一条数据,那点击筛选它是没办法滑动到顶部的,因为她的高度不够,我的解决方法是添加若干个空数据,空数据的size是根据实际一屏要显示的个数减去现在的个数,这样可以达到整体可以滑动的高度,参考 TravelingAdapter 文件。
二、如果数据为空时并且我还需要无数据的占位图,如果在 ListView 底部加上无数据的布局这样的效果是不好的,所以我还在这个Adapter上做文章,让它加载一个无数据的视图布局,同样参考 TravelingAdapter 文件,每一个Item的高度: height = 屏幕的高度 - 标题栏高度 - 筛选View高度,这样设置一个这样的高度的Adapter,再 notifyDataSetChanged() 一下,整体的视图不会变化,无数据的占位图也自然而然的显示了。
github:https://github.com/sfsheng0322/StickyHeaderListView
功能强大的StickyHeaderListView:标题渐变、吸附悬停、筛选分类、动态头部的更多相关文章
- Android 滑动定位+吸附悬停效果实现
在前两篇文章中,分别介绍了tablayout+scrollview 和 tablayout+recyclerview 实现的滑动定位的功能,文章链接: Android 实现锚点定位 Android t ...
- jQuery功能强大的图片查看器插件
简要教程 viewer是一款功能强大的图片查看器jQuery插件.它可以实现ACDsee等看图软件的部分功能.它可以对图片进行移动,缩放,旋转,翻转,可以前后浏览一组图片.该图片查看器还支持移动设备, ...
- 简单使用Laravel-admin构建一个功能强大的后台管理
Laravel-admin可以快速构建一个功能强大的后台,方便快速开发. 以下内容记录简单使用Laravel-admin,以及遇到小错误的解决方法. Laravel-admin 依赖以下环境 需要提前 ...
- Postman - 功能强大的 API 接口请求调试和管理工具
Postman 是一款功能强大的的 Chrome 应用,可以便捷的调试接口.前端开发人员在开发或者调试 Web 程序的时候是需要一些方法来跟踪网页请求的,用户可以使用一些网络的监视工具比如著名的 Fi ...
- 功能强大的滚动播放插件JQ-Slide
查看效果:http://keleyi.com/keleyi/phtml/jqplug/4.htmJQ-Slide插件功能强大,滚动方式自由多样全部滚动方式 方式一 方式二 方式三 方式四 方式五 方式 ...
- 功能强大而又简单易学的编程语言Python
Python是一种面向对象.直译式计算机程序设计语言,也是一种功能强大的通用型语言.首先,Python非常简单,以Hello World为例: Java的Hello World程序一般这么写: pub ...
- 敏捷BI比传统BI功能强大是否属实?
关于大数据的资讯铺天盖地而来,让人眼花缭乱.虽然资讯很精彩,我们也看到了大数据背后的价值,很多企业选择了商业智能BI产品.商业智能在使用上可分为敏捷BI与传统BI,从名字来看敏捷BI要比传统BI显得利 ...
- [转载]什么是FCKeditor?功能强大的HTML编辑器!
天天在用FCKeditor写博客,但一直不清楚FCKeditor到底是什么,今天终于找到了一些相关的资料,大家一起来分享下. FCKeditor文本编辑程序(共享软件)为用户提供在线的文档编辑服务,其 ...
- 整合了一个功能强大完善的OA系统源码,php全开源 界面漂亮美观
整合了一个功能强大完善的OA系统源码,php全开源界面漂亮美观.需要的同学联系Q:930948049
随机推荐
- (转)python学习笔记4--数字类型与操作符
原文:https://blog.csdn.net/lemonwyc/article/details/37558269 1. 同时赋值(Simultaneous Assignments) python支 ...
- Java之集合(六)PriorityQueue
转载请注明源出处:http://www.cnblogs.com/lighten/p/7299233.html 1.前言 本章介绍队列中的PriorityQueue--优先队列,顾名思义,这是一个可以指 ...
- http正向代理与反向代理
转自:https://baijiahao.baidu.com/s?id=1566988836622068&wfr=spider&for=pc 一句话总结正向代理与反向代理的区别:正向代 ...
- centos6 和 centos7 网络配置
centos 6配置,1 vim /etc/sysconfig/network-scripts/ifcfg-eth0DEVICE="eth0" BOOTPROTO="st ...
- addEventListener和attachEvent的区别 分类: JavaScript 2015-05-12 19:03 702人阅读 评论(0) 收藏
addEventListener共有3个参数,如下所示:element.addEventListener(type,listener,useCapture); 参数 参数说明 element 要绑定事 ...
- curl的head小记
CURLINFO_HEADER_OUT,如果启用会在curl_getinfo里得到发送的头信息 CURLINFO_HEADER 如果启用,会在结果里返回回应的消息头信息
- SpringBoot入门 (三) 日志配置
上一篇博文记录了再springboot项目中读取属性文件中配置的属性,本文学习在springboot项目中记录日志. 日志记录在项目中是很常见的一个功能了,对排查问题有很大帮助,也可以做分类分析及统计 ...
- Windows 查看程序占用的端口
一. 查看所有进程占用的端口 在开始-运行-cmd,输入:netstat –ano可以查看所有进程 二.查看占用指定端口的程序 当你在用tomcat发布程序时,经常会遇到端口被占用的情况,我们想知 ...
- [CQOI 2018]异或序列&[Codeforces 617E]XOR and Favorite Number
Description 题库链接1 题库链接2 已知一个长度为 \(n\) 的整数数列 \(a_1,a_2,\cdots,a_n\) ,给定查询参数 \(l,r\) ,问在 \([l,r]\) 区间内 ...
- 【angular5项目积累总结】文件下载
download() { const token = localStorage.getItem('token'); let headers: HttpHeaders = new HttpHeaders ...