Android loading进度条使用简单总结

Android loading进度条使用简单总结,第1张

概述在这里,总结一下loading进度条的使用简单总结一下。一、说起进度条,必须说说条形进度条,经常都会使用到嘛,特别是下载文件进度等等,还有像腾讯QQ安装进度条一样,有个进度总给人良好的用户体验。先来找

在这里,总结一下loading进度条的使用简单总结一下。

一、说起进度条,必须说说条形进度条,经常都会使用到嘛,特别是下载文件进度等等,还有像腾讯QQ安装进度条一样,有个进度总给人良好的用户体验。

先来找图看看,做这个图完成不用图片就可以做到了。

看下xml布局文件,其实就是直接用xml写的在加两个属性设置一下就好了,一个style,另一个是background。

    <Progressbar        androID:ID="@+ID/pb_progressbar"                androID:layout_wIDth="fill_parent"        androID:layout_height="wrap_content"        androID:layout_margin="30dp"        androID:background="@drawable/shape_progressbar_bg"        androID:max="100"        androID:progress="50" />

先看style吧

    <style name="StyleProgressbarMini" parent="@androID:style/Widget.Progressbar.Horizontal">         <item name="androID:maxHeight">50dip</item>         <item name="androID:minHeight">10dip</item>         <item name="androID:indeterminateOnly">false</item>         <item name="androID:indeterminateDrawable">@androID:drawable/progress_indeterminate_horizontal</item>         <item name="androID:progressDrawable">@drawable/shape_progressbar_mini</item>     </style>

这里的progressDrawable又是引用一个自定义drawable,不是图片哦。

shape_progressbar_mini.xml

<?xml version="1.0" enCoding="utf-8"?><@R_353_3419@ xmlns:androID="http://schemas.androID.com/apk/res/androID" >	<!-- 背景 -->    <item androID:ID="@androID:ID/background">        <shape>            <corners androID:radius="5dip" />            <gradIEnt                androID:angle="270"                androID:centerY="0.75"                androID:endcolor="#FFFFFF"                androID:startcolor="#FFFFFF" />        </shape>    </item>    <item androID:ID="@androID:ID/secondaryProgress">        <clip>            <shape>                <corners androID:radius="0dip" />                <gradIEnt                    androID:angle="270"                    androID:centerY="0.75"                    androID:endcolor="#df0024"                    androID:startcolor="#df0024" />            </shape>        </clip>    </item>    <item androID:ID="@androID:ID/progress">        <clip>            <shape>                <corners androID:radius="5dip" />                <gradIEnt                    androID:angle="270"                    androID:centerY="0.75"                    androID:endcolor="#de42ec"                    androID:startcolor="#de42ec" />            </shape>        </clip>    </item></@R_353_3419@>

再来看看shape_progressbar_bg.xml

<?xml version="1.0" enCoding="UTF-8"?><shape xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:shape="rectangle" >    <!-- 边框填充的颜色 -->    <solID androID:color="#cecece" />    <!-- 设置进度条的四个角为弧形 -->    <!-- androID:radius 弧形的半径 -->    <corners androID:radius="90dp" />     <!--    padding:边界的间隔-->    <padding        androID:bottom="1dp"        androID:left="1dp"        androID:right="1dp"        androID:top="1dp" /></shape>

就这样把一个漂亮的条形进度条做好了,在shape_progressbar_bg.xml中,边框填充的颜色是一种挺好的方法,加了一个进度条的边框。另外为了进度条四个角都是圆形的,就用了这个属性<corners androID:radius="90dp" /> 。

搞定,这个时候可以开心一下了,去喝杯水先。

 

二、圆形进度条。另一个比较常用的就是圆形进度条,表示正在进行中。。。

来看2张小图

 

先看第一张,分析下代码,用自定义的vIEw,用pop来做的哦。LoadingDialog.java

public class LoadingDialog {	private Context context;	private PopupWindow popupDialog;	private LayoutInflater layoutInflater;	private relativeLayout layout;	private relativeLayout layout_bg;	private VIEw circleVIEw;	private RotateAnimation rotateAnim;	private AlphaAnimation AlphaAnim_in;	private AlphaAnimation AlphaAnim_out;	public LoadingDialog(Context context) {		layoutInflater = LayoutInflater.from(context);		this.context = context;	}	private voID initAnim() {		rotateAnim = new RotateAnimation(0,360,Animation.relative_TO_SELF,0.5f,0.5f);		rotateAnim.setDuration(2000);		rotateAnim.setRepeatMode(Animation.RESTART);		rotateAnim.setRepeatCount(-1);		rotateAnim.setInterpolator(new linearInterpolator());		AlphaAnim_in = new AlphaAnimation(0f,1f);		AlphaAnim_in.setFillAfter(true);		AlphaAnim_in.setDuration(200);		AlphaAnim_in.setInterpolator(new linearInterpolator());		AlphaAnim_out = new AlphaAnimation(1f,0f);		AlphaAnim_out.setFillAfter(true);		AlphaAnim_out.setDuration(100);		AlphaAnim_out.setInterpolator(new linearInterpolator());		AlphaAnim_out.setAnimationListener(new AnimationListener() {			@OverrIDe			public voID onAnimationStart(Animation arg0) {			}			@OverrIDe			public voID onAnimationRepeat(Animation arg0) {			}			@OverrIDe			public voID onAnimationEnd(Animation arg0) {				dismiss();			}		});	}	/**	 * 判断是否显示	 * @return	 */	public boolean isShowing() {		if (popupDialog != null && popupDialog.isShowing()) {			return true;		}		return false;	}	/**	 * 显示	 */	public voID show() {		dismiss();		initAnim();		layout = (relativeLayout) layoutInflater.inflate(R.layout.vIEw_loadingdialog,null);		circleVIEw = (VIEw) layout.findVIEwByID(R.ID.loading_dialog);		layout_bg = (relativeLayout) layout.findVIEwByID(R.ID.bgLayout);		popupDialog = new PopupWindow(layout,LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT);		VIEw parentVIEw = ((Activity) context).getwindow().findVIEwByID(Window.ID_ANDROID_CONTENT);		popupDialog.showAtLocation(parentVIEw,Gravity.CENTER,0);		layout_bg.startAnimation(AlphaAnim_in);		circleVIEw.startAnimation(rotateAnim);	}	/**	 * 隐藏	 */	public voID dismiss() {		if (popupDialog != null && popupDialog.isShowing()) {			layout_bg.clearanimation();			circleVIEw.clearanimation();			popupDialog.dismiss();		}	}}

这里呢引用了vIEw_loadingdialog.xml,已作整个页面的背景和loading框。

vIEw_loadingdialog.xml

<?xml version="1.0" enCoding="utf-8"?><relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:layout_wIDth="match_parent"    androID:layout_height="match_parent" ><relativeLayout    androID:ID="@+ID/bgLayout"    androID:layout_wIDth="match_parent"    androID:layout_height="match_parent"    androID:background="#66000000" >    <VIEw        androID:ID="@+ID/loading_dialog"        androID:layout_wIDth="48dp"        androID:layout_height="48dp"        androID:layout_centerInParent="true"        androID:background="@drawable/shape_loading_dialog" /></relativeLayout></relativeLayout>

再看看这个shape_loading_dialog.xml,绘制转动的圆形性状,又不用图片挺好的。

<?xml version="1.0" enCoding="utf-8"?><shape xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:shape="oval" >    <stroke         androID:wIDth="3dp"        androID:dashWIDth="2dp"        androID:dashGap="3dp"        androID:color="#fff"/>    <gradIEnt         androID:startcolor="#00ffffff"        androID:endcolor="#00ffffff"        androID:angle="180"/></shape>

就是这样子,实现了第一个圆形进度条。

可是如果做有颜色的圆形进度条呢,或者彩色的,后来想想不如加个图片来实现好了。

LoadingimgDialog.java

public class LoadingimgDialog {	private Context context;	private PopupWindow popupDialog;	private LayoutInflater layoutInflater;	private relativeLayout layout;	private relativeLayout layout_bg;	private int resIDBg;	private VIEw loading_dialog;	/** 背景添加旋转动画效果,实现了转动动作   **/	private RotateAnimation rotateAnim;	/** 透明度动画效果  **/	private AlphaAnimation AlphaAnim_in;	private AlphaAnimation AlphaAnim_out;	public LoadingimgDialog(Context context,int resIDBg) {		layoutInflater = LayoutInflater.from(context);		this.resIDBg = resIDBg;		this.context = context;	}	private voID initAnim() {		rotateAnim = new RotateAnimation(0,0f);		AlphaAnim_out.setFillAfter(true);		AlphaAnim_out.setDuration(100);		AlphaAnim_out.setInterpolator(new linearInterpolator());		/** 监听动作,动画结束时,隐藏LoadingcolorDialog **/		AlphaAnim_out.setAnimationListener(new AnimationListener() {			@OverrIDe			public voID onAnimationStart(Animation arg0) {			}			@OverrIDe			public voID onAnimationRepeat(Animation arg0) {			}			@OverrIDe			public voID onAnimationEnd(Animation arg0) {				dismiss();			}		});	}	/**	 * 判断是否显示	 * @return	 */	public boolean isShowing() {		if (popupDialog != null && popupDialog.isShowing()) {			return true;		}		return false;	}	/**	 * 显示	 */	public voID show() {		dismiss();		initAnim();		layout = (relativeLayout) layoutInflater.inflate(R.layout.vIEw_loadingcolordialog,null);		loading_dialog = (VIEw) layout.findVIEwByID(R.ID.loading_dialog);		loading_dialog.setBackgroundResource(resIDBg);				layout_bg = (relativeLayout) layout.findVIEwByID(R.ID.bgLayout);		popupDialog = new PopupWindow(layout,0);		layout_bg.startAnimation(AlphaAnim_in);		loading_dialog.startAnimation(rotateAnim);	}	/**	 * 隐藏	 */	public voID dismiss() {		if (popupDialog != null && popupDialog.isShowing()) {			layout_bg.clearanimation();			loading_dialog.clearanimation();			popupDialog.dismiss();		}	}}

其实就是修改了一个地方,加入resIDBg,用图片资源设置圆形进度条那一小部分的背景。

稍稍修改一句代码换一张图片,就变成了另一个圆形进度条了,好玩吧。

		loadingcolorDialog = new LoadingimgDialog(this,R.drawable.img_loading);		loadingcolorDialog2 = new LoadingimgDialog(this,R.drawable.img_loading2);

给看看全屏效果图吧,就稍稍修改一句代码换一张图片哦。

最后给MainActivity.java看看

public class MainActivity extends Activity implements OnClickListener {	button bt_loading_dialog;	button bt_color_loading_dialog;	button bt_color_loading_dialog2;		LoadingDialog loadingDialog;	LoadingimgDialog loadingcolorDialog;	LoadingimgDialog loadingcolorDialog2;	@OverrIDe	protected voID onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentVIEw(R.layout.activity_main);				initVIEw();	}	private voID initVIEw() {		bt_loading_dialog = (button) findVIEwByID(R.ID.bt_loading_dialog);		bt_loading_dialog.setonClickListener(this);		bt_color_loading_dialog = (button) findVIEwByID(R.ID.bt_loading_img_dialog);		bt_color_loading_dialog.setonClickListener(this);				bt_color_loading_dialog2 = (button) findVIEwByID(R.ID.bt_loading_img_dialog2);		bt_color_loading_dialog2.setonClickListener(this);				loadingDialog = new LoadingDialog(this);		loadingcolorDialog = new LoadingimgDialog(this,R.drawable.img_loading2);	}	@OverrIDe	public voID onClick(VIEw vIEw) {		switch (vIEw.getID()) {		case R.ID.bt_loading_dialog:			loadingDialog.show();			break;		case R.ID.bt_loading_img_dialog:			loadingcolorDialog.show();			break;		case R.ID.bt_loading_img_dialog2:			loadingcolorDialog2.show();			break;		default:			break;		}	}		@OverrIDe	protected voID onDestroy() {		super.onDestroy();		loadingcolorDialog.dismiss();	}	@OverrIDe	public voID onBackpressed() {		if (loadingDialog.isShowing()) {			loadingDialog.dismiss();		} else if (loadingcolorDialog.isShowing()){			loadingcolorDialog.dismiss();		} else if (loadingcolorDialog2.isShowing()){			loadingcolorDialog2.dismiss();		} else {			finish();		}	}}

 

本文链接:http://www.cnblogs.com/liqw/p/3995794.HTML

下载地址:http://download.csdn.net/detail/lqw770737185/8002967

 谁要项目的请留下邮箱吧,还没上传好源文件呢,有什么问题留言哦,大家晚安吧。

总结

以上是内存溢出为你收集整理的Android loading进度条使用简单总结全部内容,希望文章能够帮你解决Android loading进度条使用简单总结所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1119266.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-29
下一篇2022-05-29

发表评论

登录后才能评论

评论列表(0条)

    保存