Android glide framework and the design patterns involved in the framework

Original link

A simple introduction to the use of Android glide framework

Glide: A fast and efficient Android image loading library that can automatically load images from the network, local files, and app resources, focusing on smooth scrolling.

Basic use of Glide
Open source address: https://github.com/bumptech/glide
Chinese documentation: https://muyangmin.github.io/glide-docs-cn/

Glide is introduced in the module's build.gradle:

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

Glide frame overall structural design

Original link

1. The Glide framework is mainly divided into two major processes:
   1.1 Image request construction process.
   1.2 Image cache acquisition process.

2. The picture request construction process is divided into four modules:
   2.1 User mode request module: When the user uses Glide to make chain calls, a user mode Request will be generated.
   2.2 Real request module: Since various Requests will be constructed according to the scene in step 2.1, it is necessary to close the picture request when initiating, so a real GenericRequest request will be constructed using a user-mode Request.
   2.3 Request life cycle management module: A major feature of Glide is that it binds image requests to the page life cycle to avoid the risk of memory leaks, so there will be a Request life cycle management module.
   2.4 Registry center module: Since Glide supports loading multiple types of data, information about the supported types of processing classes will be pre-registered in the registry.

3. The image cache is divided into 3 major layers and 5 small layers:
   3.1 Memory cache (2 small layers): weak reference cache, LruCache.
   3.2 Local cache (2 small layers): local ResultCache cache, local SourceCache cache.
   3.3 Source data source (1 small layer): network acquisition, local AssetPath acquisition, other local pictures.

Five layers of cache are defined.
The first layer: memory cache -> weak application cache (ActiveResource).
Second layer: Memory cache -> LruCache
Third layer: Disk cache -> ResultCache (transformed graph)
Fourth layer: Disk cache -> SourceCache (data pulled directly from DataFetcher)
Fifth layer: Data source - > Source
Advantages of the Glide framework
Diversified loading types: Glide supports images in Gif, WebP, Jpeg, Png and other formats.
Life cycle binding: Image requests are bound to the page life cycle to avoid memory leaks.
It is simple to use (chain call) and provides rich API functions (such as image cropping, etc.).
Efficient caching strategy:

Advantages of Glide Framework

1. Supports multiple caching strategies (Memory and Disk image caching).
2. Load the image size of the corresponding size according to the size of the ImageView.
3. The memory overhead is small and the RGB_565 format is used by default (version 3.x).
4. Reuse objects (flyweight mode) to reduce memory jitter.
5. The memory cache and disk cache are managed through the Lru algorithm to ensure the controllability of resource usage.

Basic usage:

Glide.with(this)
.load(strUrl)
.into(mShow_img);

1. Which environment variable object is the parameter in Glide.with indicates which environment variable life cycle it will be bound to.
   The use of Glide greatly reduces the possibility of OOM caused by pictures.
2. The url can be an image resource id of R.**, or https.*, or a file object.
   If it is https, you need to apply for network permission in AndroidManifest.xml; if it is a file object, you need to apply for it in AndroidManifest. Apply for memory card read and write permissions in xml.
3. The into method passes the image to the specified ImageView

Glide placeholder

How to use placeholder images in Glide4, including (placeholder, error, fallback) three kinds of placeholder images:

• placeholder: the image displayed when requesting an image
• error: the image displayed if the request fails (if not set, the placeholder of the placeholder will still be displayed)
• fallback: The image displayed when the requested url/model is null (if not set, the placeholder of the placeholder is still displayed)

RequestOptions requestOptions = new RequestOptions()
    .placeholder(R.drawable.hold)
    .error(R.drawable.error)
    .fallback(R.drawable.fallback)
    .override(100, 100);  //override指定加载图片大小，可不设置

Glide.with([fragment/Context/View])
    .load(url)
    .apply(requestOptions)
    .into(imageView);

Design patterns involved in the Android glide framework

1. Builder mode: Glide uses the Builder mode to build image loading requests. Set the loading parameters and configuration by calling a series of methods in a chain, and finally call the into() method to perform the loading operation.

Glide.with(context)
     .load(imageUrl)
     .placeholder(R.drawable.placeholder)
     .centerCrop()
     .into(imageView);

2. Singleton (singleton) mode: Glide's core components Glide, RequestManager and RequestBuilder all use a singleton mode to ensure that there is only one instance in the entire application.

Glide glide = Glide.get(context);
RequestManager requestManager = Glide.with(fragment);

3. Proxy mode: Glide uses the proxy mode to implement the image loading process. By using RequestManager as an intermediary, Glide's loading logic is encapsulated and a series of methods are provided to manage loading requests.

RequestManager requestManager = Glide.with(context);
requestManager.load(imageUrl)
             .placeholder(R.drawable.placeholder)
             .into(imageView);

4. Strategy mode: Transformation and Decoder in Glide use the strategy mode. Transformation defines a series of image transformation strategies, such as rounded corners, scaling, etc.; Decoder defines a series of image decoding strategies, such as Bitmap, Gif, etc.

RequestOptions requestOptions = new RequestOptions()
       .transform(new RoundedCorners(16))
       .override(300, 300);

Glide.with(context)
     .load(imageUrl)
     .apply(requestOptions)
     .into(imageView);

5. Observer pattern: Lifecycle management in Glide uses the observer pattern. By listening to the life cycle callbacks of Fragment or Activity, clean up and cancel image loading requests in a timely manner to avoid memory leaks and invalid requests.

@Override
public void onStart() {
    
    
    super.onStart();
    Glide.with(this).onStart();
}

@Override
public void onStop() {
    
    
    super.onStop();
    Glide.with(this).onStop();
}