前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >AnimationDrawable 实现正在加载的旋转动画

AnimationDrawable 实现正在加载的旋转动画

作者头像
wust小吴
发布2019-07-05 11:52:58
2.1K0
发布2019-07-05 11:52:58
举报
文章被收录于专栏:风吹杨柳

先看效果吧

效果:

要实现这样的效果  就是中间的那个   正在拼命加载数据中  然后是那个动画在不停的旋转,

其实这个过程      是在你访问网络数据请求的时候,出现的,一般只停留几秒钟的效果   

看了效果图,接下来介绍下这个如何实现的,首先我们需要去了解他的原理,我这里面使用的是:AnimationDrawable 

原理:

Drawable animation可以加载Drawable资源实现帧动画。

AnimationDrawable是实现Drawable animations的基本类。

推荐用XML文件的方法实现Drawable动画,不推荐在代码中实现。

这种XML文件存放在工程中res/drawable/目录下。

XML文件的指令(即属性)为动画播放的顺序和时间间隔。

 在XML文件中<animation-list>元素为根节点,<item>节点定义了每一帧,表示一个drawable资源的帧和帧间隔。下面是一个XML文件的实例:

  1. <animation-list xmlns:android="http://schemas.android.com/apk/res/android"
  2.     android:oneshot="true">  
  3.     <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />  
  4.     <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />  
  5.     <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />  
  6. </animation-list>  

设置Android:oneshot属性为true,表示此次动画只执行一次,最后停留在最后一帧。

设置为false则动画循环播放。文件可以添加为Image背景,触发的时候播放。

使用:

    方式1:Drawable Animation本身就是一个Drawable资源文件,所以直接在xml中设置为指定View的背景即可。animation.start().

    方式2:通过View. setBackgroundResource(resID).    animation.start().

实现:

了解上面的原理之后,我们接下来实现文章开头图片所示的功能,

首先需要的可能是:XML文件的指令(即属性)为动画播放的顺序和时间间隔。

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<animation-list android:oneshot="false"  
xmlns:android="http://schemas.android.com/apk/res/android">  
  <item android:duration="100" android:drawable="@drawable/loading_1" />  
  <item android:duration="100" android:drawable="@drawable/loading_2" />  
  <item android:duration="100" android:drawable="@drawable/loading_3" />  
  <item android:duration="100" android:drawable="@drawable/loading_4" />  
  <item android:duration="100" android:drawable="@drawable/loading_5" />  
  <item android:duration="100" android:drawable="@drawable/loading_6" />  
  <item android:duration="100" android:drawable="@drawable/loading_7" />  
</animation-list>   

其次需要的是:布局文件

代码语言:javascript
复制
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/lodingRelativeLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#00ffffff"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/lodding"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_centerHorizontal="true"
        
        android:layout_centerVertical="true" 
        />

    <TextView
        android:id="@+id/lodiing_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/lodding"
        android:layout_centerHorizontal="true"
        android:text="正在拼命加载数据中……"
        android:textColor="#3C3C3C"
        android:singleLine="true"
        android:ellipsize="none"
        android:textSize="12sp" />

</RelativeLayout>

再次就是动态加载的类:

代码语言:javascript
复制
public class LoadingAinm {
	 public static void ininLoding(Activity activity){//正在加载的 旋转动画
		  ImageView loadingImageView=(ImageView)activity.findViewById(R.id.lodding);//找到旋转动画的视图控件
		  TextView loadingTextView=(TextView)activity.findViewById(R.id.lodiing_text);//文字是不用动态变化的
	    	loadingImageView.setBackgroundResource(R.anim.lodding);//帧播放的设置文件  
	        final AnimationDrawable animationDrawable = (AnimationDrawable)loadingImageView.getBackground();
	    	loadingImageView.post(new Runnable() {
	    	    @Override
	    	        public void run()  {
	    	            animationDrawable.start();
	    	        }
	    	});
	    }
}

最后就是  相应的activity中需要怎么使用就可以了:

代码语言:javascript
复制
public class MyFragment extends Fragment {
	private ListView listView;
	private MyAdapter adapter;
	private RelativeLayout loadRelativeLayout;
	private LinearLayout dataLinearLayout;
	
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		View view =inflater.inflate(R.layout.my_fragment, container, false);
		listView=(ListView) view.findViewById(R.id.my_listview);
		adapter=new MyAdapter(getActivity());
		new DownData().execute();
		loadRelativeLayout=(RelativeLayout) view.findViewById(R.id.lodingRelativeLayout);
		dataLinearLayout=(LinearLayout) view.findViewById(R.id.huodongLinearlayout);
		LoadingAinm.ininLoding(view);
		return view;
	}

看到上面最后第二行代码:LoadingAinm.ininLoding(view)

这样就实现了当异步请求数据没有完成的时候,界面上显示的是正在加载的动画

其他的知识:

注意:

一旦给指定View设置Drawable Animation之后,其BackGround就变成AnimationDrawable对象,

代码如下: rocketAnimation = (AnimationDrawable) rocketImage.getBackground();

start()方法不能在onCreate()函数中调用。

因为AnimationDrawable并未完全关联到Window,

在onCreate()方法中,View并未完成显示(同理,在此方法中测量某个View的宽高,常得到0值。也同理SurfaceHolder要增加Callback方法)。

在此如果想最快的启动动画,使用监听方法onWindowFoucsChanged().

突然想到,组件的宽高无法获得的原因可能是组件并未完全关联到Window测试:在此监听方法下,获取指定组件(TextView)的宽高。

Xml文件如下:

[html] view plaincopy

  1. <TextView
  2. android:id="@+id/textView"
  3. android:layout_width="50dip"
  4. android:layout_height="100dip"
  5. android:text="@string/special_character" />

代码如下:       

[java] view plaincopy

  1. @Override
  2. public void onWindowFocusChanged(boolean hasFocus) {   
  3. // TODO Auto-generated method stub 
  4. super.onWindowFocusChanged(hasFocus);   
  5.         specialCharacterStr = (String) mTextView.getText();   
  6.         Log.d("special_character", "specialCharacterStr is :" + specialCharacterStr);         
  7. int width = mTextView.getMeasuredWidth();   
  8. int height = mTextView.getMeasuredHeight();   
  9.         Log.d("window_focus", "textview width is:" + width);   
  10.         Log.d("window_focus", "textview height is:" + height);   
  11.     }  
  12. 可以获得宽和高,即只有当View完全关联到Window的情况下,才可以获得View的宽高和给View设置背景  
  13. AnimationDrawable: android.graphic.drawable.AnimationDrawable  
  14. //获得我们xml定义的AnimationDrawable
  15.               animDrawable=(AnimationDrawable) getResources().getDrawable(R.anim.frame_animation);  
  16. 一段参考代码:  
  17. @Override
  18.     publicvoid onWindowFocusChanged(boolean hasFocus) {  
  19. // TODO Auto-generated method stub
  20. if(hasFocus) {  
  21.            imageView.setBackgroundResource(R.anim.frame_animation);  
  22.            animDrawable = (AnimationDrawable) imageView.getBackground();  
  23.            animDrawable.start();  
  24.            AlphaAnimation aas=new AlphaAnimation(0.1f,1.0f);  
  25. //设置动画时间长度
  26.            aas.setDuration(3500);  
  27. //启动动画
  28.            imageView.startAnimation(aas);  
  29. //设置动画监听
  30.            aas.setAnimationListener(new AnimationListener()  
  31.            {  
  32. @Override
  33.               publicvoid onAnimationEnd(Animation arg0) {  
  34. //停止帧动画
  35.                   imageView.setVisibility(View.GONE);  
  36.                   Log.i(TAG,"FY_stop");  
  37.                   animDrawable.stop();  
  38.               }    
  39. @Override
  40.               publicvoid onAnimationRepeat(Animation animation) {  
  41.               }  
  42. @Override
  43.               publicvoid onAnimationStart(Animation animation) {  
  44. //将imageView的背景设置成动画
  45.                   imageView.setBackgroundResource(R.anim.frame_animation);  
  46.                   animDrawable = (AnimationDrawable)imageView.getBackground();  
  47. //设置动画透明度
  48.                   animDrawable.setAlpha(80);  
  49. //启动动画
  50.                   animDrawable.start();  
  51.               }              
  52.            }  
  53.            );  
  54.        }    
  55.     }     

参考文章:http://blog.csdn.net/zqiang_55/article/details/8142785

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2015年09月07日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 效果:
  • 原理:
  • 实现:
  • 其他的知识:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档