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文件的实例:

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

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

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

使用：

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

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

实现：

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

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

<?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>

其次需要的是：布局文件

<?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>

再次就是动态加载的类：

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中需要怎么使用就可以了：

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 plain copy

<TextView
android:id="@+id/textView"
android:layout_width="50dip"
android:layout_height="100dip"
android:text="@string/special_character" />

代码如下：

[java] view plain copy

@Override
public void onWindowFocusChanged(boolean hasFocus) {
// TODO Auto-generated method stub
super.onWindowFocusChanged(hasFocus);
specialCharacterStr = (String) mTextView.getText();
Log.d("special_character", "specialCharacterStr is :" + specialCharacterStr);
int width = mTextView.getMeasuredWidth();
int height = mTextView.getMeasuredHeight();
Log.d("window_focus", "textview width is:" + width);
Log.d("window_focus", "textview height is:" + height);
}
可以获得宽和高，即只有当View完全关联到Window的情况下，才可以获得View的宽高和给View设置背景
AnimationDrawable: android.graphic.drawable.AnimationDrawable
//获得我们xml定义的AnimationDrawable
animDrawable=(AnimationDrawable) getResources().getDrawable(R.anim.frame_animation);
一段参考代码：
@Override
publicvoid onWindowFocusChanged(boolean hasFocus) {
// TODO Auto-generated method stub
if(hasFocus) {
imageView.setBackgroundResource(R.anim.frame_animation);
animDrawable = (AnimationDrawable) imageView.getBackground();
animDrawable.start();
AlphaAnimation aas=new AlphaAnimation(0.1f,1.0f);
//设置动画时间长度
aas.setDuration(3500);
//启动动画
imageView.startAnimation(aas);
//设置动画监听
aas.setAnimationListener(new AnimationListener()
{
@Override
publicvoid onAnimationEnd(Animation arg0) {
//停止帧动画
imageView.setVisibility(View.GONE);
Log.i(TAG,"FY_stop");
animDrawable.stop();
}
@Override
publicvoid onAnimationRepeat(Animation animation) {
}
@Override
publicvoid onAnimationStart(Animation animation) {
//将imageView的背景设置成动画
imageView.setBackgroundResource(R.anim.frame_animation);
animDrawable = (AnimationDrawable)imageView.getBackground();
//设置动画透明度
animDrawable.setAlpha(80);
//启动动画
animDrawable.start();
}
}
);
}
}