使用自定义Animation,实现View的左右摇摆效果,如图所示:

15059064311.gif?2017017151530

代码很简单,直接上源码

activity_maini.xml布局文件:

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#ffffff"

android:gravity="center"

android:orientation="vertical">

android:id="@+id/iv_dial"

android:layout_width="200dp"

android:layout_height="200dp"

android:src="@drawable/img"/>

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="bottom"

android:gravity="center"

android:orientation="horizontal">

android:id="@+id/btn_start"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="开始"/>

android:id="@+id/btn_end"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="结束"/>

也可以用其它的View控件替代ImageView,都是可以实现摇摆效果的

主界面MainActivity

/**

* 主界面

* Created by zhuwentao on 2016-08-08.

*/

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

/** 表盘图片 */

private ImageView mDialIv;

/** 开始按钮 */

private Button mStartBtn;

/** 结束按钮 */

private Button mEndBtn;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

initUI();

initListener();

}

/**

* 初始化UI

*/

private void initUI() {

mDialIv = (ImageView) findViewById(R.id.iv_dial);

mStartBtn = (Button) findViewById(R.id.btn_start);

mEndBtn = (Button) findViewById(R.id.btn_end);

}

/**

* 初始化监听

*/

private void initListener() {

mStartBtn.setOnClickListener(this);

mEndBtn.setOnClickListener(this);

}

@Override

public void onClick(View v) {

switch (v.getId()) {

case R.id.btn_start:

showAnimation();

break;

case R.id.btn_end:

mDialIv.clearAnimation();

break;

}

}

/**

* 设置动画

*/

private void showAnimation() {

// 获取自定义动画实例

CustomRotateAnim rotateAnim = CustomRotateAnim.getCustomRotateAnim();

// 一次动画执行1秒

rotateAnim.setDuration(1000);

// 设置为循环播放

rotateAnim.setRepeatCount(-1);

// 设置为匀速

rotateAnim.setInterpolator(new LinearInterpolator());

// 开始播放动画

mDialIv.startAnimation(rotateAnim);

}

}

setRepeatCount()设置的是重复播放动画的次数,-1是为了让它循环播放,setRepeatCount(0)代表的是执行一次,setRepeatCount(1)代表重复1次,即动画执行2次。

setInterpolator()方法是设置插值器,用来指定动画的效果,这里使用系统提供的LinearInterpolator()匀速变化效果。

自定义的CustomRotateAnim动画需要继承Animation,这里只要实现它的initialize()和applyTransformation()方法就好

/**

* 左右摇摆动画

* Created by zhuwentao on 2016-08-08.

*/

public class CustomRotateAnim extends Animation {

/** 控件宽 */

private int mWidth;

/** 控件高 */

private int mHeight;

/** 实例 */

private static CustomRotateAnim rotateAnim;

/**

* 获取动画实例

* @return 实例

*/

public static CustomRotateAnim getCustomRotateAnim() {

if (null == rotateAnim) {

rotateAnim = new CustomRotateAnim();

}

return rotateAnim;

}

@Override

public void initialize(int width,int height,int parentWidth,int parentHeight) {

this.mWidth = width;

this.mHeight = height;

super.initialize(width,height,parentWidth,parentHeight);

}

@Override

protected void applyTransformation(float interpolatedTime,Transformation t) {

// 左右摇摆

t.getMatrix().setRotate((float)(Math.sin(interpolatedTime*Math.PI*2)*50),mWidth/2,mHeight/2);

super.applyTransformation(interpolatedTime,t);

}

}

initialize(int width,int parentHeight)中,width和height代表指定播放动画的View空间宽高,parentWidth和parentHeight代表该View控件所在的父控件宽高。

我们需要使用当前View的宽高来确定摇摆的旋转点,所以在initialize中获取View控件的宽高。

applyTransformation()方法是动画具体的实现方法,在系统绘制动画时会反复调用这个方法,每调用一次applyTransformation()方法,其中的interpolatedTime参数都会改变一次,值从0到1递增,当interpolatedTime的值为1时则动画结束。

Transformatio类是一个变换的矩阵,通过改变该矩阵就可以实现各种复杂的效果。

复写这个方法,在里面就可以实现我们自定义的动画效果了。

总结

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验,欢迎加入编程之家官方交流群!

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐