仿联通首页搜索框上推，多级(个)分类悬停的简单实现

仿联通首页搜索框上推，多级(个)分类悬停的简单实现

前言

之前讲了三篇嵌套滑动相关的文章了，今天这个是最后一个嵌套滑动相关的文章了，这四篇文章基本涵盖了市面所有的嵌套滑动类型，一般也不会有比这更难搞的了。所以后面基本不会再出相关的文章了，如果有可能也只会有原理性的文章了。

今天这篇是仿联通首页的搜索框上推（还有美团外卖等，如图），且有2个悬停项的多级联动嵌套。初看一下是非常难搞的嵌套滑动，因为这里有两个悬停加一个搜索框上推，以前讲的都是单个悬停加一个搜索框的上推。其实细看，这里就多了一个中间的悬停（这里用橙色的表示），目前主要是如何让中间橙色部分悬停住，其他部分用之前讲的就可以了。

原理

通过上面的分析知道，如何让中间那个橙色的view悬停是关键。我们可以转换下思路，其实这里用两个橙色view（分别用标号1，2表示），当一个橙色view（标号1）向上滑到指定位置后，把预先藏起来的橙色view（标号2）给显示出来。直接把下面可滑动的橙色view（标号1）盖住，此时用户继续向上滑动，看到了橙色view（标号2）悬停在顶部不动了，但其实橙色view（标号1）仍然在继续向上滑动，只是用户看不见罢了; 当可滑动的橙色view（标号1）向下滑动，离开指定位置时，让预先准备的橙色view（标号2）不再显示出来，用户看到向下继续滚动的橙色view（标号1）。原理就这么简单，因为太简单了，所以就直接上代码了。有兴趣的下载demo看看。

总结

把之前的几篇文章联合起来看后，会发现这是最简单的一篇。因为基本就是xml，根本无需代码的修改，基本是官方的原生支持，只是会有一次思路的转换。问题的关键还是看大家能否把比较难的效果进行简单的拆分，其实在写这篇文章之前我也不知道联通的实现方式是什么，只是结合之前的思路进行的尝试罢了，最终发现方案可行。（附：网上搜了一下这种多级悬停的方案，居然一个都没搜索到，不知是太简单了，还是太难了，都没有人写，大家权当参考，有问题联系我）

下载

标签：标号,嵌套,上推,首页,滑动,悬停,橙色,view
来源： https://blog.csdn.net/hzmming2008/article/details/115575232