效果图
如图悬浮选项.gif,当用户滑动超过“地区、种类”选项时,选项不会消失,而是悬浮在最上方。这种设计方便用户随时进行选项操作。
实现原理
1.代码请点击我
2.其实有两层选项卡,如下图原理图.png。处于下层的是ListView的headerView,我们是看不到的。我们真正看到的是上层的选项卡,好像听着有些蒙X,我们可以看一下布局文件activity_main.xml。其中include中方的就是选项的布局。
3.之所以我们没有同时看到两层选项,是因为我们让上层的布局随着下层的布局走。通过监听ListView的OnScrollListener接口,我们使选项布局的bottomMargin取选项布局的自身高度和选项布局下面第一个item的getTop()的比较大的一个值,即可实现该效果。
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.MainActivity">
<ListView
android:id="@+id/lv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"></ListView>
<include
android:id="@+id/v_choice"
layout="@layout/choice"
android:layout_height="40dp"
android:layout_width="match_parent" />
</FrameLayout>
另一种方法
实现原理
同样是有两层布局,同样是监听Listview的OnScrollListener事件,不过这次不是让上层布局跟着下层布局走,而是让上层布局在“需要的时候”显示出来,在“不需要”的时候隐藏。“需要”即选项布局下第一个item滑到最上方,“不需要”则相反。
和上一种方法比较
优点:代码简单;
缺点:当选项有点击事件时,需要同时处理上下两层的事件,而第一种方法则只需处理上层的事件即可。