专栏首页老欧说安卓Android开发笔记(十六)秋千摇摆动画SwingAnimation

Android开发笔记(十六)秋千摇摆动画SwingAnimation

上节博主介绍了AlphaAnimation和淡入淡出动画的使用,其实AlphaAnimation只是四种补间动画中的一种。那么为了加深对其他补间动画的理解,我想说说旋转动画RotateAnimation的使用,刚好工作中就有类似的应用场景,正好介绍一下。像我们生活中有许多左右摇摆的画面,比如说老式挂钟的钟摆围绕着竖轴左右摇摆,又比如说公园里人们坐在秋千上荡来荡去,这么一想,嗯,这左右摇摆的秋千动画确实贴近生活。 如果我们把钟摆或者秋千想象成一个线段,这个线段以上面的端点为圆心,先从垂直向下的角度向左旋转;转到一定角度,再向右旋转,同样旋转摆到左边的高度;接着再向左旋转,等到这个线段摆到垂直向下时,就完成了摇摆动作的一个循环。这么看,摇摆动画似乎与旋转动画有些关联,再仔细想想,这摇摆动画其实就是由三段旋转动画衔接起来的呀,先是向左旋转60度,然后向右旋转120度,最后向左旋转60度。所以看看能不能从旋转动画RotateAnimation源码中找找思路。 分析RotateAnimation的源码,我们看到RotateAnimation继承自Animation,除了几个构造函数与初始化函数之外,起主要作用的便是applyTransformation函数。

    protected void applyTransformation(float interpolatedTime, Transformation t) {
        float degrees = mFromDegrees + ((mToDegrees - mFromDegrees) * interpolatedTime);
        float scale = getScaleFactor();
        
        if (mPivotX == 0.0f && mPivotY == 0.0f) {
            t.getMatrix().setRotate(degrees);
        } else {
            t.getMatrix().setRotate(degrees, mPivotX * scale, mPivotY * scale);
        }
    }

该函数的输入参数interpolatedTime表示插值时间(百分比),代码内部的degrees表示在该插值时间的位置度数,scale默认1就不管了。mFromDegrees表示该动画的起始度数,mToDegrees表示该动画的终止度数,都是在初始化时传入的参数。后面代码中的mPivotX和mPivotY,前一个表示旋转圆心的X坐标,后一个表示旋转圆心的Y坐标,默认以图形左上的顶点为圆心(mPivotX=0.0f,mPivotY=0.0f)。如果不是默认圆心,则要以指定坐标为圆心进行旋转。 由此看来,摇摆动画有几个地方需要加以调整: 1、旋转动画初始化时只有两个度数:起始度数、终止度数。摇摆动画则需三个参数:中间度数(既是起始度数也是终止度数)、摆到左侧的度数、摆到右侧的度数。 2、根据插值时间估算当前所处的度数,摇摆动画需要做三个分支判断(对应之前说的摇摆动画由三段旋转动画衔接而成)。如果整个动画持续4秒,那么0-1秒之间是往左的旋转动画,起始度数为中间度数,终止度数为摆到左侧的度数;1-3秒之间是往右的旋转动画,起始度数为摆到左侧的度数,终止度数为摆到右侧的度数;3-4秒之间是往左的旋转动画,起始度数为摆到右侧的度数,终止度数为中间度数。 分析完了,贴上修改后的摇摆动画代码

import android.view.animation.Animation;
import android.view.animation.Transformation;

public class SwingAnimation extends Animation {
    private float mMiddleDegrees;
    private float mLeftDegrees;
    private float mRightDegrees;
    private int mPivotXType = ABSOLUTE;
    private int mPivotYType = ABSOLUTE;
    private float mPivotXValue = 0.0f;
    private float mPivotYValue = 0.0f;
    private float mPivotX;
    private float mPivotY;

    public SwingAnimation(float middleDegrees, float leftDegrees, float rightDegrees) {
        mMiddleDegrees = middleDegrees;
        mLeftDegrees = leftDegrees;
        mRightDegrees = rightDegrees;
        mPivotX = 0.0f;
        mPivotY = 0.0f;
    }

    public SwingAnimation(float middleDegrees, float leftDegrees, float rightDegrees, float pivotX, float pivotY) {
        mMiddleDegrees = middleDegrees;
        mLeftDegrees = leftDegrees;
        mRightDegrees = rightDegrees;
        mPivotXType = ABSOLUTE;
        mPivotYType = ABSOLUTE;
        mPivotXValue = pivotX;
        mPivotYValue = pivotY;
        initializePivotPoint();
    }

    public SwingAnimation(float middleDegrees, float leftDegrees, float rightDegrees, int pivotXType, float pivotXValue,
            int pivotYType, float pivotYValue) {
    	mMiddleDegrees = middleDegrees;
        mLeftDegrees = leftDegrees;
        mRightDegrees = rightDegrees;
        mPivotXValue = pivotXValue;
        mPivotXType = pivotXType;
        mPivotYValue = pivotYValue;
        mPivotYType = pivotYType;
        initializePivotPoint();
    }

    private void initializePivotPoint() {
        if (mPivotXType == ABSOLUTE) {
            mPivotX = mPivotXValue;
        }
        if (mPivotYType == ABSOLUTE) {
            mPivotY = mPivotYValue;
        }
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        float degrees;
        float leftPos = (float) (1.0/4.0);
        float rightPos = (float) (3.0/4.0);
        if (interpolatedTime <= leftPos) {
        	degrees = mMiddleDegrees + ((mLeftDegrees - mMiddleDegrees) * interpolatedTime * 4);
        } else if (interpolatedTime > leftPos && interpolatedTime < rightPos) {
        	degrees = mLeftDegrees + ((mRightDegrees - mLeftDegrees) * (interpolatedTime-leftPos) * 2);
        } else {
        	degrees = mRightDegrees + ((mMiddleDegrees - mRightDegrees) * (interpolatedTime-rightPos) * 4);
        }
        System.out.println("degrees="+degrees);
        
        float scale = getScaleFactor();
        if (mPivotX == 0.0f && mPivotY == 0.0f) {
            t.getMatrix().setRotate(degrees);
        } else {
            t.getMatrix().setRotate(degrees, mPivotX * scale, mPivotY * scale);
        }
    }
    
    @Override
    public void initialize(int width, int height, int parentWidth, int parentHeight) {
        super.initialize(width, height, parentWidth, parentHeight);
        mPivotX = resolveSize(mPivotXType, mPivotXValue, width, parentWidth);
        mPivotY = resolveSize(mPivotYType, mPivotYValue, height, parentHeight);
    }
}

调用的代码如下

import com.example.exmswing.ui.SwingAnimation;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends Activity implements OnClickListener {

	private ImageView iv_swing;
	private SwingAnimation swingAnimation;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		Button btn_play = (Button) findViewById(R.id.btn_play);
		btn_play.setOnClickListener(this);
		iv_swing = (ImageView) findViewById(R.id.iv_swing);
		//参数取值说明:中间度数、摆到左侧的度数、摆到右侧的度数、圆心X坐标类型、圆心X坐标相对比例、圆心Y坐标类型、圆心Y坐标相对比例
		//坐标类型有三种:ABSOLUTE 绝对坐标,RELATIVE_TO_SELF 相对自身的坐标,RELATIVE_TO_PARENT 相对上级视图的坐标
		//X坐标相对比例,为0时表示左边顶点,为1表示右边顶点,为0.5表示水平中心点
		//Y坐标相对比例,为0时表示上边顶点,为1表示下边顶点,为0.5表示垂直中心点
		swingAnimation = new SwingAnimation(
				0f, 60f, -60f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.0f); 
		swingAnimation.setDuration(4000);     //动画持续时间
		swingAnimation.setRepeatCount(0);     //动画重播次数
		swingAnimation.setFillAfter(false);  //是否保持动画结束画面
		swingAnimation.setStartOffset(500);   //动画播放延迟
	}

	@Override
	public void onClick(View v) {
		if (v.getId() == R.id.btn_play) {
			iv_swing.startAnimation(swingAnimation);
		}
	}

}

下面是摇摆动画的效果图

点击下载本文用到的秋千摇摆动画代码

点此查看Android开发笔记的完整目录

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Android开发笔记(一百六十六)H5通过WebView录像上传

    前面的博文《Android开发笔记(一百五十二)H5通过WebView上传图片》介绍了如何拍照上传给网页,不料客户又要求再加个...

    用户4464237
  • Android开发笔记(一百零七)统计分析SDK

    对程序员来说,用户画像就是用户的属性和行为;通俗地说,用户画像是包括了个人信息、兴趣爱好、日常行为等血肉丰满的客户实体。用户画像是精准营销的产物,企业通过收...

    用户4464237
  • Android开发笔记(五十一)通过Messenger实现进程间通信

    IPC是“Inter-Process Communication”的缩写,即进程间通信。Android为APP提供了多进程工作模式,这是因为多线程存在若干局...

    用户4464237
  • 速看!2020年5月全国程序员工资最新发布

    据悉,2020年5月全国招收程序员312761人。2020年5月全国程序员平均工资14542元,工资中位数12500 元,其中95%的人的工资介于5250元到3...

    老九君
  • 英特尔入股大数据初创企业Cloudera

    3月28日消息,据路透社报道,英特尔周四表示,公司已向大数据软件初创公司Cloudera投入大笔资金,并已成为该公司最大的战略股东。英特尔希望通过此投资来扩大其...

    小莹莹
  • 汤晓鸥为CNN搓了一颗大力丸

    是重新搭一个模型呢,还是拿来新数据重新调参,在这个已经训练好的模型上搞迁移学习呢?

    量子位
  • CTF| 吃个鸡,一起破流量分析题吧!

    流量分析题是CTF杂项类常见的一种考点,考察我们分析网络流量包的能力。一般flag隐藏在某个数据包里面,或者需要从中提取一个文件出来等等,还有wifi的握手包,...

    漏斗社区
  • Serverless Framework + OCR 快速搭建通用文字识别应用

    在日常的工作生活中,文字识别与我们息息相关,比如身份证识别、随手拍扫描、纸质文档电子化等,无不显示着文字识别技术的重要性。为此,腾讯云通用文字识别产品 Gen...

    腾讯云serverless团队
  • 如何用typescript 来写一个jquery 插件的 d.ts

    1、Jquery 方法  。比如$.ajax( )    $.trim( )   它们特点就是直接绑在jquery 自身上。

    申君健
  • 产业互联网浪潮下,CRM 如何赋能客户数字化?

    2018年10月,当马化腾在全球合作伙伴大会上提到“伴随数字化进程,移动互联网的主战场,正在从上半场的消费互联网,向下半场的产业互联网方向发展,”的时候,“产业...

    人称T客

扫码关注云+社区

领取腾讯云代金券