快捷導(dǎo)航

Android圖片加載庫(kù)Glide用法

更新時(shí)間：2021年12月13日 11:25:17 作者：fdqy

大家好，本篇文章主要講的Android圖片加載庫(kù)Glide用法，感興趣的同學(xué)趕快來(lái)看一看吧，對(duì)你有幫助的話(huà)記得收藏一下，方便下次瀏覽

Glide介紹

Glide是一個(gè)快速高效的Android圖片加載庫(kù)，注重于平滑的滾動(dòng)。Glide提供了易用的API，高性能、可擴(kuò)展的圖片解碼管道，以及自動(dòng)的資源池技術(shù)。Glide 的主要目標(biāo)是讓任何形式的圖片列表的滾動(dòng)盡可能地變得更快、更平滑。

Android SDK 要求

Min Sdk Version - 使用 Glide 需要 min SDK 版本 API 14 (Ice Cream Sandwich) 或更高。

Compile Sdk Version - Glide 必須使用 API 27 (Oreo MR1) 或更高版本的 SDK 來(lái)編譯。

Support Library Version - Glide 使用的支持庫(kù)版本為 27。

使用前的準(zhǔn)備

下載

Jar

你可以直接在 GitHub 下載最新的 jar 包。并且還需要包含 Android v4支持庫(kù) 的 jar 包。

Gradle

在build.gradle中加入如下依賴(lài)

implementation 'com.github.bumptech.glide:glide:4.12.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.12.0'

Maven

如果使用 Maven，同樣可以添加對(duì) Glide 的依賴(lài)。再次強(qiáng)調(diào)，你依舊需要添加 Android 支持庫(kù)的依賴(lài)

<dependency>
  <groupId>com.github.bumptech.glide</groupId>
  <artifactId>glide</artifactId>
  <version>4.11.0</version>
  <type>aar</type>
</dependency>
<dependency>
  <groupId>com.google.android</groupId>
  <artifactId>support-v4</artifactId>
  <version>r7</version>
</dependency>
<dependency>
  <groupId>com.github.bumptech.glide</groupId>
  <artifactId>compiler</artifactId>
  <version>4.11.0</version>
  <optional>true</optional>
</dependency>

設(shè)置

從網(wǎng)絡(luò)中加載圖片

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

從本地存儲(chǔ)中加載圖片

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

基本用法

Glide.with(fragment)//傳遞activity或fragment
    .load(url)//本地地址或網(wǎng)絡(luò)地址
    .into(imageView);//ImageView對(duì)象

這樣就可以將圖片加載到指定的ImageView中

在 ListView 和 RecyclerView 中的使用

在 ListView 或 RecyclerView 中加載圖片的代碼和在單獨(dú)的 View 中加載完全一樣

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
    String url = urls.get(position);
    Glide.with(fragment)
        .load(url)
        .into(holder.imageView);
}

占位符

Glide有三種占位符，請(qǐng)求正在執(zhí)行時(shí)展示placeholder Drawable，請(qǐng)求失敗則展示error Drawable，請(qǐng)求的url為null，那么會(huì)展示fallback url

Glide.with(activity)
    .load(url)
    .placeholder(R.drawable.loading)//請(qǐng)求圖片時(shí)展示的圖片
    .error(R.drawable.error)//請(qǐng)求失敗時(shí)展示的圖片
    .fallback(R.drawable.fallback)//請(qǐng)求的圖片地址(url)為空時(shí)展示的圖片
    .into(imageView);

選項(xiàng)

RequestOptions requestOptions = new RequestOptions()
                .placeholder(R.drawable.loading)
                .error(R.drawable.error);

Glide.with(fragment)
    .load(url)
    .apply(requestOptions)
    .into(imageView);

apply()方法可以被調(diào)用多次，因此RequestOption可以被組合使用。如果 RequestOptions對(duì)象之間存在相互沖突的設(shè)置，那么只有最后一個(gè)被應(yīng)用的RequestOptions會(huì)生效。

過(guò)渡動(dòng)畫(huà)

在 Glide 中，Transitions 允許你定義 Glide 如何從占位符到新加載的圖片，或從縮略圖到全尺寸圖像過(guò)渡。Transition 在單一請(qǐng)求的上下文中工作，而不會(huì)跨多個(gè)請(qǐng)求。因此，Transitions 并不能讓你定義從一個(gè)請(qǐng)求到另一個(gè)請(qǐng)求的動(dòng)畫(huà)（比如，交叉淡入效果）

DrawableCrossFadeFactory factory =
        new DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build();

GlideApp.with(context)
    .load(url)
    .apply(requestOptions)
    .transition(withCrossFade(factory))
    .placeholder(R.color.placeholder)
    .into(imageView);

除了交叉淡入效果，你也可以自定義

變換效果

當(dāng)url地址為png時(shí)可能無(wú)法變換

RequestOptions requestOptions = new RequestOptions()
                .placeholder(R.drawable.loading)
                .error(R.drawable.error);

Glide.with(MainActivity.this)
    .load(url)
    .apply(requestOptions)
    .transform(new CircleCrop())//圓角圖片
//  .transform(new RoundedCorners(30))//圓形圖片角度統(tǒng)一
//  .transform(new GranularRoundedCorners(30, 50, 70, 80))//四個(gè)角單獨(dú)指定角度
//  .transform(new Rotate(90))//順時(shí)針旋轉(zhuǎn)角度    
    .into(imageView);

圓角變換效果

在這里插入圖片描述

順時(shí)針旋轉(zhuǎn)效果

在這里插入圖片描述

使用示例

loading, error是提前下載到本地的圖片，放在drawable中；url可以是一個(gè)網(wǎng)絡(luò)圖片的地址

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        String url = "url of picture";
      	ImageView imageView = findViewById(R.id.image_view);
        Glide.with(this)
                .load(url)
                .placeholder(R.drawable.loading)
                .error(R.drawable.error)
                .into(imageView);
    }
}

布局文件

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/image_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

權(quán)限設(shè)置如下

   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

下圖是加載網(wǎng)絡(luò)地址的情況。左圖傳入了錯(cuò)誤的網(wǎng)絡(luò)地址，那么就會(huì)展示error圖；如果傳入的網(wǎng)絡(luò)圖片地址正確，那么就會(huì)將正確的圖片放入ImageView中；而在圖片加載未完成時(shí)，該ImageView會(huì)展示出loading圖

在這里插入圖片描述