保姆级【快数学会Android端“动画“】+ 实现补间动画和逐帧动画!!!

目录

补间动画

1.创建资源文件夹

2.设置文件夹类型

3.创建.xml文件

4.样式设计

5.动画设置

6.动画的实现

内容拓展

7.在原基础上继续添加.xml文件

8.xml代码编写

(1)rotate_anim

(2)scale_anim

(3)translate_anim

9.MainActivity.java代码汇总

10.效果展示

逐帧动画

1.在drawable中添加loading_anim文件

2.样式设计

3.MainActivity.java代码

4.效果展示


补间动画

1.创建资源文件夹

2.设置文件夹类型

3.创建.xml文件

4.样式设计

在drawable文件中添加照片

5.动画设置

在alpha_anim.xml中写入渐变代码

javascript 复制代码
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.0"
        android:duration="1000"
        android:repeatCount="10"
        android:repeatMode="restart"
        android:interpolator="@android:anim/linear_interpolator"
        />
</set>

6.动画的实现

将动画与按钮控件进行绑定

在MainActivity.java中写入代码

以上为实现渐变动画的代码


内容拓展

继续实现缩放、旋转、平移等动画效果

7.在原基础上继续添加.xml文件

8.xml代码编写

(1)rotate_anim
javascript 复制代码
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:fromDegrees="0"
        android:toDegrees="360"
        android:duration="1000"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="infinite"
        android:repeatMode="reverse"
        />
</set>
(2)scale_anim
javascript 复制代码
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:fromXScale="1.0"
        android:toXScale="0.5"
        android:fromYScale="1.0"
        android:toYScale="0.5"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatMode="reverse"
        android:repeatCount="infinite"
        android:duration="3000"
        />
</set>
(3)translate_anim
javascript 复制代码
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0.0"
        android:toXDelta="100"
        android:fromYDelta="0.0"
        android:toYDelta="0.0"
        android:repeatCount="infinite"
        android:repeatMode="reverse"
        android:duration="3000"
        />
</set>

9.MainActivity.java代码汇总

javascript 复制代码
 //渐变
        ImageView lion_img = findViewById(R.id.imageView );
        Button alpha_btn = findViewById(R.id.button);
        alpha_btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //加载动画
                Animation alpha_animation = AnimationUtils.loadAnimation(getApplicationContext(),R.anim.alpha_anim);
                //在控件上执行动画
                lion_img.startAnimation(alpha_animation);
            }
        });
        //缩放
        Button rotate_anim = findViewById(R.id.button3);
        rotate_anim.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Animation rotate_animation = AnimationUtils.loadAnimation(getApplicationContext(),R.anim.rotate_anim);
                lion_img.startAnimation(rotate_animation);
            }
        });
        //旋转
        Button scale_anim = findViewById(R.id.button2);
        scale_anim.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Animation rotate_animation = AnimationUtils.loadAnimation(getApplicationContext(),R.anim.scale_anim);
                lion_img.startAnimation(rotate_animation);
            }
        });
        //平移
        Button translate_anim = findViewById(R.id.button4);
        translate_anim.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Animation rotate_animation = AnimationUtils.loadAnimation(getApplicationContext(),R.anim.translate_anim);
                lion_img.startAnimation(rotate_animation);
            }
        });

10.效果展示

补间动画效果实现


逐帧动画

1.在drawable中添加loading_anim文件

该文件用于存储导入的多张照片,可视为集合。

创建后代码编写

2.样式设计

导入的imageView图片选用loading_anim集合,而非单张静态照片!!!!!!

3.MainActivity.java代码

4.效果展示

点击start_btn按钮,图片实现轮播效果


感谢各位读者的阅读!希望大家给出一键三连,多多支持原创。有错误和不解的地方,欢迎各位读者在评论区讨论,我也会不断学习不断改进,做出更加优质的作品!!!

相关代码资源(点击跳转)

相关推荐
工一木子25 分钟前
URL时间戳参数深度解析:缓存破坏与前端优化的前世今生
前端·缓存
ii_best1 小时前
按键精灵支持安卓14、15系统,兼容64位环境开发辅助工具
android
美狐美颜sdk1 小时前
跨平台直播美颜SDK集成实录:Android/iOS如何适配贴纸功能
android·人工智能·ios·架构·音视频·美颜sdk·第三方美颜sdk
半点寒12W2 小时前
微信小程序实现路由拦截的方法
前端
某公司摸鱼前端3 小时前
uniapp socket 封装 (可拿去直接用)
前端·javascript·websocket·uni-app
要加油哦~3 小时前
vue | 插件 | 移动文件的插件 —— move-file-cli 插件 的安装与使用
前端·javascript·vue.js
小林学习编程3 小时前
Springboot + vue + uni-app小程序web端全套家具商场
前端·vue.js·spring boot
柳鲲鹏3 小时前
WINDOWS最快布署WEB服务器:apache2
服务器·前端·windows
weixin-a153003083164 小时前
【playwright篇】教程(十七)[html元素知识]
java·前端·html
ai小鬼头4 小时前
AIStarter最新版怎么卸载AI项目?一键删除操作指南(附路径设置技巧)
前端·后端·github