Android中补间动画、属性动画效果演示
16lz
2021-01-24
一、补间动画(即view动画)1.透明 AlphaAnim2.旋转 RotateAnim3.缩放 ScaleAnim4.位移 TranslateAnim原理:动画效果不会改变控件的真实坐标位置
布局文件:activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
MainActrivity.java
1> 定义布局文件中的几个控件
private Button btn_touming;private Button btn_suofang;private Button btn_xuanzhuan;private Button btn_weiyi;private Button btn_yiqi;private ImageView iv_show;
2> 在OnCreate方法中进行初始
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); btn_touming = (Button)findViewById(R.id.btn_touming); btn_suofang = (Button)findViewById(R.id.btn_suofang); btn_xuanzhuan = (Button)findViewById(R.id.btn_xuanzhuan); btn_weiyi = (Button)findViewById(R.id.btn_weiyi); btn_yiqi = (Button)findViewById(R.id.btn_yiqi); iv_show = (ImageView)findViewById(R.id.iv_show); btn_touming.setOnClickListener(this); btn_suofang.setOnClickListener(this); btn_xuanzhuan.setOnClickListener(this); btn_weiyi.setOnClickListener(this); btn_yiqi.setOnClickListener(this); }
3> 实现OnClick事件
@Override public void onClick(View v) { switch(v.getId()){ case R.id.btn_touming: { //透明 AlphaAnimation aa = new AlphaAnimation(1.0f,0.0f); aa.setDuration(2000);//设置执行时间 aa.setRepeatCount(1);//设置动画重复次数 aa.setRepeatMode(Animation.REVERSE);//反向执行 iv_show.startAnimation(aa);//执行动画 break; } case R.id.btn_xuanzhuan: { //旋转 //RotateAnimation ra = new RotateAnimation(0,360);//默认是以图片左上角的坐标进行旋转 RotateAnimation ra = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);//后面的参数进行指定坐标以自己坐标为屏幕宽的一半和屏幕高的一半为坐标进行旋转 ra.setDuration(2000);//设置执行时间 ra.setRepeatCount(1);//设置动画重复次数 ra.setRepeatMode(Animation.REVERSE);//反向执行 iv_show.startAnimation(ra);//执行动画 break; } case R.id.btn_suofang: { //缩放 ScaleAnimation sa = new ScaleAnimation(1.0f,2.0f,1.0f,2.0f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f); sa.setDuration(2000);//设置执行时间 sa.setRepeatCount(1);//设置动画重复次数 sa.setRepeatMode(Animation.REVERSE);//反向执行 iv_show.startAnimation(sa);//执行动画 break; } case R.id.btn_weiyi: { //位移 TranslateAnimation ta = new TranslateAnimation(Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0.2f); ta.setDuration(2000);//设置执行时间 ta.setRepeatCount(1);//设置动画重复次数 ta.setRepeatMode(Animation.REVERSE);//反向执行 ta.setFillAfter(true); iv_show.startAnimation(ta);//执行动画 break; } case R.id.btn_yiqi: { AnimationSet set = new AnimationSet(false); //以上几种一起执行 AlphaAnimation aa = new AlphaAnimation(1.0f,0.0f); aa.setDuration(2000);//设置执行时间 aa.setRepeatCount(1);//设置动画重复次数 aa.setRepeatMode(Animation.REVERSE);//反向执行 RotateAnimation ra = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);//后面的参数进行指定坐标以自己坐标为屏幕宽的一半和屏幕高的一半为坐标进行旋转 ra.setDuration(2000);//设置执行时间 ra.setRepeatCount(1);//设置动画重复次数 ra.setRepeatMode(Animation.REVERSE);//反向执行 ScaleAnimation sa = new ScaleAnimation(1.0f,2.0f,1.0f,2.0f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f); sa.setDuration(2000);//设置执行时间 sa.setRepeatCount(1);//设置动画重复次数 sa.setRepeatMode(Animation.REVERSE);//反向执行 TranslateAnimation ta = new TranslateAnimation(Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0,Animation.RELATIVE_TO_PARENT,0.2f); ta.setDuration(2000);//设置执行时间 ta.setRepeatCount(1);//设置动画重复次数 ta.setRepeatMode(Animation.REVERSE);//反向执行 ta.setFillAfter(true); //载入动画 set.addAnimation(aa); set.addAnimation(ra); set.addAnimation(sa); set.addAnimation(ta); iv_show.startAnimation(set);//执行动画 break; } default: break; } }
第二种方式采用XML添加补间动画效果:
特别注意的是:要在res目录下创建一个anim文件夹,然后下面的布局文件要放到anim下才可以。
1.alpha.xml 透明效果
<?xml version="1.0" encoding="utf-8"?>
2.rotate.xml 旋转效果
<?xml version="1.0" encoding="utf-8"?>
3.scale.xml 缩放效果
<?xml version="1.0" encoding="utf-8"?>
4.translate.xml 位移效果
<?xml version="1.0" encoding="utf-8"?>
5.set.xml 采用集合的方式
<?xml version="1.0" encoding="utf-8"?>
MainActivity.java:
OnClick 方法的实现:
@Override public void onClick(View v) { switch(v.getId()){ case R.id.btn_touming: { //透明 Animation aa = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.alpha); iv_show.startAnimation(aa); break; } case R.id.btn_xuanzhuan: { //旋转 Animation ra = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate); iv_show.startAnimation(ra);//执行动画 break; } case R.id.btn_suofang: { //缩放 Animation sa = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.scale); iv_show.startAnimation(sa);//执行动画 break; } case R.id.btn_weiyi: { //位移 Animation ta = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.translate); iv_show.startAnimation(ta);//执行动画 break; } case R.id.btn_yiqi: { Animation set = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.set); iv_show.startAnimation(set);//执行动画 break; } default: break; } }
二、属性动画
原理:动画效果会改变控件的坐标位置
1>直接通过代码的方式:
这里我直接把按钮点击如何调用写一下,其他按钮声明初始化都和上面一样:
@Overridepublic void onClick(View v) {switch(v.getId()){ case R.id.btn_touming: { //透明 /* * 参数1是ImageView控件,参数2是透明属性名,后面是可变参数,0表示不透明 1表示完全透明 */ ObjectAnimator oa = ObjectAnimator.ofFloat(iv_show, "alpha", 0,0.5f,0,1,0,1); oa.setDuration(2000); oa.start();//启动动画 break; } case R.id.btn_xuanzhuan: { //旋转 /* * 参数1表示ImageView控件,参数2表示旋转属性名,后面是可变参数 */ ObjectAnimator oa = ObjectAnimator.ofFloat(iv_show, "rotation", 0,180,90,360); oa.setDuration(2000); oa.start();//启动动画 break; } case R.id.btn_suofang: { //缩放 /* * 参数1表示ImageView控件,参数2表示水平属性名,后面是可变参数 */ ObjectAnimator oa = ObjectAnimator.ofFloat(iv_show, "scaleY", 0.1f, 2, 1, 2); oa.setDuration(2000); oa.start();//启动动画 break; } case R.id.btn_weiyi: { //位移 /* * 参数1表示ImageView控件,参数2表示位移属性名,后面是可变参数 */ ObjectAnimator oa = ObjectAnimator.ofFloat(iv_show, "translationX", 10,50,10,130); oa.setDuration(2000); oa.start();//启动动画 break; } case R.id.btn_yiqi: { AnimatorSet set = new AnimatorSet(); //以上几种一起执行 ObjectAnimator aa = ObjectAnimator.ofFloat(iv_show, "alpha", 0,0.5f,0,1,0,1); aa.setDuration(2000); ObjectAnimator ra = ObjectAnimator.ofFloat(iv_show, "rotation", 0,180,90,360); ra.setDuration(2000); ObjectAnimator sa = ObjectAnimator.ofFloat(iv_show, "scaleY", 0.1f, 2, 1, 2); sa.setDuration(2000); ObjectAnimator ta = ObjectAnimator.ofFloat(iv_show, "translationX", 10,50,10,130); ta.setDuration(2000); //载入动画 //一起进行 set.playTogether(aa,ra,sa,ta); //挨个进行// set.playSequentially(aa,ra,sa,ta); set.setDuration(2000).start();//执行动画 break; } default: break;}}}
属性动画是通过ObjectAnimator 这个静态类来操作的。
2>通过xml方式加载:
注意:要在res下添加文件夹anmiator,将资源文件放到目录下
Animator aa = AnimatorInflater.loadAnimator(getApplicationContext(), R.animator.oanimator);aa.setTarget(iv_show);aa.start();
通过AnimatorInflater类的这个loadAnimator()来加载。 setTarget参数传的是控件ImageView,因为我要操作这个上面图片。
最后启动调用start();
oanimator.xml 布局文件给出来:
<?xml version="1.0" encoding="utf-8"?>
更多相关文章
- android listview 连续调用 getview问题分析及解决
- android在只拥有第三方apk的情况下在自己app中打开第三方app
- RecyclerView源码分析一之简单介绍
- android浏览器研究-下载
- Flutter Row、Column 参数详解
- android 九宫格 移动 并且删除 带动画效果
- Android(安卓)重读官方文档 4 SharedPreferences
- PullDownListView高仿微信下拉眼睛出现动画
- Android自定义动画框架让View实现Path动画