Android App开发动画特效中帧动画和电影淡入淡出动画的讲解及实战(附源码和演示视频 简单易懂)

简介: Android App开发动画特效中帧动画和电影淡入淡出动画的讲解及实战(附源码和演示视频 简单易懂)

需要图片集和源码请点赞关注收藏后评论区留言~~~

一、帧动画

Android的动画分为三类,帧动画,补间动画和属性动画。其中帧动画是实现原理最简单的一种,跟现实生活中的电影胶卷类似,都是在短时间内连续播放多张图片,从而模拟动态画面的效果。

Android的帧动画由动画图形AnimationDrawable生成,下面是它的主要方法

1:addFrame 添加一副图片帧

2:setOneShot 设置是否只播放一次

3:start 开始播放

4:stop 停止播放

5:isRunning 判断是否正在播放

有了动画图形,还得有一个宿主视图显示该图形,一般使用图像视图承载AnimationDrawable,即调用图像视图的setImageDrawable方法加载动画图形

除了在代码中添加帧图片之外,还可以现在XML文件中定义帧图片的排列,然后在代码中调用图像视图的setImageResource方法,加载指定的XML图形定义文件,再调用图像视图的getDrawable方法 获得动画图形的实例  效果如下

瀑布动画

 

代码如下

Java类

package com.example.animation;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import android.widget.ImageView;
public class FrameAnimActivity extends AppCompatActivity {
    private ImageView iv_frame_anim; // 声明一个图像视图对象
    private AnimationDrawable ad_frame; // 声明一个帧动画对象
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_frame_anim);
        iv_frame_anim = findViewById(R.id.iv_frame_anim);
        iv_frame_anim.setOnClickListener(v -> {
            if (ad_frame.isRunning()) {  // 判断帧动画是否正在播放
                ad_frame.stop(); // 停止播放帧动画
            } else {
                ad_frame.start(); // 开始播放帧动画
            }
        });
        showFrameAnimByCode(); // 在代码中生成并播放帧动画
        //showFrameAnimByXml(); // 从xml文件获取并播放帧动画
    }
    // 在代码中生成并播放帧动画
    private void showFrameAnimByCode() {
        ad_frame = new AnimationDrawable(); // 创建一个帧动画图形
        // 下面把每帧图片加入到帧动画的列表中
        ad_frame.addFrame(getDrawable(R.drawable.flow_p1), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p2), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p3), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p4), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p5), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p6), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p7), 50);
        ad_frame.addFrame(getDrawable(R.drawable.flow_p8), 50);
        // 设置帧动画是否只播放一次。为true表示只播放一次,为false表示循环播放
        ad_frame.setOneShot(false);
        // 设置图像视图的图形为帧动画
        iv_frame_anim.setImageDrawable(ad_frame);
        ad_frame.start(); // 开始播放帧动画
    }
    // 从xml文件获取并播放帧动画
    private void showFrameAnimByXml() {
        // 设置图像视图的图像来源为帧动画的XML定义文件
        iv_frame_anim.setImageResource(R.drawable.frame_anim);
        // 从图像视图对象中获取帧动画
        ad_frame = (AnimationDrawable) iv_frame_anim.getDrawable();
        ad_frame.start(); // 开始播放帧动画
    }
}

XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <ImageView
        android:id="@+id/iv_frame_anim"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:scaleType="fitStart" />
</LinearLayout>

二、淡入淡出动画

帧动画采取后面一帧直接覆盖前面一帧的显示形式,这在快速轮播时没有什么问题,但是如果每帧之间间隔时间比较长,那么两帧之间的动画切换就会很生硬,直接从前一帧到后一帧会让人觉得很突兀,为了解决这种长间隔切换图片在视觉方面的问题,Android提供了过渡图形TrainsitionDrawable处理两张图片之间的渐变显示,即淡入淡出的动画效果

主要方法如下

setTransition 开始过渡操作

resetTransition  重置过渡操作

reverseTransition  倒过来执行过渡操作

效果如下 有点类似电影中那种缓慢切换图片的视频效果 十分有意境!

淡入淡出

如下图所示 图像在切换 但是显得很顺畅 不生硬

代码如下

Java类

package com.example.animation;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.TransitionDrawable;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import android.widget.ImageView;
public class FadeAnimActivity extends AppCompatActivity {
    private ImageView iv_fade_anim; // 声明一个图像视图对象
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fade_anim);
        iv_fade_anim = findViewById(R.id.iv_fade_anim);
        iv_fade_anim.setOnClickListener(v -> showFadeAnimation());
        showFadeAnimation(); // 开始播放淡入淡出动画
    }
    // 开始播放淡入淡出动画
    private void showFadeAnimation() {
        // 淡入淡出动画需要先定义一个图形资源数组,用于变换图片
        Drawable[] drawableArray = {getDrawable(R.drawable.fade_begin), getDrawable(R.drawable.fade_end)};
        // 创建一个用于淡入淡出动画的过渡图形
        TransitionDrawable td_fade = new TransitionDrawable(drawableArray);
        iv_fade_anim.setImageDrawable(td_fade); // 设置过渡图形
        td_fade.setCrossFadeEnabled(true); // 是否启用交叉淡入。启用后淡入效果更柔和
        td_fade.startTransition(3000); // 开始时长3秒的过渡转换
    }
}

XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <ImageView
        android:id="@+id/iv_fade_anim"
        android:layout_width="match_parent"
        android:layout_height="500dp"
        android:scaleType="fitStart" />
</LinearLayout>

创作不易 觉得有帮助请点赞关注收藏~~~

相关文章
|
Android开发 开发者
Android利用SVG实现动画效果
本文介绍了如何在Android中利用SVG实现动画效果。首先通过定义`pathData`参数(如M、L、Z等)绘制一个简单的三角形SVG图形,然后借助`objectAnimator`实现动态的线条绘制动画。文章详细讲解了从配置`build.gradle`支持VectorDrawable,到创建动画文件、关联SVG与动画,最后在Activity中启动动画的完整流程。此外,还提供了SVG绘制原理及工具推荐,帮助开发者更好地理解和应用SVG动画技术。
604 30
|
Android开发 UED 计算机视觉
Android自定义view之线条等待动画(灵感来源:金铲铲之战)
本文介绍了一款受游戏“金铲铲之战”启发的Android自定义View——线条等待动画的实现过程。通过将布局分为10份,利用`onSizeChanged`测量最小长度,并借助画笔绘制动态线条,实现渐变伸缩效果。动画逻辑通过四个变量控制线条的增长与回退,最终形成流畅的等待动画。代码中详细展示了画笔初始化、线条绘制及动画更新的核心步骤,并提供完整源码供参考。此动画适用于加载场景,提升用户体验。
704 5
Android自定义view之线条等待动画(灵感来源:金铲铲之战)
|
API Android开发 开发者
Android颜色渐变动画效果的实现
本文介绍了在Android中实现颜色渐变动画效果的方法,重点讲解了插值器(TypeEvaluator)的使用与自定义。通过Android自带的颜色插值器ArgbEvaluator,可以轻松实现背景色的渐变动画。文章详细分析了ArgbEvaluator的核心代码,并演示了如何利用Color.colorToHSV和Color.HSVToColor方法自定义颜色插值器MyColorEvaluator。最后提供了完整的源码示例,包括ColorGradient视图类和MyColorEvaluator类,帮助开发者更好地理解和应用颜色渐变动画技术。
390 3
|
Android开发 开发者
Android SVG动画详细例子
本文详细讲解了在Android中利用SVG实现动画效果的方法,通过具体例子帮助开发者更好地理解和应用SVG动画。文章首先展示了动画的实现效果,接着回顾了之前的文章链接及常见问题(如属性名大小写错误)。核心内容包括:1) 使用阿里图库获取SVG图形;2) 借助工具将SVG转换为VectorDrawable;3) 为每个路径添加动画绑定属性;4) 创建动画文件并关联SVG;5) 在ImageView中引用动画文件;6) 在Activity中启动动画。文末还提供了完整的代码示例和源码下载链接,方便读者实践操作。
573 65
|
11月前
|
存储 Android开发 数据安全/隐私保护
Thanox安卓系统增加工具下载,管理、阻止、限制后台每个APP运行情况
Thanox是一款Android系统管理工具,专注于权限、后台启动及运行管理。支持应用冻结、系统优化、UI自定义和模块管理,基于Xposed框架开发,安全可靠且开源免费,兼容Android 6.0及以上版本。
1305 4
|
XML Java Maven
Android线条等待动画JMWorkProgress(可添加依赖直接使用)
这是一篇关于Android线条等待动画JMWorkProgress的教程文章,作者计蒙将其代码开源至GitHub,提升可读性。文章介绍了如何通过添加依赖库使用该动画,并详细讲解了XML与Java中的配置方法,包括改变线条颜色、宽度、添加文字等自定义属性。项目已支持直接依赖集成(`implementation &#39;com.github.Yufseven:JMWorkProgress:v1.0&#39;`),开发者可以快速上手实现炫酷的等待动画效果。文末附有GitHub项目地址,欢迎访问并点赞支持!
383 26
|
8月前
|
缓存 移动开发 JavaScript
如何优化UniApp开发的App的启动速度?
如何优化UniApp开发的App的启动速度?
1357 139
|
8月前
|
移动开发 JavaScript weex
UniApp开发的App在启动速度方面有哪些优势和劣势?
UniApp开发的App在启动速度方面有哪些优势和劣势?
598 137
|
8月前
|
数据采集 JavaScript 前端开发
开发比分App?你缺的不是程序员
开发体育比分App,关键不在代码,而在懂体育、懂数据、懂用户。明确定位、理清需求、选好数据源,再找专业的产品、数据与技术人才协同,才能少走弯路。程序员最后入场,效率最高。
360 154