(Tutorial Android) Image Loader Using Glide


Glide merupakan salah satu image loader yang banyak digunakan untuk development aplikasi android. Jika sebelumnya aku sudah membahas wacana Picasso https://andronut.blogspot.com//search?q=tutorial-android-image-loader-using. Sekarang mari kita berkenalan dengan Image Loader yang satu ini.

Glide sama halnya dengan Picasso, yakni sanggup memuat image dari banyak sekali source dengan pengaturan cache dan low memori dalam memanipulasi image. Image loader ini dikembangkan dan diperkenalkan oleh google pada event Google I/O 2015).


Beberapa fitur yang ada di Glide versi 3.x :
-Animated GIF decoding
-Local video stills
-Thumbnail support
-Lifecycle integration
-Transcoding
-Animations
-OkHttp and Volley Support

Oke kita pribadi ke TKP.

The first, siapkan sampel image url dulu gan. Disini aku pake foto dedek jkt48 lucu ini..… :3






Chouzetsu kawaiii.. yupi... 


Oke, keep focus !

Tambahkan dependenciesnya di gradle terlebih dahulu, disini aku memakai Glide versi 3.7.0. Untuk melihat versi terakhir sanggup dilihat di https://github.com/bumptech/glide/releases

// Glide compile 'com.github.bumptech.glide:glide:3.7.0' compile 'com.android.support:support-v4:23.3.0' 

Library support v4 disini harus diadaptasi dengan buildToolsVersion kita.
Di top level gradle tambahkan repository maven.
repositories {     ...     mavenCentral() } 

Kemudian kita buat layout dengan tiga buah imageView di dalamnya. Masing-masing diberi nama imgLocal, imgUrl dan imgGif.
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:paddingBottom="@dimen/activity_vertical_margin"     android:paddingLeft="@dimen/activity_horizontal_margin"     android:paddingRight="@dimen/activity_horizontal_margin"     android:paddingTop="@dimen/activity_vertical_margin"     tools:context="com.example.wim.android_glide.MainActivity">      <ScrollView         android:layout_width="match_parent"         android:layout_height="wrap_content">          <LinearLayout             android:layout_width="match_parent"             android:layout_height="match_parent"             android:orientation="vertical">              <ImageView                 android:id="@+id/imgLocal"                 android:layout_width="match_parent"                 android:layout_height="200dp"/>              <ImageView                 android:id="@+id/imgUrl"                 android:layout_width="match_parent"                 android:layout_height="200dp"/>              <ImageView                 android:id="@+id/imgGif"                 android:layout_width="match_parent"                 android:layout_height="200dp" />         </LinearLayout>     </ScrollView>  </RelativeLayout>  

Nah, sehabis itu kita implementasikan Glide.

- Untuk simple image loader dari url maupun lokal cukup dengan memanggil code satu baris saja menyerupai berikut :
Glide.with(this).load(“source”).into(imgLocal); 

- Kita juga sanggup melaksanakan resizing, cropping dan animasi menyerupai berikut :
Glide.with(this)         .load(url)         .centerCrop()         .override(800,600)         .placeholder(R.drawable.placeholder)         .crossFade()         .into(imgUrl); 

- Selain itu juga sanggup menampilkan image GIF dengan method asGif() menyerupai berikut :
Glide.with(this)         .load(R.drawable.gif_luvchu)         .asGif()         .crossFade()         .into(imgGif); 

Berikut source code lengkapnya di MainActivity.
package com.example.wim.android_glide;  import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.widget.ImageView;  import com.bumptech.glide.Glide;  public class MainActivity extends AppCompatActivity {      private ImageView imgLocal, imgUrl, imgGif;      private String url = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguSNvzxM9E9QmVQPFGB_riHnT2Q9Ycy8RgRHXEvbTUZ3vUYExyesbAssFA0wU7eV7DFKVE6Te39Q_Oq5f34AW1Kk5yAwwRSVUrvyWR2clvjKr5X8sXBLzmK_LtVGFJByeV0_JK3CQ-s0M/s1600/Civ_gxGU4AAyPKK.jpg";      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);          imgLocal = (ImageView) findViewById(R.id.imgLocal);         imgUrl = (ImageView) findViewById(R.id.imgUrl);         imgGif = (ImageView) findViewById(R.id.imgGif);          // Load from local         Glide.with(this).load(R.drawable.yupi_luvchu).into(imgLocal);          // Load from url         Glide.with(this)                 .load(url)                 // cropping                 .centerCrop()                 //resize                 .override(800,600)                 .placeholder(R.drawable.placeholder)                 //animation                 .crossFade()                 .into(imgUrl);          // Load GIF         Glide.with(this)                 .load(R.drawable.gif_luvchu)                 .asGif()                 .crossFade()                 .into(imgGif);      }  } 

Terakhir jangan lupa permission internet.
<uses-permission android:name="android.permission.INTERNET"/> 

Build dan jalankan maka balasannya sebagai berikut :



Source code lengkap sanggup dilihat di https://github.com/andronut/Android-Glide

Sekian dan biar bermanfaat
Happy Coding :)

Comments

Popular posts from this blog

Tugas Komplemen Terakhir

Transmisi Data

Konsep Oop Encapsulation