当前位置：移动技术网 > IT编程>移动开发>Android > Android 进度条使用详解及示例代码

Android 进度条使用详解及示例代码

2019年07月24日 | 移动技术网IT编程 | 我要评论

中秋节诗歌朗诵,莫小囧,匹瑞诺德王冠

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

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

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

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

<progressbar
android:id=”@+id/pb_progressbar”
style=”@style/styleprogressbarmini”
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″?>
<layer-list 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>
</layer-list>

再来看看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, animation.relative_to_self, 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, 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, 360, animation.relative_to_self, 0.5f, animation.relative_to_self, 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());
/** 监听动作，动画结束时，隐藏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, layoutparams.fill_parent, layoutparams.fill_parent);
view parentview = ((activity) context).getwindow().findviewbyid(window.id_android_content);
popupdialog.showatlocation(parentview, gravity.center, 0, 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_loading);
loadingcolordialog2 = 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();
}
}
}

以上就是对android 进度条资料整理，后续继续补充相关资料，谢谢大家对本站的支持！

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！点击进行留言回复

Android制作登录页面并且记住账号密码功能的实现代码

一、页面搭建<?xml version="1.0" encoding="utf-8"?><android.support.co... [阅读全文]
Android studio开发小型对话机器人app(实例代码)

前言偶然在网上看到一个免费机器人接口，所以生此想法，接口地址：，android开发比爬虫要繁琐得多，所以本文我将细说接口的调用方法，读者可根据思路去网上找一些免... [阅读全文]
Android通过Java sdk的方式接入OpenCv的方法

简述公司最近要做运动检测和眼球追踪，鉴于资费等因素，最后考虑使用opencv的相关api来来满足业务需求。在使用过程中发现opencv的v4.2.0和v4.1.... [阅读全文]
Android 通过cmake的方式接入opencv的方法步骤

简述我们通过java sdk的方式已经将opencv接入到项目中了，如果想使用opencv sdk 提供的 c++ 头文件与 .so动态库,自己封装jni这样... [阅读全文]
Android开发学习实现简单计算器

这里是用线性布局实现的计算器，为防止以后再回顾知识代码找不到，特将代码贴在这里：xml文件的布局代码：<?xml version="1.0" en... [阅读全文]
Android Studio finish()方法的使用与解决app点击“返回”(直接退出)

在这里，我们将用到finish(),简单介绍一下它的使用:finish()官方解析:call this when your activity is done a... [阅读全文]
Flutter 实现虎牙/斗鱼弹幕功能

用flutter实现弹幕功能，轻松实现虎牙、斗鱼的弹幕效果。先来一张效果图：实现原理弹幕的实现原理非常简单，即将一条弹幕从左侧平移到右侧，当然我们要计算弹幕垂直... [阅读全文]
Flutter 插件url_launcher简介

url_launcher是用于在移动平台中启动url的flutter插件，适用于ios和android平台。他可以打开网页，发送邮件，还可以拨打电话。githu... [阅读全文]
Android 进度条 ProgressBar的实现代码(隐藏、出现、加载进度)

初识进度条progressbar软件：android studio实现：1.点击按钮，进度条隐藏；再次点击，进度条出现。循环2.点击按钮，水平进度条进度呈现并+... [阅读全文]
Flutter 实现网易云音乐字幕的代码

没有接触过音乐字幕方面知识的话，会对字幕的实现比较迷茫，什么时候转到下一句？看了这篇文章，你就会明白字幕so easy。先来一张效果图：字幕格式目前市面上有很多... [阅读全文]

网友评论


验证码：

Android 进度条使用详解及示例代码

2019年07月24日 | 移动技术网IT编程 | 我要评论

您可能感兴趣的文章:

相关文章:

网友评论