首页 > 其他分享 >【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画

时间:2023-03-19 11:06:35浏览次数:47  
标签:动画 anim layout 缩放 Button 补间 android id


实现旋转、平移、缩放和透明度渐变的补间动画,具体实现如下:

1.在新建项目的res目录中,创建一个名为anim的目录,并在该目录中创建实现旋转、平移、缩放和透明度渐变的动画资源文件。

透明度渐变的动画资源文件anim_alpha.xml(完全不透明->完全透明->完全不透明)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="1"
android:toAlpha="0"
android:fillAfter="true"
android:repeatMode="reverse"
android:repeatCount="1"
android:duration="2000"/>
</set>


旋转的动画资源文件anim_rotate.xml(0度->720度->360度->0度)


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:interpolator="@android:anim/accelerate_interpolator"
android:fromDegrees="0"
android:toDegrees="720"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000"/>
<rotate
android:interpolator="@android:anim/accelerate_interpolator"
android:startOffset="2000"
android:fromDegrees="360"
android:toDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2000"/>
</set>


缩放动画资源文件anim_scale.xml(放大2倍->收缩回来)


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:fromXScale="1"
android:interpolator="@android:anim/decelerate_interpolator"
android:fromYScale="1"
android:toXScale="2.0"
android:toYScale="2.0"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="true"
android:repeatCount="1"
android:repeatMode="reverse"
android:duration="2000"/>


</set>


平移动画资源文件anim_translate.xml(屏幕左侧->屏幕右侧->屏幕左侧)


<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="860"
android:fromYDelta="0"
android:toYDelta="0"
android:fillAfter="true"
android:repeatMode="reverse"
android:repeatCount="1"
android:duration="2000"/>
</set>


主界面资源文件:


res/layout/main.xml:


<?xml version="1.0" encoding="utf-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/linearLayout1"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/linearLayout2"
android:orientation="horizontal">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button1"
android:text="旋转"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button2"
android:text="平移"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button3"
android:text="缩放"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button4"
android:text="透明度变化"/>
</LinearLayout>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/imageView1"
android:src="@drawable/img1"/>
</LinearLayout>


效果如图

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画_Animation



MainActivity:


在onCreat()方法中,首先获取动画资源文件中创建的动画资源,然后获取要应用动画效果的ImageView,再获取“旋转”按钮,并为该按钮添加单击事件监听器,在重写onClik()方法中,播放动画。具体代码如下:


package com.example.test;  

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

public class MainActivity extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

final Animation rotate=AnimationUtils.loadAnimation(this, R.anim.anim_rotate);//获取旋转动画资源
final Animation translate=AnimationUtils.loadAnimation(this, R.anim.anim_translate);//获取平移动画资源
final Animation scale=AnimationUtils.loadAnimation(this, R.anim.anim_scale);//获取缩放动画资源
final Animation alpha=AnimationUtils.loadAnimation(this, R.anim.anim_alpha);//获取透明度变化动画资源
//获取要应用动画效果的ImageView
final ImageView iv=(ImageView)findViewById(R.id.imageView1);
Button button1=(Button)findViewById(R.id.button1);//获取"旋转"按钮
button1.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
//播放旋转动画
iv.startAnimation(rotate);

}
});

Button button2=(Button)findViewById(R.id.button2);//获取"平移"按钮
button2.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
//播放平移动画
iv.startAnimation(translate);

}
});

Button button3=(Button)findViewById(R.id.button3);//获取"缩放"按钮
button3.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
//播放缩放动画
iv.startAnimation(scale);

}
});

Button button4=(Button)findViewById(R.id.button4);//获取"透明度渐变"按钮
button4.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
//播放透明度渐变动画
iv.startAnimation(alpha);

}
});

}


}


效果如图1、图2、图3、图4:

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画_AnimationUtils_02

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画_AnimationUtils_03

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画_AnimationUtils_04

【Android开发】动画范例2-旋转、平移、缩放和透明度渐变的补间动画_Animation_05

标签:动画,anim,layout,缩放,Button,补间,android,id
From: https://blog.51cto.com/u_16012040/6130986

相关文章

  • echarts图dataZoom属性鼠标滚轮控制缩放
    不用设置zoomOnMouseWheel属性,默认为true,或者zoomOnMouseWheel:true即可设置成功   ......
  • 【CSS】盒子模型内边距 ③ ( 盒子模型内边距案例 | 使用 Fireworks 分析网页 | 缩放图
    文章目录​​一、盒子模型内边距案例​​​​二、使用Fireworks分析网页​​​​1、导入图片​​​​2、缩放图片​​​​3、切片工具测量图片​​​​4、吸管工具获取图......
  • 遮罩层 背景透明度动画
    .left-menus-pup{ position:fixed; left:0; right:0; bottom:0; top:188px; z-index:300; animation-name:pup; /*2、动画持续时间*/......
  • 重构:banner 中 logo 聚合分散动画
    1.效果展示在线查看2.开始前说明效果实现参考源码:Logo聚集与散开原效果代码基于reactjsx类组件实现。依赖旧,代码冗余。我将基于此进行重构,重构目标:基于最新......
  • Vue封装的过度与动画
    Vue封装的过度与动画1:知识点:##Vue封装的过度与动画1.作用:在插入、更新或移除DOM元素时,在合适的时候给元素添加样式类名。2.图示:<imgsrc="https://img04.sogoucdn......
  • 前端实现玻璃卡片悬停动画
          <!doctypehtml><htmllang="zh-CN"><head><metacharset="utf-8"><metaname="viewport"content="width=device-width"><title>玻璃卡片悬停</......
  • Vue封装的过度与动画
    1、作用:在插入、更新或移除DOM元素时,在合适的时候给元素添加样式类名。2、图示  3、写法:(1)准备好样式:元素进入的样式:v-enter:进入的起点v-enter-active:......
  • 【Element】ElLoading 自定义动画
    import{ElLoading}from"element-plus";LoadingInstance=ElLoading.service({ background:"rgba(0,0,0,0.7)", customClass:"ElLoading_class",});//主......
  • Winform中设置ZedGraph的字体和间距不随图形的缩放而缩放
    场景在上面已经实现的效果为: 可以看到随着图形的缩小,相应的字体和间距等也被缩小,需要设置字体大小和tic大小将始终完全符合指定的大小,而不进行任何缩放。注:关注公众号霸......
  • css实现画面转场以及边框线条动画
    效果预览在实现转场效果之前,需要先了解css的clip-path属性,该属性就是实现转场的核心属性,clip-path属性可以使用裁剪方式创建元素的可显示区域。区域内的部分显示,区域外的......