Android头像下拉缩放动效

mmxn 10年前

头像下拉缩放动效

头像下拉缩放这个在IOS中很常见,最近在Github上也看到了类似的效果,所以决定把它集成到我现在做的项目中去。
Github上的开源地址:https://github.com/Frank-Zhu/PullZoomView

先上1张效果图

<?xml version="1.0" encoding="utf-8"?>  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"      xmlns:custom="http://schemas.android.com/apk/res-auto"      android:layout_width="match_parent"      android:layout_height="match_parent"      android:background="@color/ECECEC" >        <include          android:id="@+id/head"          android:layout_width="match_parent"          android:layout_height="@dimen/dp160"          layout="@layout/include_head" />        <com.vclubs.ui.component.pulltozoomview.PullToZoomScrollViewEx          android:id="@+id/scroll_view"          android:layout_width="match_parent"          android:layout_height="match_parent"          android:layout_below="@id/head"          android:scrollbars="none" >      </com.vclubs.ui.component.pulltozoomview.PullToZoomScrollViewEx>    </RelativeLayout>

java文件中就是找到这个控件,然后引用了

scrollView = (PullToZoomScrollViewEx) findViewById(R.id.scroll_view);          View zoomView = LayoutInflater.from(this).inflate(R.layout.include_info_head, null, false);          View contentView = LayoutInflater.from(this).inflate(R.layout.include_info_content, null, false);          scrollView.setZoomView(zoomView);          scrollView.setScrollContentView(contentView);

我们只要注意PullToZoomScrollViewEx其中的三个方法:
setZoomView(View view)我们下拉的背景,也就是上面展示的图片(一辆小车)
setScrollContentView(View view)这个是我们填充的内容,也就是上图中的个人信息
setHeaderView(View view)这个是和下拉背景在一起的导航头,不过这个是没有动画效果的,我们可以把它做成登录,注册。

好了,这个开源框架的效果也就出来了,集成到我们项目中去,增加一点动效还是很亮眼的。希望你的项目也同样酷炫。



PullToZoomView的使用

这个开源框架的使用主要用到的是PullToZoomListViewEx和PullToZoomScrollViewEx的2个类库,PullToZoomListViewEx这个是ListView的下拉效果,暂时没用到,需要的话可能要自己去研究下了。 PullToZoomScrollViewEx这个是ScrollView,用的比较多,我们经常有用户信息界面、内容区域,都是信息量比较大的,会涉及到下拉之类的,这是我们就可以对一张头像进行下拉效果了。
我们将开源项目下载下来,将library的src目录下的代码copy到自己的工程下

记住还有values目录下的ids和attrs文件,同样copy

集成我们自己的项目

xml布局文件