仿照ContentLoadingProgressBar 的特点在Android项目中自定义Loading对话框

ContentLoadingProgressBar 是 Android 中的一个控件，继承自 ProgressBar。它在 ProgressBar 的基础上添加了一些特殊功能，主要用于在加载内容时显示进度。它的一些主要特点如下：

1. 自动隐藏和显示：ContentLoadingProgressBar 会在内容加载完成后自动隐藏，并在内容开始加载时自动显示。这减少了手动控制进度条显示和隐藏的代码量。
2. 延迟显示：为了避免在短时间内频繁显示和隐藏进度条，ContentLoadingProgressBar 提供了一个延迟显示的功能。如果内容加载时间非常短，进度条可能不会显示出来。
3. 延迟隐藏：类似地，ContentLoadingProgressBar 也提供了延迟隐藏的功能，以确保进度条在内容加载完成后不会立即消失，从而提供更好的用户体验。

这些功能使 ContentLoadingProgressBar 成为一个更智能、更易用的进度条控件，特别适合在需要频繁加载内容的应用中使用。

1、ContentLoadingProgressBar 的特性

从注释中可以看出，ContentLoadingProgressBar 在 ProgressBar 的基础上添加了以下特性：

1. 在显示之前会等待一段时间来被隐藏：这意味着在显示之前，ContentLoadingProgressBar 会等待一段时间，如果在这段时间内被隐藏，那么就不会显示出来。
2. 一旦显示，ContentLoadingProgressBar 会在一段时间内保持可见：这确保了进度条不会在短时间内频繁显示和隐藏，避免了 UI 视图的“闪烁”现象。

这种“闪烁”现象在项目开发中很常见，例如在进行网络请求之前显示 Loading 对话框，请求完成之后再隐藏。如果网络请求耗时很短，就会导致对话框在短时间内显示和隐藏，造成“闪烁”现象。ContentLoadingProgressBar 的这两个特性很好地解决了这个问题。

2、ContentLoadingProgressBar 的实现

ContentLoadingProgressBar 中定义了两个 int 类型的常量 MIN_SHOW_TIME 和 MIN_DELAY，分别表示显示的最短时间和延迟显示的时间，值都是 500ms。mDelayedShow 和 mDelayedHide 是两个 Runnable 任务，分别对应延时显示和延时隐藏。在控制 ContentLoadingProgressBar 的显示和隐藏时不能使用 setVisibility() 方法，而是需要使用 show() 和 hide() 方法。

show() 方法

public void show() {mStartTime = -1;mPostedHide = false;mPostedShow = true;removeCallbacks(mDelayedHide);if (!mPostedShow) {postDelayed(mDelayedShow, MIN_DELAY);}
}

show() 方法首先会做一些状态的恢复处理，将 mStartTime 恢复为 -1，mStartTime 记录了 ContentLoadingProgressBar 开始显示的时间，接着将延时隐藏任务 mDelayedHide 从任务队列中移除。方法最后会判断 mPostedShow 的值，如果为 false 就调用 postDelayed() 方法延迟 MIN_DELAY（500ms）后执行 mDelayedShow 任务。mPostedShow 用于标记 mDelayedShow 是否已添加到任务队列中，防止任务的重复执行。mDelayedShow 任务的逻辑很简单，主要就是记录开始显示的时间并执行 setVisibility(View.VISIBLE) 将 ContentLoadingProgressBar 显示出来。

hide() 方法

public void hide() {mPostedHide = true;removeCallbacks(mDelayedShow);long diff = System.currentTimeMillis() - mStartTime;if (diff >= MIN_SHOW_TIME || mStartTime == -1) {setVisibility(View.GONE);} else {postDelayed(mDelayedHide, MIN_SHOW_TIME - diff);}
}

hide() 方法和 show() 方法类似，首先将延时显示任务 mDelayedShow 从任务队列中移除，因此如果调用 show() 和 hide() 方法之间的间隔时间小于 MIN_DELAY（500ms），mDelayedShow 就不会执行了，ContentLoadingProgressBar 也就不会显示了。接下来会计算 System.currentTimeMillis() - mStartTime 的值，即此时 ContentLoadingProgressBar 的显示时间，如果此时 mStartTime 的值为 -1（ContentLoadingProgressBar 还没有显示）或者显示时间超过了 MIN_SHOW_TIME（500ms），直接执行 setVisibility(View.GONE) 隐藏 ContentLoadingProgressBar；反之则说明 ContentLoadingProgressBar 的显示时间没有达到最短时间 500ms，计算剩余的时间，延时执行隐藏任务，保证 ContentLoadingProgressBar 最短可以显示 500ms。这里的 mPostedHide 作用同样是防止延时隐藏任务的重复执行。mDelayedHide 任务的逻辑也比较简单，将 mStartTime 恢复为 -1，执行 setVisibility(View.GONE) 隐藏 ContentLoadingProgressBar。

3、自定义Loading 对话框

ContentLoadingProgressBar 给了我们很好的思路，解决 Loading 对话框“闪烁”问题需要做到以下两点：

1. 显示 Loading 对话框之前先等待一段时间。
2. 隐藏 Loading 对话框时判断显示时间是否达到了最短显示时间，如果没有达到就延时执行隐藏任务。

清楚思路后就可以优化 Loading 对话框了，直接附上完整代码：

package com.jpc.customwidgetstudy.widgetimport android.app.Activity
import android.app.AlertDialog
import android.content.Context
import android.os.Handler
import android.os.Looper
import android.view.LayoutInflater
import android.view.ViewGroup
import android.widget.TextView
import com.jpc.customwidgetstudy.R/*** 自定义Loading Dialog, 用于显示加载中的状态*/
class LoadingDialog(context: Context): AlertDialog(context, R.style.Theme_AppCompat_Dialog){companion object{// 最短显示时间private const val MIN_SHOW_TIME = 500L// 最短延迟时间private const val MIN_DELAY_TIME = 500L}private var tvMessage: TextViewinit {val parent = (context as? Activity)?.findViewById<ViewGroup>(android.R.id.content)val loadView = LayoutInflater.from(context).inflate(R.layout.dialog_loading, parent, false)setView(loadView)tvMessage = loadView.findViewById(R.id.tv_message)}// 记录开始时间private var mStartTime: Long = -1// 防止延时隐藏任务的重复执行private var mPostedHide: Boolean = false// 防止延时显示任务的重复执行private var mPostedShow: Boolean = false// 是否已经消失private var mDismissed: Boolean = false// 主线程Handlerprivate val mHandler = Handler(Looper.getMainLooper())// 显示private val mDelayedShow: Runnable = Runnable {mPostedShow = falseif (!mDismissed){mStartTime = System.currentTimeMillis()show()}}// 隐藏private val mDelayedHide: Runnable = Runnable {mPostedHide = falsemStartTime = -1dismiss()}// 显示Dialogfun showDialog(message: String){tvMessage.text = messagemStartTime = -1mDismissed = falsemHandler.removeCallbacks(mDelayedHide)mPostedHide = falseif (!mPostedShow){mHandler.postDelayed(mDelayedShow, MIN_DELAY_TIME)mPostedShow = true}}// 隐藏Dialogfun hideDialog(){mDismissed = truemHandler.removeCallbacks(mDelayedShow)mPostedShow = falseval diff = System.currentTimeMillis() - mStartTimeif (diff >= MIN_SHOW_TIME || mStartTime == -1L){dismiss()}else{if (!mPostedHide){mHandler.postDelayed(mDelayedHide, MIN_SHOW_TIME - diff)mPostedHide = true}}}// 从Window移除时移除所有的Callbackoverride fun onDetachedFromWindow() {super.onDetachedFromWindow()mHandler.removeCallbacks(mDelayedHide)mHandler.removeCallbacks(mDelayedShow)}
}

可以定义Dialog的大小

    <style name="Theme.AppCompat.Dialog" parent="Theme.AppCompat.Light.Dialog"><!-- Customize your dialog theme here --><item name="android:windowBackground">@color/loading_color</item><item name="android:windowMinWidthMajor">30%</item><item name="android:windowMinWidthMinor">30%</item><item name="android:padding">6dp</item></style><!-- Custom ProgressBar style --><style name="CustomProgressBar" parent="Widget.AppCompat.ProgressBar"><item name="android:indeterminateTint">@color/colorPrimary</item></style>

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"xmlns:app="http://schemas.android.com/apk/res-auto"><ProgressBarandroid:id="@+id/progressBar"android:layout_width="wrap_content"android:layout_height="wrap_content"app:layout_constraintBottom_toTopOf="@id/tv_message"app:layout_constraintStart_toStartOf="@id/tv_message"app:layout_constraintEnd_toEndOf="@id/tv_message"style="@style/CustomProgressBar"/><TextViewandroid:id="@+id/tv_message"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="加载中..."app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent" /></androidx.constraintlayout.widget.ConstraintLayout>

布局文件就是一个 ProgressBar 和一个 TextView，用于展示提示信息。控制 Loading 对话框的显示和隐藏直接使用 showDialog() 和 hideDialog() 方法就可以了。为了简单示例，这里自定义的 Dialog 直接继承自 AlertDialog，注意要在适当的时机移除延时任务，防止内存泄漏。

效果如下：

总结

本文通过分析 ContentLoadingProgressBar 的原理引出了项目开发中 Loading 对话框的一种优化方式，避免对话框显示和隐藏间隔时间太短导致的“闪烁”现象。