Android自定义Animation实现View摇摆效果

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

代码很简单,直接上源码

activity_maini.xml布局文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  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">

  <!--图片-->
  <ImageView
    android:id="@+id/iv_dial"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:src="@drawable/img"/>

  <!--控制按钮-->
  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:gravity="center"
    android:orientation="horizontal">

    <Button
      android:id="@+id/btn_start"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="开始"/>

    <Button
      android:id="@+id/btn_end"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="结束"/>

  </LinearLayout>

</LinearLayout>

也可以用其它的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 height, int parentWidth, int parentHeight)中,width和height代表指定播放动画的View空间宽高,parentWidth和parentHeight代表该View控件所在的父控件宽高。
我们需要使用当前View的宽高来确定摇摆的旋转点,所以在initialize中获取View控件的宽高。

applyTransformation()方法是动画具体的实现方法,在系统绘制动画时会反复调用这个方法,每调用一次applyTransformation()方法,其中的interpolatedTime参数都会改变一次,值从0到1递增,当interpolatedTime的值为1时则动画结束。
Transformatio类是一个变换的矩阵,通过改变该矩阵就可以实现各种复杂的效果。
复写这个方法,在里面就可以实现我们自定义的动画效果了。

(0)

相关推荐

  • Android 中 Tweened animation的实例详解

    Android 中 Tweened animation的实例详解 Tweened animation有四种类型,下面主要介绍Scale类型. 运行效果如下: Android SDK提供了2种方法:直接从XML资源中读取Animation,使用Animation子类的构造函数来初始化Animation对象,第二种方法在看了Android SDK中各个类的说明就知道如何使用了,下面简要说明从XML资源中读取Animation.XML资源中的动画文件animation.xml内容为: <?xml ve

  • Android SpringAnimation弹性动画解析

    也许你想在Android上实现这种反弹的动画效果.Android Support Library 25.3.0引入了Dynamic-animation增强动画,里面提供了几个类用于使动画呈现实现真实的物理效果. 你会想,自己的动画里加上 BounceInterpolator或OvershootInterpolator 插值器也能达到这种效果,然而实际上达不到.当然你也可以自己写插值器,如果你不嫌麻烦的话. SpringAnimation弹性动画实现方法 gradle引入,最低支持API16 de

  • Android Animation实战之一个APP的ListView的动画效果

    熟悉了基础动画的实现后,便可以试着去实现常见APP中出现过的那些精美的动画.今天我主要给大家引入一个APP的ListView的动画效果: 当展示ListView时,Listview的每一个列表项都按照规定的动画显示出来. 说起来比较抽象,先给大家看一个动画效果,这是APP窝牛装修的ListView显示动画: 有木有觉得很酷炫?有木有啊!? 一.Layout Animation     所谓的布局动画,其实就是为ViewGroup添加显示动画效果,主要用过LayoutAnimationContro

  • Android Animation实战之屏幕底部弹出PopupWindow

    Android动画的一个实战内容,从屏幕底部滑动弹出PopupWindow. 相信这种效果大家在很多APP上都遇到过,比如需要拍照或者从SD卡选择图片,再比如需要分享某些东西时,大多会采用这么一种效果: 那这种效果如何实现呢? 我们仿写一个这种效果的实例吧: 1)我们首先定义一下,弹出窗口的页面布局组件:take_photo_pop.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout

  • Android动画之逐帧动画(Frame Animation)实例详解

    本文实例分析了Android动画之逐帧动画.分享给大家供大家参考,具体如下: 在开始实例讲解之前,先引用官方文档中的一段话: Frame动画是一系列图片按照一定的顺序展示的过程,和放电影的机制很相似,我们称为逐帧动画.Frame动画可以被定义在XML文件中,也可以完全编码实现. 如果被定义在XML文件中,我们可以放置在/res下的anim或drawable目录中(/res/[anim | drawable]/filename.xml),文件名可以作为资源ID在代码中引用:如果由完全由编码实现,我

  • Android xml实现animation的4种动画效果实例代码

    animation有四种动画类型:分别为alpha(透明的渐变).rotate(旋转).scale(尺寸伸缩).translate(移动),二实现的分发有两种,一种是javaCode,另外一种是XML,而我今天要说的是XML实现的方法,个人感觉javaCode的实现方法比xml要简单,所以有需要的可以自己去找找资料看看. 先给大家展示下效果图,如果大家感觉还不错,请继续往下阅读. 下面是我的四个xml文件,分别代表这四种动画类型. alpha.xml COde: <?xml version=&quo

  • Android动画之渐变动画(Tween Animation)详解 (渐变、缩放、位移、旋转)

    本文实例讲述了Android动画之渐变动画(Tween Animation).分享给大家供大家参考,具体如下: Android 平台提供了两类动画. 一类是Tween动画,就是对场景里的对象不断的进行图像变化来产生动画效果(旋转.平移.放缩和渐变). 第二类就是 Frame动画,即顺序的播放事先做好的图像,与gif图片原理类似. 下面就讲一下Tweene Animations. 主要类: Animation                  动画 AlphaAnimation          

  • Android自定义Animation实现View摇摆效果

    使用自定义Animation,实现View的左右摇摆效果,如图所示: 代码很简单,直接上源码 activity_maini.xml布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_

  • Android自定义ViewGroup实现标签流效果

    本文实例为大家分享了Android自定义ViewGroup实现标签流效果的具体代码,供大家参考,具体内容如下 自定义View,一是为了满足设计需求,二是开发者进阶的标志之一.随心所欲就是我等奋斗的目标!!! 效果 实现逻辑 明确需求 1.标签流效果;2.可以动态添加标签;3.标签需要有点击效果以及回调; 整理思路 既然要装载标签,就需要自定义ViewGroup ,而自定义ViewGroup 比较复杂的就是onLayout()中对子View的排版.既然是标签,在一行中一定要显示完整,在排版的时候注

  • Android自定义加载圈动画效果

    本文实例为大家分享了Android自定义加载圈动画展示的具体代码,供大家参考,具体内容如下 实现如下效果: 该效果图主要有3个动画: 1.旋转动画 2.聚合动画 3.扩散动画 以上3个动画都是通过ValueAnimator来实现,配合自定义View的onDraw()方法实现不断的刷新和绘制界面. 具体代码如下: package blog.csdn.net.mchenys.myanimationloading; import android.animation.Animator; import a

  • Android自定义HorizontalScrollView打造超强Gallery效果

    自从Gallery被谷歌废弃以后,Google推荐使用ViewPager和HorizontalScrollView来实现Gallery的效果.的确HorizontalScrollView可以实现Gallery的效果,但是HorizontalScrollView存在一个很大的问题,如果你仅是用来展示少量的图片,应该是没问题的,但是如果我希望HorizontalScrollView可以想ViewPager一样,既可以绑定数据集(动态改变图片),还能做到,不管多少图片都不会OOM(ViewPager内

  • Android自定义带加载动画效果的环状进度条

    最近闲来无事,自定义了一个环状进度条,话不多说直接上代码 : public class CircleProgressView extends View{ private Paint mCirPaint; private Paint mArcPaint; private Paint mTextPaint; private float radius=200; private int textsize=60; private int progress=68; private int stokeWidt

  • android自定义ViewPager水平滑动弹性效果

    android ViewPager是一个经常要用到的组件,但android系统本身为我们提供的ViewPager是没有任何效果的,只能是一页一页的滑动,这样会让人感觉很死板,在看一些知名大公司的App时,看到了他们的ViewPager在滑动到最开始或者最后的时候是有一个弹性效果的,使用起来感觉非常的好,于是乎就是百度搜了一下,在StackOverflow中看到一篇文章就是讲如何实现这个效果的. 先看下效果图:滑动到最后一页时仍然可以拉动-- 代码如下: package com.example.m

  • Android自定义水平或垂直虚线效果

    项目中有时候会用到虚线,怎么办?drawable下创建一个shape类型的xml文件绘制,然后引用到view的background下?如果用到虚线的地方很多呢?创建多个,分别引用?横向的还好说,竖向的呢?垂直的虚线,普通的创建是显示不出来的,如果需要,就要进行旋转等的操作.但是,还是那个问题,需要很多个怎么办?挨个创建? 完全没必要,写个自定义,对外暴露设置虚线属性的方法就行.源码如下: 最后的说明很重要!!! 最后的说明很重要!!! 最后的说明很重要!!! 效果图: 源码: Imaginary

  • Android自定义ScrollView实现放大回弹效果

    背景 在很多项目中我们都会用到ScrollView这个控件,因为ScrollView能够在屏幕内容多时下上滑动以适配加载的内容.但是ScrollView滑动时效果感觉太死板了,这个时候我们如果给它添加一个回弹的动画效果,会让界面交互更加舒服,提升用户体验效果. 自定义ScrollView 1.创建一个类,继承ScrollView并重写相应的构造函数 public class ZoomInScrollView extends ScrollView { public ZoomInScrollView

  • Android自定义边缘凹凸的卡劵效果

    所谓前人栽树,后人乘凉,在此感谢博主的贡献. 原文:边缘凹凸的卡劵效果 先上效果图: 我实现的效果和原博主实现的效果是不一样的,我是左右边缘凹凸,而博主是上下边缘凹凸.其实理解了原理,哪个边缘实现这个效果都是可以的. 实现原理: 直接在view边缘上画一个个白色的小圆来实现这种效果,这个view:CouponView 可以让它继承LinearLayout,通过重写onDraw()方法实现重新绘制的效果.最后在布局文件中使用该自定义CouponView即可. 画圆的个数如何确定: (这是原博主的经

  • Android自定义ScrollView实现放大回弹效果实例代码

    1,刚刚在别人开源的项目中看到了一个挺不错的用户体验,效果图如下: 2,那下面我们就来实现一下,首先看一下布局,由于一般只是我们包含头像的那部分方法,所以这里我们要把布局分成两部分,对应的布局文件效果图如下: 3,自定义ScrollView 第一步:创建一个类,继承自ScrollView,重写相应的构造函数 public class ZoomInScrollView extends ScrollView { public ZoomInScrollView(Context context) { t

随机推荐