Android实用视图动画及工具系列之三：表情加载动画和失败加载动画，人物加载动画
2024-05-13 03:33:54
实现效果
功能说明
网速慢时，加载网络数据时，界面怎么处理才美观？载入失败或网络丢包时，如何让界面显得更和谐？这一直是开发人员和美工人员不绝于耳的问题，为了达到功能和UI的完美交互，我们不得不做一些基本的美化操作，本文就编写举例一个Android载入显示和载入失败的小Demo供大家参考。
这篇Blog主要实现了自定义有趣的动画载入视图，适用于各种网络及数据库数据载入UI界面显示，主要有载入动画和载入失败动画两种效果，主要功能原理利用了安卓逐帧动画和多视图布局原理，适用于新手及新学习Android的码友们，老玩家当然也可以看看，这个还是挺简单挺实用的，在后面会简略介绍实现方法及源代码，同时博客的最后还提供源代码和图片等资源github下载地址。
这篇文章的逐帧动画实现就不做详细介绍，前面的文章我有详细的介绍：
--------------------------------------------------------------------------------------------------------------------
Android实用视图动画及工具系列之一：简单的载入视图和载入动画：
http://blog.csdn.net/jaikydota163/article/details/52098833
Android实用视图动画及工具系列之二：Toast对话框和加载载入对话框：
http://blog.csdn.net/jaikydota163/article/details/52098841
--------------------------------------------------------------------------------------------------------------------
实现步骤
步骤一：添加逐帧动画资源和帧布局Drawable
顾名思义，逐帧动画就是一帧一帧的播放，在Android原生组件不主持gif的情况下，我们要实现逐帧动画只能使用一张一张图片来逐帧播放以达到效果，如下面的几张图（其他图片资源在源代码内，需要的自行下载）：
将所有帧图片导入到Android项目目录的drawable文件夹下：
在drawable目录下新建face_progressbar_default.xml，和face_progressbar_failed.xml，输入如下代码（附属性说明）：
animation-list：Android动画列表 ； oneshot：true播放一次，false循环播放； item：每项动画； android:drawable：图片索引； android:duration：每帧持续时间。
新建face_progressbar_default.xml：
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"android:oneshot="false" ><item android:duration="100" android:drawable="@drawable/global_face_loading1"></item><item android:duration="100" android:drawable="@drawable/global_face_loading2"></item></animation-list>新建face_progressbar_failed.xml文件：
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"android:oneshot="false" ><item android:duration="100" android:drawable="@drawable/global_face_loadfail1"></item><item android:duration="100" android:drawable="@drawable/global_face_loadfail2"></item></animation-list>步骤二：自定义动画类
新建类FaceImageView，代码如下，此类主要继承自ImageView，实现了基本动画播放，暂停和停止功能，注意包名改为自己的：
package com.jaiky.test.faceloadingview;import android.content.Context;
import android.graphics.drawable.AnimationDrawable;
import android.util.AttributeSet;
import android.widget.ImageView;/*** Loading Faceview* @author Jaiky* @date Jul 4, 2016* PS: Not easy to write code, please indicate.*/
public class FaceImageView extends ImageView{private AnimationDrawable loadingDrawable;private AnimationDrawable failedDrawable;public FaceImageView(Context context) {super(context);init();}public FaceImageView(Context context, AttributeSet attrs) {super(context, attrs);init();}public FaceImageView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}public void init(){setImageResource(R.drawable.face_progressbar_default);loadingDrawable = (AnimationDrawable) getDrawable();failedDrawable = (AnimationDrawable) getResources().getDrawable(R.drawable.face_progressbar_failed);loadingDrawable.start();}/*** 设置载入失败*/public void setFailed() {setImageDrawable(failedDrawable);failedDrawable.start();}/*** 设置正在载入*/public void setloading() {setImageDrawable(loadingDrawable);loadingDrawable.start();}public void startAnimation(){AnimationDrawable anim = (AnimationDrawable) getDrawable();anim.start();}public void stopAnimation(){AnimationDrawable anim = (AnimationDrawable) getDrawable();//停留在第一针anim.setVisible(true, true);anim.stop();}public void pauseAnimation(){AnimationDrawable anim = (AnimationDrawable) getDrawable();anim.stop();}}
新建类FaceImageView ，此类主要用于控制帧动画的显示，隐藏，以及失败等，代码如下：
package com.jaiky.test.faceloadingview;import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.TypedValue;
import android.view.Gravity;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.TextView;/*** Loading Faceview* @author Jaiky* @date Jul 4, 2016* PS: Not easy to write code, please indicate.*/
public class FaceLoadingView extends FrameLayout{private TextView tvInfo;private FaceImageView faceView;public FaceLoadingView(Context context) {super(context);init(context);}public FaceLoadingView(Context context, AttributeSet attrs) {super(context, attrs);init(context);}public FaceLoadingView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init(context);}public void init(Context context){//设置动画视图faceView = new FaceImageView(context);DisplayMetrics dm = getResources().getDisplayMetrics();//int widthHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 220, dm);LayoutParams faceLayout = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);faceLayout.gravity = Gravity.CENTER;faceView.setLayoutParams(faceLayout);//设置显示文本tvInfo = new TextView(context);LayoutParams tvLayout = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);tvLayout.gravity = Gravity.CENTER_HORIZONTAL | Gravity.BOTTOM;tvLayout.bottomMargin = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 30, dm);tvLayout.leftMargin = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 5, dm);tvInfo.setLayoutParams(tvLayout);tvInfo.setText("努力加载中...");tvInfo.setTextColor(Color.parseColor("#757575"));tvInfo.setTextSize(TypedValue.COMPLEX_UNIT_SP, 11);//添加到布局addView(faceView);addView(tvInfo);}public void setFailed() {setVisibility(View.VISIBLE);faceView.setFailed();tvInfo.setText("载入失败，请刷新尝试...");}public void setFailedWithMsg(String msg) {setVisibility(View.VISIBLE);faceView.setFailed();tvInfo.setText(msg);}public void setloading() {setVisibility(View.VISIBLE);faceView.setloading();tvInfo.setText("努力加载中...");}public void setloadingWithMsg(String msg) {setVisibility(View.VISIBLE);faceView.setloading();tvInfo.setText(msg);}/*** 隐藏视图*/public void hiddenView(){setVisibility(View.GONE);}/*** 显示视图*/public void show(){setVisibility(View.VISIBLE);}/*** 设置加载消息内容** @param msg*/public void setMsg(String msg) {tvInfo.setText(msg);}}步骤三：Demo测试修改布局和主类
修改activity_main.xml内容如下（注意自定义控件包名）：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.jaiky.test.faceloadingview.MainActivity"><Buttonandroid:id="@+id/btn1"android:layout_width="match_parent"android:layout_height="wrap_content"android:text="载入成功"/><Buttonandroid:id="@+id/btn2"android:layout_width="match_parent"android:layout_height="wrap_content"android:text="载入失败"/>
</LinearLayout>
新建布局文件activity_list.xml：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/activity_main"android:layout_width="match_parent"android:layout_height="match_parent"tools:context="com.jaiky.test.faceloadingview.MainActivity"><com.jaiky.test.faceloadingview.FaceLoadingViewandroid:id="@+id/faceView"android:layout_width="220dp"android:layout_height="220dp"android:layout_centerInParent="true"/><TextViewandroid:id="@+id/mTextView"android:layout_width="match_parent"android:layout_height="match_parent"android:text="显示加载后的数据\nShow loaded Data"android:background="@color/colorAccent"android:textColor="#ffffff"android:gravity="center"android:textSize="25sp"/></RelativeLayout>
修改MainActiivty类内容如下（注意包名）：
package com.jaiky.test.faceloadingview;import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;public class MainActivity extends AppCompatActivity {Button btn1, btn2;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);btn1 = (Button) findViewById(R.id.btn1);btn2 = (Button) findViewById(R.id.btn2);btn1.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {Intent intent = new Intent(MainActivity.this, ListActivity.class);intent.putExtra("isFail", false);startActivity(intent);}});btn2.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {Intent intent = new Intent(MainActivity.this, ListActivity.class);intent.putExtra("isFail", true);startActivity(intent);}});}
}
新建ListAcitivity类，用于测试：
package com.jaiky.test.faceloadingview;import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.TextView;public class ListActivity extends AppCompatActivity {TextView mTextView;FaceLoadingView mFaceLoadingView;boolean isFail;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_list);mFaceLoadingView = (FaceLoadingView) findViewById(R.id.faceView);mTextView = (TextView) findViewById(R.id.mTextView);mTextView.setVisibility(View.GONE);isFail = getIntent().getBooleanExtra("isFail", false);//Simulate get dataif (isFail) {new Handler().postDelayed(new Runnable() {@Overridepublic void run() {mFaceLoadingView.setFailed();}}, 5000);}else {new Handler().postDelayed(new Runnable() {@Overridepublic void run() {mFaceLoadingView.hiddenView();mTextView.setVisibility(View.VISIBLE);}}, 5000);}}
}
最后是在AndroidManifest文件加入新的Activity：
<activity android:name=".ListActivity">
</activity>
--------------------------------------------------------------------------------------------------------------------
获取源代码及资源文件：
https://github.com/jaikydota/Android-FaceLoadingView
--------------------------------------------------------------------------------------------------------------------
声明
欢迎转载，但请保留文章原始出处
作者：Jaiky_杰哥
出处：http://blog.csdn.net/jaikydota163/article/details/52098851
Android实用视图动画及工具系列之三：表情加载动画和失败加载动画，人物加载动画相关推荐
- android xml 加载错误提示,加载uixml文件失败 打开wps时显示“加载XML文件失败１
打开wps时显示"加载XML文件失败." 打开wps时显示"加载XML文件失败1 关闭所有打开的Word文档: 开始 → 运行 → 粘贴上面复制的命令 → 确定. 在打开 ...
- idea spring tomcat启动失败_技术篇 | 实用IDEA插件和工具系列
前 言 本章主要分享一些工作中常用的IDEA插件(Maven Helper.Lombok.Mybatis Log Plugin.RestfulToolkit.JRebel And XRebel)和实用 ...
- C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial)：目录
本系列教程的示例代码下载(感谢 银光中国 提供资源分流): 第一部分源码:WPFGameTutorial_PartI(1-20节) 第二部分源码:WPFGameTutorial_PartII(21-2 ...
- Android官方开发文档Training系列课程中文版：动画视图之转场框架介绍
原文地址:http://android.xsoftlab.net/training/transitions/index.html 引言 Activity所呈现的UI经常会由用户的输入或者其它事件而发生 ...
- Android官方开发文档Training系列课程中文版：动画视图之应用场景
原文链接:http://android.xsoftlab.net/training/transitions/transitions.html 在转场框架中,动画是由一帧帧的图像连续绘制形成的,这一帧帧 ...
- Android内存检测工具系列工具集
Android内存检测工具系列工具集 Android关于内存的工具不少,灵活地选择工具就显得特别重要.在此特别推荐分享涵盖一定初步和定位能力的工具,可以让我们一步到位地分析问题,提升效率. 在此列举几 ...
- 【Xamarin挖墙脚系列：Android最重要的命令工具ADB】
[Xamarin挖墙脚系列:Android最重要的命令工具ADB] 原文:[Xamarin挖墙脚系列:Android最重要的命令工具ADB] adb工具提供了很好的基于命令的对系统的控制. 以前说过, ...
- 【实用工具系列之爬虫】python实现爬取代理IP（防 ‘反爬虫’）
系列 [实用工具系列之爬虫]python实现爬取代理IP(防 '反爬虫') [实用工具系列之爬虫]python实现快速爬取财经资讯(防 '反爬虫') 本文使用python实现代理IP的爬取,并可以防' ...
- 替换Android手机的开机动画,安卓技术宅系列之修改手机开机动画
手机开机画面太单调怎么办?想DIY一下怎么办?当乐安卓技术宅系列教学帮你解决一切烦恼.木有乱七八糟的设置和代码改动,简简单单更改手机开机动画,看会理论知识也能和技术宅侃侃技术,当然我们提供了一键更改开 ...
最新文章
- Angular学习记录一
- 数据结构经典书籍--数据结构与算法分析
- Leetcode - 347. Top K Frequent Elements(堆排序)
- [置顶] C/C++超级大火锅
- PHP版本区别5与7：性能 64位 运算符 输入类型 返回类型 匿名类；7改进1.变量存储空间2.数组结构3.函数调用机制
- [BUUCTF-pwn]——picoctf_2018_echo back
- 阿里云心选-T+财务软件助力线下实体的创富转型之道
- m1 MBA配置Homebrew环境+国内源配置
- mac mysql-share_mac下安装mysql
- 理想汽车10月份新增12家直营交付中心 蔚来第1000座充电站上线
- 论文笔记_S2D.69_用于 LiDAR 里程计和建图的泊松曲面重建
- 抽奖软件NABCD分析
- 复盘图像双线性插值推导细节
- 手机APP测试类型与方法
- Win10秘笈：两种方式修改网卡物理地址（MAC）
- 计算机能不能升级固态硬盘,笔记本升级固态硬盘后会怎样？秒懂
- 离线语音交互技术路线之语音合成(TTS)篇
- 百科知识 ass文件如何打开
- 全国首批城市级5G车联网应用项目落地！
- 深度学习入门笔记（十八）：卷积神经网络（一）