在 Android 中使用 Glide 库下载和显示图像

前言

今天，我们为我们一整天所做的每一项任务都提供了移动应用程序。我们喜欢使用更具交互性和更好 UI 的应用程序。而让 App 更具交互性的最重要的事情是图像的使用。

是的，图像在使应用程序的 UI 更具交互性和用户友好性方面发挥着重要作用。所以，作为一名 Android 开发者，我们应该注意在我们的 App 中使用图片。我们应该处理图像的各个方面，例如加载缓慢、图像无响应、内存问题等等。如果您不处理这些方面，那么您的应用程序会给您的用户留下不好的印象。

为了管理 Android 应用程序中使用的图像的各个方面，Google 在 Google I/O 2014 中推荐使用Glide 库。因此，在本博客中，我们将学习如何使用Glide 库来下载图像并使用它在我们的应用程序中。这篇文章的大纲如下：

• 什么是Glide？
• Glide 库的特点
• 在 Android 中使用 Glide
• 更多功能
• 结论

什么是Glide？

更准确的说，Glide是一个面向 Android 的开源媒体管理框架，它将媒体解码、内存和磁盘缓存以及资源池封装到一个简单易用的界面中。

换句话说，Glide Library 是一个流行的用于图像下载和缓存的 android 库，由bumptech开发。它基本上专注于平滑滚动。很多时候，发现如果你尝试加载一个非常大尺寸的图像，那么你的应用程序将不会流畅。滚动不会很流畅，但是通过使用 Glide 你可以摆脱这个问题。

Glide 的主要焦点是使滚动尽可能平滑和快速。但 Glide 也可用于获取、调整大小和显示远程图像。

Glide 库的特点

Glide 支持大量的功能。其中一些是：

• GIF 的使用：在 Glide 中，您也可以使用 GIF。将静态图像放入应用程序的时代已经一去不复返了。现在，您可以使用 Glide 使用 GIF。
• 磁盘缓存： Glide 从给定的 URL 下载图像，将其调整为要显示图像的图像视图的大小，并将其存储到磁盘缓存中。如果你将同一张图片放在两个不同的 Image Views 中，Glide 将存储同一张图片的两个不同副本。这将增加磁盘缓存大小，但会提高处理速度。
• 缩略图支持：使用 Glide，我们可以同时将多个图像加载到同一个视图中，即我们可以将缩略图添加到我们的图像视图中。
• 定制： Glide 最好的地方在于，它提供了各种配置和定制选项。因此，您可以根据需要更改 Glide 库。

在 Android 中使用 Glide

在这篇博尔格的他的部分中，我们将研究使用 Kotlin 在 Android 中实现 Glide。要在您的 Android 应用程序中使用 Glide 库，首先，将 Glide 库依赖项添加到您的app/build.gradle文件中：

dependencies {
    ...
   //glide library
    implementation 'com.github.bumptech.glide:glide:4.9.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.9.0'
    ... 
}

现在添加上述依赖项后，同步您的项目。这会将 Glide 库添加到您的项目中。之后，在AndroidManifest.xml中添加互联网权限。这是必需的，因为我们需要互联网来下载图像：

<uses-permission android:name="android.permission.INTERNET"/>
现在，您已完成所有依赖项和权限。是时候为 Glide 库编写代码了。在glide_example.xml 中编写以下代码来添加一个 LinearLayout。我们将使用此 Linearlayout 来显示下载的图像：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
</LinearLayout>
到目前为止，我们已经完成了 UI 部分。现在在 GlideExample.kt 文件中，添加以下行：

class GlideExample : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.glide_example)
        val linearLayout = findViewById<LinearLayout>(R.id.linearLayout)
        val imageView = ImageView(this)
        Glide.with(this).load("https://moodle.htwchur.ch/pluginfile.php/124614/mod_page/content/4/example.jpg").into(imageView)
        linearLayout.addView(imageView)
    }
}

让我们理解上面的代码。在上面的代码中，我们创建了一个 LinearLayout 的实例来显示下载的图像。为了简单的将图片加载到LinearLayout，我们调用Glide类的with()方法并传递上下文，然后调用load()方法，其中包含要下载的图片的URL，最后调用into()在我们的ImageView上显示下载图像的方法。

更多功能

• 调整图像大小：您可以使用将获取图像最终尺寸的override()方法调整图像大小。

Glide.with(this)
        .load("https://moodle.htwchur.ch/pluginfile.php/124614/mod_page/content/4/example.jpg")
        .override(300, 200)
        .into(resizeImage);

• 添加占位符和错误消息：为图像添加占位符始终是一个不错的选择，因为可能会出现互联网速度较慢的情况，在这种情况下，您的图像将不会在几秒钟内加载。因此，为了处理这些情况，我们使用了一些占位符，这些占位符将在您的原始图像加载之前一直显示。此外，如果在图像获取过程中出现一些错误，那么用户应该知道发生了一些错误。该错误可能是由于错误的 URL 或由于没有 Internet 连接而出现的。要设置占位符和错误，请使用以下命令：

Glide.with(this)
        .load("https://moodle.htwchur.ch/pluginfile.php/124614/mod_page/content/4/example.jpg")
        .placeholder(R.drawable.placeholder) //placeholder
        .error(R.drawable.error) //error
        .into(placeholdeImage);

• 裁剪图像：您可以使用centerCrop()方法裁剪图像：

Glide.with(CropGlide.this)
        .load("https://moodle.htwchur.ch/pluginfile.php/124614/mod_page/content/4/example.jpg")
        .centerCrop()
        .into(cropImage);

• 添加进度条：在加载图像之前添加进度条始终是一个不错的选择。因此，要在下载图像时添加进度条，我们使用与错误设置相同的方法：

progressBar.setVisibility(View.VISIBLE);

Glide.with(this)
        .load("https://moodle.htwchur.ch/pluginfile.php/124614/mod_page/content/4/example.jpg")
        .listener(new RequestListener<Drawable>() {
            @Override
            public boolean onLoadFailed(Exception e, Object model, Target<Drawable> target, boolean isFirstResource) {
                progressBar.setVisibility(View.GONE);
                return false; // important to return false so the error placeholder can be placed
            }

            @Override
            public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                progressBar.setVisibility(View.GONE);
                return false;
            }
        })
        .into(imageView);

您可以在 Glide 库中使用许多其他方法，其中一些是 fitCenter()、centerCrop() 等。您可以在此处找到它们。

结论

在这篇文章中，我们看到了如何使用 Glide 库下载并在 ImageView 中显示图像。图像是从互联网加载的，我们已授予应用程序连接互联网的访问权限。所有加载和处理图像的复杂工作都由 Glide 库完成。所以，不费吹灰之力，我们就学会了如何在我们的 Andoird 项目中处理图像，我很确定你会探索 Glide 库的更多方法。