19 进度条——ProgressBar

今天要学的是一个特定场合要用到的控件——进度条控件。进度条的作用不言而喻,而在实际使用中,通常会有两种类型的进度条:横向进度条和圆形进度条。当然,ProgressBar 也是支持这两种类型的,可以应对大多数的开发场景。

1. ProgressBar 的特性

ProgressBar 是一个图形类型的控件,用来展示当前进度,可以是下载、跳转、切换、保存等等任何可能比较耗时的任务,它在很多场景下对用户体验是有很大帮助的,所以我们千万不能忽略它,要学会灵活的使用,否则用户可能会以为发送了卡顿或者 ANR 从而关闭应用,大大减低用户体验。

2. ProgressBar 的属性

我们先来看看 ProgressBar 的常用属性:

  • android:max:
    设置 ProgressBar 的最大值,即进度条走完时的总进度。通常和业务相关,比如下载 的时候,那么 max 就可以设置成下载文件的大小。默认是 100。
  • android:indeterminate:
    设置是否开启不确定模式,该属性是一个 boolean 值。不确定模式就是我们在使用 Android 手机的时候,会有两种进度条的样式,一种是一直循环转圈的,还有一种是会跟随进度改变的。true 表示进度条会展示实际的进度;而 false 表示在加载时会无限循环展示 loading 动画。
  • android:minHeight:
    设置最小高度。
  • android:minWidth:
    设置最小宽度。
  • android:progress:
    设置进度条的当前进度。
  • style:
    设置进度条的样式,默认情况下,Android 系统会展示一个循环转圈的 loading 样式,而如果需要设置其他样式,就要用的 style 属性,比如通过设置styleandroid:attr/progressBarStyleHorizontal可以设置成横向进度条的样式。
  • android:progressDrawable:
    设置进度条对应的 Drawable 对象的样式
  • android:secondaryProgress:
    设置二级进度条的进度。看过视频或者听过音乐的应该都知道,我们会有两级进度条,一级是播放进度,二级是缓冲进度。
    基本上常用的属性就这么多,都还比较好理解,这只是添加了一个进度条,如果我们是android:indeterminate模式,那只需要展示进度条和隐藏即可;但是如果android:indeterminate为 false,在实际使用中我们还需要在代码的逻辑里去实时更新进度条,这就需要配合 Java 的 api 来完成了。

3. ProgressBar 的常用 API

  • getMax():
    返回进度条的最大值,即进度条的总进度,和android:max属性相通。
  • getProgress():
    查询当前进度,和android:progress属性相通。
  • getSecondaryProgress():
    查询当前的二级进度,和android:secondaryProgress属性相通。
  • incrementProgressBy(int diff):
    设置当前增长的进度。
  • incrementSecondaryProgressBy(int diff):
    设置当前二级进度增长的值。
  • isIndeterminate():
    查询当前进度条是否在不确定模式下。
  • setIndeterminate(boolean indeterminate):
    设置进度条是否启动不确定模式,和android:indeterminate属性相通。
    以上常用 API 和属性基本都是挂钩的,所以我们可以根据业务场景动态的去更新进度条,从而实现进度的展示。

4. ProgressBar 编码

Ok,我们有了布局设置以及 API 控制,就可以开始完成一个进度条的开发了,本节将在 Activity 中启动一个子线程,在子线程中通过 sleep 300 毫秒来模拟一个耗时任务,并在执行任务的过程中不断更新进度条。
首先编写布局,我们添加一个横向非不确定进度条展示精确精度和一个圆形不确定进度条不展示确定进度,然后添加一个 TextView 用于展示具体的进度情况,代码如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ProgressBar
        android:id="@+id/progressBar_horizontal"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="30dp"
        android:indeterminate="false"
        android:max="100"
        android:minWidth="200dp"
        android:minHeight="50dp"
        android:progress="1" />

    <ProgressBar
        android:id="@+id/progressBar_circle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:minWidth="50dp"
        android:minHeight="50dp" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/progressBar_horizontal"
        android:layout_alignLeft="@+id/progressBar_horizontal" />

</RelativeLayout>

布局完成效果如下,上方有一个进度为 1 的横向进度条,中间有一个循环转圈的圆形进度条。目前任务还没开启,所以还没有进度展示,TextView 内容为空。

Progress示例

下面通过 Java 编写后台耗时任务,并同步更新进度条:

package com.emercy.myapplication;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.widget.ProgressBar;
import android.widget.TextView;

public class MainActivity extends Activity {

    private ProgressBar progressBar;
    private int progressStatus = 0;
    private TextView textView;
    private Handler handler = new Handler();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        progressBar = findViewById(R.id.progressBar_horizontal);
        textView = findViewById(R.id.textView);
        new Thread(new Runnable() {
            public void run() {
                while (progressStatus < 100) {
                    progressStatus += 1;
                    handler.post(new Runnable() {
                        public void run() {
                            progressBar.setProgress(progressStatus);
                            textView.setText(progressStatus + "/" + progressBar.getMax());
                        }
                    });
                    try {
                        // sleep 300毫秒模拟耗时任务
                        Thread.sleep(300);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                }
            }
        });
    }
}

在上面的代码中,横向 ProgressBar 会在每 300 毫秒更新一次进度(进度增加多少可以根据具体场景,比如下载量、保存量、解析量等等),更新进度通过setProgress()接口完成。另外本节运用了 Handler 去完成更新,因为耗时操作我们通常会放在子线程,但是 Android 系统要求不能在子线程中进行 UI 操作,所以我们通过 Handler 完成子线程到主线程的切换(具体的使用方法会在后面 Handler 章节详细讲解,这里重点关注 ProgressBar 的使用),直到进度条增加为 100,表示任务完成;而另一个进度条会循环 loading,此时会一直循环播放进度动画,直到主动关闭,下面是一张代码的效果图:

![Progress实时更新]
Progress实时更新

5. 小结

本节学习了进度条控件,介绍 PregressBar 的主要属性及常用API,完成了一个耗时任务的进度实时更新程序。ProgressBar 主要针对需要执行耗时任务并且阻塞UI的场景,目的是给用户一个比较好的等待体验。
当然如果对 UI 要求很高,或者需要很复杂的 loading 动画的时候,ProgressBar 也许就不尽如人意了。这时候需要通过自定义 View 完全实现一个自己的进度条控件,这个大家在学习了自定义控件之后就可以轻松完成,关于自定义控件我们也会在后面的章节陆续学习到,敬请期待!

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,723评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,485评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,998评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,323评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,355评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,079评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,389评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,019评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,519评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,971评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,100评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,738评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,293评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,289评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,517评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,547评论 2 354
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,834评论 2 345

推荐阅读更多精彩内容