Android實戰簡易教程-第五十六槍（類比美團用戶端進度提示框），android實戰

Android實戰簡易教程-第五十六槍（類比美團用戶端進度提示框），android實戰

用過美團用戶端的朋友都知道，美團的載入等待提示很有意思，是一種動畫的形式展現給我們，下面我們就對這背後的原理進行瞭解，然後實現自己的等待動畫效果。

首先我們準備兩張圖片：

這兩張圖片看起來一模一樣啊？細心的朋友會發現唯一不同的就在腳部，OK，我們就利用這兩張圖片的輪換播放實現動畫效果，下面看一下代碼：

1.動畫檔案frame_meituan.xml:

<?xml version="1.0" encoding="utf-8"?><animation-list xmlns:android="http://schemas.android.com/apk/res/android"    android:oneshot="false" >    <item        android:drawable="@drawable/progress_loading_image_01"        android:duration="150"/>    <item        android:drawable="@drawable/progress_loading_image_02"        android:duration="150"/></animation-list>

150毫秒進行圖片的切換，類比動畫效果。

2.簡單自訂一個控制項-MeituanProgressDialog.java:

package com.finddreams.runningman;import android.app.ProgressDialog;import android.content.Context;import android.graphics.drawable.AnimationDrawable;import android.os.Bundle;import android.widget.ImageView;import android.widget.TextView;import com.example.runningman.R;/** * @Description:自訂對話方塊 * @author http://blog.csdn.net/yayun0516 */public class MeituanProgressDialog extends ProgressDialog {private AnimationDrawable mAnimation;private Context mContext;private ImageView mImageView;private String mLoadingTip;private TextView mLoadingTv;private int count = 0;private String oldLoadingTip;private int mResid;/** *  * @param context *            內容物件 * @param content *            顯示文字提示資訊內容 * @param id *            動畫id */public MeituanProgressDialog(Context context, String content, int id) {super(context);this.mContext = context;this.mLoadingTip = content;this.mResid = id;setCanceledOnTouchOutside(true);}@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);initView();initData();}private void initData() {mImageView.setBackgroundResource(mResid);// 通過ImageView對象拿到背景顯示的AnimationDrawablemAnimation = (AnimationDrawable) mImageView.getBackground();mImageView.post(new Runnable() {@Overridepublic void run() {mAnimation.start();}});mLoadingTv.setText(mLoadingTip);}public void setContent(String str) {mLoadingTv.setText(str);}private void initView() {setContentView(R.layout.progress_dialog);// 顯示介面mLoadingTv = (TextView) findViewById(R.id.loadingTv);mImageView = (ImageView) findViewById(R.id.loadingIv);}}

上面用到的提示布局檔案的progress_dialog.xml:

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="wrap_content"    android:layout_height="wrap_content"   android:layout_gravity="center"    android:orientation="vertical" >    <ImageView        android:id="@+id/loadingIv"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="@anim/frame_meituan"/>    <TextView        android:id="@+id/loadingTv"        android:layout_width="wrap_content"        android:layout_height="wrap_content"android:layout_alignBottom="@+id/loadingIv"android:layout_centerHorizontal="true"android:textSize="20sp"        android:text="正在載入中.." /></RelativeLayout>

最後在Activity中調用：

package com.finddreams.runningman;import com.example.runningman.R;import android.app.Activity;import android.os.Bundle;import android.os.Handler;import android.view.View;/** * @Description: 奔跑小人的動畫進度條對話方塊，可以用作載入資料介面 * @author http://blog.csdn.net/yayun0516 */ public class MeiTuanManActivity extends Activity {private MeituanProgressDialog dialog;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.meituan_progressdialog);}/** * 顯示美團進度對話方塊 * @param v */public void showmeidialog(View v){dialog =new MeituanProgressDialog(this, "正在載入中",R.anim.frame_meituan);dialog.show();Handler handler =new Handler();handler.postDelayed(new Runnable() {@Overridepublic void run() {dialog.dismiss();}}, 3000);//3秒鐘後調用dismiss方法隱藏；}}

最後，讓我們的程式跑起來：

ok，跑起來了，你想要加入你的項目，只需要準備兩張圖片替換下來即可類比動畫。

源碼免費下載

最後關注我一下唄，謝謝！

著作權聲明：本文為博主原創文章，未經博主允許不得轉載。