Share
Ce veți creaGlide este o populară open-source bibliotecă Android pentru încărcarea imaginilor, videoclipurilor și animațiilor GIF. Cu Glide, puteți încărca și afișa medii din mai multe surse, cum ar fi serverele la distanță sau sistemul de fișiere local.
În mod implicit, Glide utilizează o implementare personalizată a HttpURLConnection pentru a încărca imagini pe Internet. Cu toate acestea, Glide oferă și pluginuri altor biblioteci populare de rețea, cum ar fi Volley sau OkHttp.
Dezvoltarea propriei funcții de încărcare și afișare a conținutului în Java poate fi o adevărată durere: trebuie să aveți grijă de caching, decodare, gestionarea conexiunilor de rețea, filetarea, tratarea excepțiilor și multe altele. Glide este o bibliotecă ușor de utilizat, bine planificată, bine documentată și bine testată, care vă poate economisi o mulțime de timp prețios - și vă poate salva unele dureri de cap.
În acest tutorial, vom afla despre Glide 3 prin construirea unei aplicații simple pentru galeria de imagini. Acesta va încărca imaginile prin Internet și le va afișa ca miniaturi într-un RecyclerView, iar atunci când un utilizator face clic pe orice imagine, va deschide o activitate detaliată care conține imaginea mai mare.
Încingeți-vă studioul Android și creați un nou proiect cu o activitate goală numită Activitate principala.
După ce ați creat un nou proiect, specificați următoarele dependențe în build.gradle.
repositore mavenCentral () // jcenter () funcționează și pentru că trage de la dependențele Maven Central // Glide compile 'com.github.bumptech.glide: glide: 3.7.0' // Recyclerview compile 'com.android. suport: reciclerview-v7: 25.1.1 '
Sau cu Maven:
com.github.bumptech.glide alunecare 3.7.0 com.google.android suport-v4 r7
Asigurați-vă că vă sincronizați proiectul după adăugarea dependenței Glide.
Dacă doriți să utilizați o bibliotecă de rețea, cum ar fi OkHttp sau Volley, în proiectul dvs. pentru operațiuni de rețea, este recomandat să includeți integrarea Glide specifică pentru biblioteca pe care o utilizați (în locul celei implicite care leagă HttpURLConnection).
dependență compile 'com.github.bumptech.glide: glide: 3.7.0' compilați 'com.github.bumptech.glide: integrarea volley: 1.4.0@aar' compile 'com.mcxiaoke.volley: library: 1.0. 8 '
dependente // okhttp 3 compile 'com.github.bumptech.glide: okhttp3-integration: 1.4.0@aar' compile 'com.squareup.okhttp3: okhttp: 3.2.0' // okhttp 2 compile 'com.github. bumptech.glide: okhttp-integrare: 1.4.0@aar 'compile' com.squareup.okhttp: okhttp: 2.2.0 '
Puteți să vizitați ghidul oficial al bibliotecilor de integrare Glide pentru mai multe informații.
Deoarece Glide va efectua o solicitare de rețea pentru încărcarea imaginilor prin internet, trebuie să includeți permisiunea INTERNET în a noastră AndroidManifest.xml.
Vom începe prin crearea noastră RecyclerView.
Apoi, să creăm aspectul XML care va fi utilizat pentru fiecare element (ImageView) în cadrul RecyclerView.
Acum, când am creat structura, următorul pas este să creați RecyclerView adaptor pentru stocarea datelor. Înainte de a face acest lucru, totuși, să creăm modelul nostru simplu de date.
Vom defini un model de date simplu pentru noi RecyclerView. Acest model implementează Parcelabil pentru transportul de înaltă performanță a datelor de la o componentă la alta. În cazul nostru, datele vor fi transportate de la SpaceGalleryActivity la SpacePhotoActivity.
import android.os.Parcel; import android.os.Parcelable; clasa publică SpacePhoto implementează Parcelabil private String mUrl; String private mTitle; public SpacePhoto (url String, titlu String) mUrl = url; mTitle = titlu; protejate SpacePhoto (parcelă în) mUrl = in.readString (); mTitle = in.readString (); public static final CreatorCREATOR = nou Creator () @Override public SpacePhoto createFromParcel (Parcel in) retur noi SpacePhoto (in); @Override publică SpacePhoto [] newArray (dimensiunea int) returnează spațiul nou SpacePhoto [size]; ; public String getUrl () retur mUrl; public void setUrl (String url) mUrl = url; public String getTitle () return mTitle; public void setTitle (Titlu șir) mTitle = title; static public SpacePhoto [] getSpacePhotos () retur nou SpacePhoto [] nou SpacePhoto ("http://i.imgur.com/zuG2bGQ.jpg", "Galaxy"), noul SpacePhoto ("http: // i. imgur.com/ovr0NAF.jpg "," Space Shuttle "), noul SpacePhoto (" http://i.imgur.com/n6RfJX2.jpg "," Galaxy Orion "), noul SpacePhoto (" http: // i. imgur.com/qpr5LR2.jpg "," Earth "), noul SpacePhoto (" http://i.imgur.com/pSHXfu5.jpg "," Astronaut "), noul SpacePhoto (" http: //i.imgur. com / 3wQcZeY.jpg "," Satelit "),; @Overide public int descrieContents () return 0; @Override public void writeToParcel (parcelă parcelă, int i) parcel.writeString (mUrl); parcel.writeString (mTitle);
Vom crea un adaptor pentru a popula RecyclerView cu date. Vom implementa, de asemenea, un ascultător de clicuri pentru a deschide activitatea detaliată-SpacePhotoActivity-trecând o instanță de SpacePhoto ca un extra. Activitatea detaliată va afișa o imagine de fundal a imaginii. O vom crea într-o secțiune ulterioară.
clasa publica MainActivity extinde AppCompatActivity // ... clasa privata ImageGalleryAdapter extinde RecyclerView.Adapter@Override public ImageGalleryAdapter.MyViewHolder onCreateViewHolder (parentă ViewGroup, int viewType) Context context = parent.getContext (); LayoutInflater inflater = LayoutInflater.from (context); Vedeți photoView = inflater.inflate (R.layout.item_photo, parent, false); ImageGalleryAdapter.MyViewHolder viewHolder = noul ImageGalleryAdapter.MyViewHolder (photoView); retur ViewHolder; @Override public void onBindViewHolder (titlul ImageGalleryAdapter.MyViewHolder, poziția int) SpacePhoto spacePhoto = mSpacePhotos [position]; ImageView imageView = holder.mPhotoImageView; @Overire publică int getItemCount () return (mSpacePhotos.length); clasa publică MyViewHolder extinde RecyclerView.ViewHolder implementează View.OnClickListener public ImageView mPhotoImageView; public MyViewHolder (vezi itemView) super (itemView); mPhotoImageView = (ImagineView) itemView.findViewById (R.id.iv_photo); itemView.setOnClickListener (aceasta); @Override public void onClick (vizualizare Vizualizare) int position = getAdapterPosition (); dacă (poziția! = RecyclerView.NO_POSITION) SpacePhoto spacePhoto = mSpacePhotos [poziție]; Intenția intenției = intenția nouă (mContext, SpacePhotoActivity.class); intent.putExtra (SpacePhotoActivity.EXTRA_SPACE_PHOTO, spacePhoto); startActivity (intenție); privat SpacePhoto [] mSpacePhotos; Context privat mContext; public ImageGalleryAdapter (Contextul contextului, SpacePhoto [] spacePhotos) mContext = context; mSpacePhotos = spațiuFotografii;
Aici avem nevoie de Glide pentru a-și face treaba - pentru a prelua imagini de pe internet și a le afișa în individ ImageViews, folosind RecyclerView onBindViewHolder () deoarece utilizatorul derulează aplicația.
// ... @Overide public void onBindViewHolder (suport MyViewHolder, pozitie int) Photo photo = mPhotoList.get (pozitie); ImageView imageView = holder.mPhotoImageView; Glide.with (mContext) .load (spacePhoto.getUrl ()) .locatorul (R.drawable.ic_cloud_off_red) .into (imageView); // ...
Pas cu pas, iată ce fac apelurile la Glide:
Accentsconagua
cu (context context): începem procesul de încărcare prin trecerea mai întâi a contextului nostru în cu() metodă. încărcare (șir de caractere): sursa imaginii este specificată fie ca o cale de director, fie ca URI sau ca URL.placeholder (int resourceId): un ID de resursă de aplicație locală, de preferință un traseu, care va fi un substituent până când imaginea este încărcată și afișată.în (ImageView imageView): afișarea imaginii țintă în care va fi plasată imaginea.Rețineți că Glide poate încărca și imagini locale. Trebuie doar să treci fie ID-ul resursei Android, calea fișierului, fie un URI ca argument pentru sarcină() metodă.
Puteți redimensiona imaginea înainte de a fi afișată în ImageView cu Glide's .suprascriere (lățime int, int înălțime) metodă. Acest lucru este util pentru crearea de miniaturi în aplicația dvs. atunci când încărcați o altă dimensiune a imaginii de la server. Rețineți că dimensiunile sunt în pixeli, nu dp.
Următoarele transformări de imagini sunt de asemenea disponibile:
fitCenter (): salvează imaginea uniform (menținând raportul de aspect al imaginii) astfel încât imaginea să se potrivească în zona dată. Întreaga imagine va fi vizibilă, dar ar putea să existe vopsea verticală sau orizontală.centerCrop (): salvează imaginea uniform (menținând raportul de aspect al imaginii), astfel încât imaginea să umple suprafața dată, cu cât mai multă imagine arătată posibil. Dacă este necesar, imaginea va fi tăiată orizontal sau vertical pentru a se potrivi.Aici ne creăm RecyclerView cu GridLayoutManager ca manager de layout, inițializați adaptorul nostru și legați-l de acesta RecyclerView.
// ... @Override protejat void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); setContentView (R.layout.activity_main); RecyclerView.LayoutManager layoutManager = noul GridLayoutManager (acest lucru, 2); RecyclerView reciclerView = (RecyclerView) findViewById (R.id.rv_images); recyclerView.setHasFixedSize (true); recyclerView.setLayoutManager (layoutManager); Adaptorul ImageGalleryAdapter = noul ImageGalleryAdapter (acest lucru, SpacePhoto.getSpacePhotos ()); recyclerView.setAdapter (adaptor); // ...
Creați o nouă activitate și denumiți-o SpacePhotoActivity. Noi primim SpacePhoto extra și încărcați imaginea cu Glide ca și înainte. Aici așteptăm ca fișierul sau adresa URL să fie a Bitmap, așa că vom folosi asBitmap () pentru a face ca Glide să primească a Bitmap. În caz contrar, sarcina va eșua și .eroare() inversarea apelului va fi declanșată, determinând resursa trasă returnată din apelul de eroare care va fi afișat.
Ați putea, de asemenea, să utilizați asGif () dacă doriți să vă asigurați că imaginea încărcată dvs. a fost un GIF. (Voi explica cum funcționează GIF-urile în Glide în curând.)
import șiroid.graphics.Bitmap; import șiroid.graphics.Color; import android.os.Bundle; import șiroid.support.v7.app.AppCompatActivity; import android.support.v7.graphics.Palette; import șiroid.view.ViewGroup; importă android.widget.ImageView; import com.bumptech.glide.Glide; import com.bumptech.glide.request.RequestListener; import com.bumptech.glide.request.target.Target; clasa publică SpacePhotoActivity extinde AppCompatActivity String public static final EXTRA_SPACE_PHOTO = "SpacePhotoActivity.SPACE_PHOTO"; privat ImageView mImageView; @Override protejate void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); setContentView (R.layout.activity_photo_detail); mImageView = (ImagineView) findViewById (R.id.image); SpacePhoto spacePhoto = getIntent () getParcelableExtra (EXTRA_SPACE_PHOTO); Glide.with (acest) .load (spacePhoto.getUrl ()) .asBitmap () .error (R.drawable.ic_cloud_off_red) .diskCacheStrategy (DiskCacheStrategy.SOURCE) .into (mImageView);
Rețineți că am inițializat, de asemenea, o memorie cache unică pentru imaginile încărcate: DiskCacheStrategy.SOURCE. Voi explica mai multe despre cache într-o secțiune ulterioară.
Iată un aspect pentru afișarea activității detaliate. Pur și simplu afișează un scrollable ImageView care va afișa versiunea cu rezoluție completă a imaginii încărcate.
Dacă urmăriți îndeaproape, veți vedea că atunci când revizuiți o imagine încărcată anterior, aceasta se încarcă chiar mai repede decât înainte. Ce a făcut mai repede? Sistemul de caching al lui Glide, asta este.
După ce o imagine a fost încărcată o dată de pe Internet, Glide o va memora în memorie și pe disc, salvând solicitări de rețea repetate și permițând recuperarea mai rapidă a imaginii. Deci, Glide va verifica mai întâi dacă o imagine este disponibilă în memorie sau pe disc înainte de ao încărca din rețea.
În funcție de aplicația dvs., poate doriți să evitați cache-de exemplu, în cazul în care imaginile afișate sunt susceptibile de a schimba frecvent și să nu fie reîncărcate.
Puteți evita cache-ul de memorie apelând .skipMemoryCache (true). Dar fiți conștienți de faptul că imaginea va fi încă stocată în cache pe disc - pentru a împiedica acest lucru, de asemenea, utilizați .discCacheStrategy (strategia DiskCacheStrategy) , care ia una din următoarele valori enum:
DiskCacheStrategy.NONE: nu se salvează date în memoria cache.DiskCacheStrategy.SOURCE: datele originale au fost salvate în memoria cache.DiskCacheStrategy.RESULT: salvează rezultatul datelor după transformări în memoria cache.DiskCacheStrategy.ALL: stochează atât datele originale, cât și datele transformate. Pentru a evita atât cache-ul, cât și memoria cache-ului, trebuie să apelați ambele metode una după alta:
Glide.with (acest) .load (spacePhoto.getUrl ()) .asBitmap () .skipMemoryCache (adevărat) .diskCacheStrategy (DiskCacheStrategy.NONE) .into (imageView);
În Glide, puteți implementa a RequestListener pentru a monitoriza starea solicitării pe care ați efectuat-o în timpul încărcării imaginii. Se va numi doar una dintre aceste metode.
onException (): declanșat de fiecare dată când apare o excepție, astfel încât să puteți gestiona excepțiile în această metodă.onResourceReady (): declanșat când imaginea este încărcată cu succes. Dacă ne întoarcem la aplicația din galeria noastră de imagini, să modificăm afișajul puțin, utilizând a RequestListener obiect care va seta bitmap la ImageView și schimbați și culoarea de fundal a aspectului extragând culoarea întunecată și vibrată a imaginii noastre utilizând API-ul Paletă Android.
