一直觉得知乎的交互体验是很好的,这次山寨了一把。 这是一个底部抽屉,类似知乎收藏夹。它可以悬停在中间,随着滑动自然过渡到全屏。 它是仿照support包里的DrawLayout和NavigationView设计的。
知乎收藏夹:
- 可以悬停在中间
- 可以滑动到全屏
- 过渡十分流畅,纵享丝滑
我的 HoverView :
- 可以悬停在中间
- 可以滑动到全屏
- 过渡尚可,没有知乎的流畅
http://blog.csdn.net/a153614131/article/details/53647831
底部抽屉,可以悬停、也可以全屏展示。适用于:
- 淘宝购物车
- 收藏夹
- 分享框
- ...
最新版本:1.0.2
// 1. Add it in your root build.gradle at the end of repositories: allprojects { repositories { ... maven { url 'https://jitpack.io' } } } // 2. Add the dependency in your app/build.gradle dependencies { compile 'com.github.fashare2015:HoverView:最新版本' }类似support包里的DrawLayout和NavigationView的关系。这里有两个View:
HoverViewContainer: 容器,对应DrawLayoutHoverView: 悬停抽屉,对应NavigationView
<com.fashare.hover_view.HoverViewContainer xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@android:color/darker_gray"> // 原本的 rootView ... <com.fashare.hover_view.HoverView android:id="@+id/hv" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" app:mTopFill="0.0" app:mTopHover="0.5"> // HoverView 的内容 ... </com.fashare.hover_view.HoverView> </com.fashare.hover_view.HoverViewContainer> 它有两个属性,描述 HoverView.getTop()占父容器的比例(Height 为父容器高度):
- app:mTopFill="0.0" 全屏时,距顶部 0.0Height(默认)
- app:mTopHover="0.5" 悬停时,距顶部 0.5Height
// 状态定义 public enum ViewState { FILL, // 全屏 HOVER, // 半空悬停 CLOSE; // 关闭: 完全藏在屏幕底部 } // 状态切换 —— 类似 View.setVisibility(); mHoverView.changeState(ViewState.HOVER); // 打开至 "悬停" 状态 mHoverView.changeState(ViewState.FILL); // 打开至 "全屏" 状态 mHoverView.changeState(ViewState.CLOSE); // 切换至 "关闭" 状态使用愉快~