android 实现发散弹出view

来源:互联网 发布:新湖财富知乎 编辑:程序博客网 时间:2024/06/08 07:41

项目需求:点击一个ImageView 然后旋转弹出三个ImageView
其实这一种需求可以用自定义viewgroup然后使用补间动画translateanimation实现,不过需要注意的是,使用这一种方法,需要更改ImageView 的位置,要不然点击无效(补间动画不改变view属性)。
今天我使用第二种方法,使用属性动画实现;
先看下效果图:

1:更改透明图

ObjectAnimator.ofFloat(imageView1,"alpha",1f,0f)

2:更改位置
这里写图片描述

ObjectAnimator.ofFloat(imageView2, "translationY", y2,  0);

3:旋转

ObjectAnimator.ofFloat(imageView1,"rotation",0,360);//旋转

该需求中需要透明度,位置和旋转三种效果,所以创建AnimatorSet集合对象,然后start()即可;
需要注意的是:

 animatorSet1.play(anim1x).with(anim1y).with(alpha1).with(rotation1);//并列执行(after执行之后再执行)

然后before和after我就不测试了,感兴趣的可以试一下。

最后附上封装好的代码

package com.app.test.circleviewproject;import android.animation.AnimatorSet;import android.animation.ObjectAnimator;import android.content.Context;import android.util.AttributeSet;import android.util.Log;import android.view.View;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.TranslateAnimation;import android.widget.ImageView;import android.widget.RelativeLayout;import java.util.List;/** * Created by liumengqiang on 2017/5/9. */public class MyCircleView {//    private List<ImageView>    private String flug = "1";//1:展开 2:折叠    private ImageView imageView1;    private ImageView imageView2;    private ImageView imageView3;    private ObjectAnimator anim1x;    private ObjectAnimator anim1y;    private ObjectAnimator anim2x;    private ObjectAnimator anim2y;    private ObjectAnimator anim3x;    private ObjectAnimator anim3y;    private ObjectAnimator alpha1 ;    private ObjectAnimator alpha2 ;    private ObjectAnimator alpha3 ;    private ObjectAnimator rotation1;    private ObjectAnimator rotation2;    private ObjectAnimator rotation3;    private AnimatorSet animatorSet1 = new AnimatorSet();    private AnimatorSet animatorSet2 = new AnimatorSet();    private AnimatorSet animatorSet3 = new AnimatorSet();    public MyCircleView(ImageView imageView1, ImageView imageView2, ImageView imageView3) {        this.imageView1 = imageView1;        this.imageView2 = imageView2;        this.imageView3 = imageView3;    }    public void setAnimation1(){        imageView1.setClickable(true);        imageView2.setClickable(true);        imageView3.setClickable(true);        anim1x = ObjectAnimator//                .ofFloat(imageView1, "translationX", 0, 200f );//平移        anim1y = ObjectAnimator//                .ofFloat(imageView1, "translationY", 0, -200f );//        anim2x = ObjectAnimator//                .ofFloat(imageView2, "translationX", 0,  0);//        anim2y = ObjectAnimator//                .ofFloat(imageView2, "translationY", 0,  -200f);//        anim3x = ObjectAnimator//                .ofFloat(imageView3, "translationX", 0,  -200f);//        anim3y = ObjectAnimator//                .ofFloat(imageView3, "translationY", 0,  -200f);//        alpha1 = ObjectAnimator.ofFloat(imageView1,"alpha",0f,1f);        alpha2 = ObjectAnimator.ofFloat(imageView2,"alpha",0f,1f);        alpha3 = ObjectAnimator.ofFloat(imageView3,"alpha",0f,1f);        rotation1 = ObjectAnimator.ofFloat(imageView1,"rotation",0,360);        rotation2 = ObjectAnimator.ofFloat(imageView2,"rotation",0,360);        rotation3 = ObjectAnimator.ofFloat(imageView3,"rotation",0,360);    }    public void setAnimation2(){        imageView1.setClickable(false);        imageView2.setClickable(false);        imageView3.setClickable(false);        float x1 = imageView1.getTranslationX();        float y1 = imageView1.getTranslationY();        float x2 = imageView2.getTranslationX();        float y2 = imageView2.getTranslationY();        float x3 = imageView3.getTranslationX();        float y3 = imageView3.getTranslationY();        anim1x = ObjectAnimator//                .ofFloat(imageView1, "translationX", x1, 0 );//        anim1y = ObjectAnimator//                .ofFloat(imageView1, "translationY", y1, 0 );//        anim2x = ObjectAnimator//                .ofFloat(imageView2, "translationX", x2,  0);//        anim2y = ObjectAnimator//                .ofFloat(imageView2, "translationY", y2,  0);//        anim3x = ObjectAnimator//                .ofFloat(imageView3, "translationX", x3,  0);//        anim3y = ObjectAnimator//                .ofFloat(imageView3, "translationY", y3,  0);//        alpha1 = ObjectAnimator.ofFloat(imageView1,"alpha",1f,0f);//透明度        alpha2 = ObjectAnimator.ofFloat(imageView2,"alpha",1f,0f);        alpha3 = ObjectAnimator.ofFloat(imageView3,"alpha",1f,0f);        rotation1 = ObjectAnimator.ofFloat(imageView1,"rotation",0,360);//旋转        rotation2 = ObjectAnimator.ofFloat(imageView2,"rotation",0,360);        rotation3 = ObjectAnimator.ofFloat(imageView3,"rotation",0,360);    }    public void start(String flug){        if(flug != null){            this.flug = flug;        }        if(this.flug.equals("1")){            setAnimation1();            this.flug  = "2";        }else{            setAnimation2();            this.flug = "1";        }        animatorSet1.play(anim1x).with(anim1y).with(alpha1).with(rotation1);//并列执行(after执行之后再执行)        animatorSet2.play(anim2x).with(anim2y).with(alpha2).with(rotation2);        animatorSet3.play(anim3x).with(anim3y).with(alpha3).with(rotation3);        animatorSet1.setDuration(500);        animatorSet2.setDuration(500);        animatorSet3.setDuration(500);        animatorSet1.start();        animatorSet2.start();        animatorSet3.start();    }}

最后在Activity中初始化MyCircleView

myCircleView = new MyCircleView(imageView1,imageView2,imageView3);

然后就是每点击一次按钮执行一次

myCircleView.start(null);//展开  start(2)是闭合

最后附上源码地址:http://download.csdn.net/detail/lmq121210/9837548

0 0
原创粉丝点击