视差特效 
* 应用场景: 微信朋友圈, QQ空间, 微博个人展示,向下拉出,松开回弹
* 功能实现:
> 1. 重写overScrollBy

> 2. 松手之后执行动画, 类型估值器

activity_main
  1. <RelativeLayout 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=".MainActivity" >
    <com.itheima.parallaxdemo.ui.MyListView
    android:id="@+id/lv"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
    </RelativeLayout>
view_header
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <ImageView
    android:id="@+id/iv"
    android:layout_width="match_parent"
    android:layout_height="160dp"
    android:scaleType="centerCrop"
    android:src="@drawable/parallax_img" />
    </LinearLayout>
MyListView
  1. /**
    * 视差特效ListView
    * overScrollBy
    * @author poplar
    *
    */
    public class MyListView extends ListView {
    private static final String TAG = "TAG";
    private int mOriginalHeight;
    private int drawableHeight;
    private ImageView mImage;
    public MyListView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    }
    public MyListView(Context context, AttributeSet attrs) {
    super(context, attrs);
    }
    public MyListView(Context context) {
    super(context);
    } /**
    * 设置ImageView图片, 拿到引用
    * @param mImage
    */
    public void setParallaxImage(ImageView mImage) {
    this.mImage = mImage;
    mOriginalHeight = mImage.getHeight(); // 160
    drawableHeight = mImage.getDrawable().getIntrinsicHeight(); // 488,图片的高,而不是显示的高 Log.d(TAG, "height: " + mOriginalHeight + " drawableHeight: " + drawableHeight);
    } @Override
    protected boolean overScrollBy(int deltaX, int deltaY,
    int scrollX, int scrollY, int scrollRangeX, int scrollRangeY,
    int maxOverScrollX, int maxOverScrollY, boolean isTouchEvent) {
    // deltaY : 竖直方向的瞬时偏移量 / 变化量 dx 顶部到头下拉为-, 底部到头上拉为+
    // scrollY : 竖直方向的偏移量 / 变化量
    // scrollRangeY : 竖直方向滑动的范围
    // maxOverScrollY : 竖直方向最大滑动范围
    // isTouchEvent : 是否是手指触摸滑动, true为手指, false为惯性 Log.d(TAG, "deltaY: " +deltaY + " scrollY: " + scrollY + " scrollRangeY: " + scrollRangeY
    + " maxOverScrollY: " + maxOverScrollY + " isTouchEvent: " + isTouchEvent); // 手指拉动 并且 是下拉
    if(isTouchEvent && deltaY < 0){
    // 把拉动的瞬时变化量的绝对值交给Header, 就可以实现放大效果
    if(mImage.getHeight() <= drawableHeight){
    int newHeight = (int) (mImage.getHeight() + Math.abs(deltaY / 3.0f)); // 高度不超出图片最大高度时,才让其生效
    mImage.getLayoutParams().height = newHeight;
    mImage.requestLayout();
    }
    } return super.overScrollBy(deltaX, deltaY, scrollX, scrollY, scrollRangeX,
    scrollRangeY, maxOverScrollX, maxOverScrollY, isTouchEvent);
    } @Override
    public boolean onTouchEvent(MotionEvent ev) { switch (ev.getAction()) {
    case MotionEvent.ACTION_UP:
    // 执行回弹动画, 方式一: 属性动画\值动画
    // 从当前高度mImage.getHeight(), 执行动画到原始高度mOriginalHeight
    final int startHeight = mImage.getHeight();
    final int endHeight = mOriginalHeight; // valueAnimator(startHeight, endHeight);
    // 执行回弹动画, 方式二: 自定义Animation
    ResetAnimation animation = new ResetAnimation(mImage, startHeight, endHeight);
    startAnimation(animation); break;
    }
    return super.onTouchEvent(ev);
    }
    private void valueAnimator(final int startHeight, final int endHeight) {
    ValueAnimator mValueAnim = ValueAnimator.ofInt(1);//不起作用,写几都行
    mValueAnim.addUpdateListener(new AnimatorUpdateListener() { @Override
    public void onAnimationUpdate(ValueAnimator mAnim) {
    float fraction = mAnim.getAnimatedFraction();
    // percent 0.0 -> 1.0
    Log.d(TAG, "fraction: " +fraction);
    Integer newHeight = evaluate(fraction, startHeight, endHeight);//固值器
    mImage.getLayoutParams().height = newHeight;//设置imageview高度
    mImage.requestLayout();
    }
    }); mValueAnim.setInterpolator(new OvershootInterpolator());
    mValueAnim.setDuration(500);
    mValueAnim.start();
    } public Integer evaluate(float fraction, Integer startValue, Integer endValue) {
    int startInt = startValue;
    return (int)(startInt + fraction * (endValue - startInt));
    } }
ResetAnimation
  1. public class ResetAnimation extends Animation {
    private final ImageView mImage;
    private final int startHeight;
    private final int endHeight;
    public ResetAnimation(ImageView mImage, int startHeight, int endHeight) {
    this.mImage = mImage;
    this.startHeight = startHeight;
    this.endHeight = endHeight; setInterpolator(new OvershootInterpolator());
    //设置动画执行时长
    setDuration(500);
    }
    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
    // interpolatedTime 0.0f -> 1.0f Integer newHeight = evaluate(interpolatedTime, startHeight, endHeight);
    mImage.getLayoutParams().height = newHeight;//设置imageview高
    mImage.requestLayout(); super.applyTransformation(interpolatedTime, t);
    } /**
    * 类型估值器
    * @param fraction
    * @param startValue
    * @param endValue
    * @return
    */
    public Integer evaluate(float fraction, Integer startValue, Integer endValue) {
    int startInt = startValue;
    return (int)(startInt + fraction * (endValue - startInt));
    } }
  2.   MainActivity

  3. public class MainActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main); final MyListView mListView = (MyListView) findViewById(R.id.lv);
    mListView.setOverScrollMode(View.OVER_SCROLL_NEVER);
    // 加Header
    final View mHeaderView = View.inflate(MainActivity.this, R.layout.view_header, null);
    final ImageView mImage = (ImageView) mHeaderView.findViewById(R.id.iv);
    mListView.addHeaderView(mHeaderView); mHeaderView.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() { @Override
    public void onGlobalLayout() {
    // 当布局填充结束之后, 此方法会被调用
    mListView.setParallaxImage(mImage); mHeaderView.getViewTreeObserver().removeGlobalOnLayoutListener(this);
    }
    }); // 填充数据
    mListView.setAdapter(new ArrayAdapter<String>(MainActivity.this, android.R.layout.simple_list_item_1, Cheeses.NAMES)); }
    }

9.视差特效、回弹动画、overScrollBy的更多相关文章

  1. QQ视差特效和ListView侧滑删除

    如图所示是效果图,当向下拉时,图片会被拉出来,松手后恢复.和ListView的侧滑删除   1.视差特效 首先图片是通过addHeaderView加上去的,所以在设置Adapter前先设置一个View ...

  2. WPF特效-粒子动画

    原文:WPF特效-粒子动画 WPF实现泡泡龙小游戏效果.     /// -Ball to Ball Collision - Detection and Handling    /// http:// ...

  3. iOS Swift 实现图片点击缩放回弹动画

    效果就是下面这个样子: 思路借鉴的是MZTimerLabel,有想过做一个自定义的ImageView,但那样的话之前view用必须要改代码,索性就按照MZTimerLabel这个方式实现,简单易用,从 ...

  4. 测开之路一百零一:jquery文字特效、动画、方法链

    文字特效 html内容 1.卷起/展开 2.隐藏/显示 3.淡入淡出 <!DOCTYPE html><html lang="en"><head> ...

  5. 利用tween,使用原生js实现模块回弹动画效果

    最近有一个需求,就是当屏幕往下一定像素时,下方会有一个隐藏的模块马上显现出来,向上运动后带有回弹效果.然后屏幕滚回去时这个模块能够原路返回 其实这个效果css3就可以很轻松实现,但是公司要求最低兼容i ...

  6. 第五篇 jQuery特效与动画

    5.1 show()与hide()方法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  7. [一位菜鸟的COCOS-2D编程之路]COCOS2D中得动作,特效和动画

    一,CCActionManager 管理所有节点动作的对象 来看看打飞机里面的一个onEnter 方法 - (void)onEnter { [super onEnter]; //一定要注意添加此方法, ...

  8. css3实现的4种动画特效按钮

    今天要给大家介绍的是css3按钮,里面包含四种特效的动画,如下图: 在线预览    下载源码 实现html代码: <div align="center" class=&quo ...

  9. python 制作影视动画、电影特效工具

    一直觉得电影特效,动画制作这些都很什么,在google上搜索了下python开发电影特效的内容,发现了几个不错的软件,都支持python脚本开发. Houdini  Houdini (电影特效魔术师) ...

随机推荐

  1. chip8模拟器的python3实现-1-CHIP8简介

    打算编写一个NES模拟器,先从简单的chip8模拟器入手 1.CHIP-8简介 CHIP-8是一个解释型语言,由Joseph Weisbecker开发.最初CHIP-8在上个世纪70年代被使用在COS ...

  2. yum 安装时遇到“UnicodeDecodeError: 'ascii' codec”的问题

    今天新安装了一个6.9系统,配置好本地yum源后,用yum安装时报了以上的错误信息,在/etc/yum.repos.d/目录下多出了TTT的一个目录 (手动问号),在百度上查了一些文档. 解决方法:1 ...

  3. hibernate入门一

    ---恢复内容开始--- hibernate简介: 1.优秀的持久化(通俗讲把内存上的短时间运行信息存储在持久化硬盘上)框架. 2.作用于持久层,因为没什么侵入性,所以同样适用于其他层面上的存储 3. ...

  4. xbee PRO S2C的多固件烧写

    XBee and XBee-PRO ZB 嵌入式射频模块是与ZigBee/IEEE 802.15.4兼容的解决方案,可以满足低成本低功耗无线传感网络的特殊需求.该模块易于使用,极低的功耗,以及提供设备 ...

  5. Finish final project

    一.项目地址:https://github.com/Joyce45/final-project 二.团队成员陈述: 于浩: 张雨: 遇到的问题:1.通过relativepanel解决了刚开始设计上使用 ...

  6. spring实现一个简单的事务管理

    前两天给公司的数据库操作加了事务管理,今天博客就更一下这个吧. 先说明:本文只是简单得实现一下事务,事务的具体内容,比如事务的等级,事务的具体实现原理等等... 菜鸟水平有限,暂时还更不了这个,以后的 ...

  7. Unity自动生成AnimatorController

    上一篇写了如何自动切割动画,这一篇写如何自动生成AnimatorController. 之前网上查了很多资料,看的一直很蒙,看不懂是怎么回事的,这里我先给大家明确几个概念: 画的不好,大家将就着看,写 ...

  8. Eclipse搭建SSH框架(Struts2+Spring+Hibernate)

    见识少的我经过一天多的研究才知道,在MyEclipse中搭好的框架的配置文件和jar包是通用的.接下来——亮剑! 工具:Eclipse+Tomcat+Mysql 一.先在Eclipse中配置好Tomc ...

  9. spring配置问题

    产生原因缺少包common-logging-1.2.jar 在该字段所在的类中没有提供该字段的set方法.

  10. webpack简单教程

    1.初始化 安装node后,新建一个目录,比如html5.cmd中切到当前文件夹. npm init -y 这个命令会创建一个默认的package.json.它包含了项目的一些配置参数,通过它可以进行 ...