(/)

(https://play.google.com/store/apps/details?id=idig.za.net.addiction)

Android app gratuite couvrant tous les aspects de la dpendance, y compris la prvention et le traitement
Tu es l: Accueil (/) / Tutoriels (/index.php/articles.html) / Des articles (/index.php/itemlist/category/8-articles.html) / Android RecyclerView et Picasso tutoriel

Tweet Consulteznotrepagegoogle+ Like Send Share Partager

(https://plus.google.com/+101appsCoZa/?prsrc=3)

Android RecyclerView et Picasso tutoriel

crit par Clive

We Test Robots On Our

Download Metatrader 4 Accounts & We Share The
Results With You = Free!

Quel partenariat! Picasso et RecyclerView

Si vous achez des images dans des listes ou des grilles, vous devriez envisager d'utiliser Picasso et RecyclerView.

Picasso est un package de bibliothque image de tlchargement et la mise en cache puissante que vous incluez dans votre application build. Il
simplie le travail avec des images, ce qui rduit le code que vous devez utiliser pour une ligne de code.

Picasso est rapide et facile utiliser et il est GRATUIT!

Le widget RecyclerView est essentiellement un conteneur que vous pouvez utiliser pour acher de grands ensembles de donnes. Il est trs
ecace car il ache uniquement quelques lments la fois. Les vues qui ne sont plus ncessaires sont recycls et rutiliss.

Ne pas avoir garder sur les vues de gonage permet d'conomiser les ressources du processeur et de la mmoire prcieuse est sauv par ne pas
avoir garder une vue vivante en arrire-plan.

Combinez Picasso et RecyclerView et votre application se dplace la vitesse de la lumire!

Voici notre tutoriel

Notre application tutoriel vise les appareils utilisant l'API de niveau 10 et plus.

Nous utilisons la bibliothque Picasso pour tlcharger un certain nombre d'images. Et puis utiliser un RecyclerView pour acher les images dans une liste
droulante.
En cliquant sur une image ouvre une WebView o nous achons l'article tlcharg li l'image slectionne. Une progressbar indtermine est ach pendant le
chargement de la page Web.

Picasso prend soin de traiter les images tout en RecyclerView prend soin de les acher dans une liste. En cliquant sur une image ouvre une WebView pour acher
l'article

En cliquant sur une image dans la liste RecyclerView, ache l'article dans un WebView

Premires choses d'abord

Obtenir la permission
Vous aurez besoin d'inclure l'autorisation d'utiliser l'Internet dans votre chier AndroidManifest.xml.

Inclure la permission d'accder l'Internet dans votre chier AndroidManifest.xml

O est votre carte de bibliothque?

Vous devez galement inclure le:

Picasso bibliothque qui se chargera de tlcharger et de traiter nos images

AppCompat bibliothque de soutien parce que nous utilisons le thme AppCompat.Light
 RecyclerView bibliothque de support de sorte que nous pouvons utiliser le RecyclerView dans notre application qui cible les appareils fonctionnant API Level
10 et au-dessus

Vriez vos dpendances dans votre chier build.gradle:

Ouvrez votre chier build.gradle et inclure les dpendances requises

Vous devriez avoir ces dpendances:

Inclure les dpendances de la bibliothque dans le chier de construction gradle

Vous pouvez simplement taper dans les entres comme indiqu ci - dessus, puis appuyez sur la Synchroniser maintenant le lien ( en haut droite de la fentre
de l' diteur) pour couler le projet aprs que vous avez inclus les dpendances.

Il est une autre faon d'inclure les bibliothques: jeter un oeil la faon dont nous avons inclus la bibliothque OkHttp dans le tutoriel connexions cloud Android en
utilisant la bibliothque OkHttp (/index.php/articles/android-cloud-connections-using-the-okhttp-library.html)

Coup d'envoi avec l'activit principale

L'activit principale commence lorsque l'application dmarre.

Rglage tout en onCreate ()

Nous faisons tout notre prparation de l'activit onCreate () la mthode.

Voici le code:

Tout notre travail de prparation se fait en onCreate de l'activit principale () Mthode

Une explication rapide

Nous dnissons un clic sur coute, MyOnClickListener comme une classe interne dans l' activit MainActivity . Il implmente la classe View.OnClickListener. Nous
allons utiliser notre auditeur suivre lorsque l'utilisateur clique sur une image. Nous attachons de l'auditeur l'image lorsque nous crons le titulaire de la vue.

Ensuite , nous obtenons une rfrence notre RecyclerView que nous avons dni dans le activity_main.xml chier. Ensuite , nous avons mis de l'recyclerView
setHasFixedSize () la mthode pour vrai . Cela augmente les performances car la vue de recycleur savoir l' avance qu'il ne peut pas changer la taille de la vue
recycleur, mme si la taille des changements de l' adaptateur.

Nous voulons acher les images tlcharges dans une liste droulante verticale , de sorte que nous utilisons un LinearLayoutManager pour grer le
positionnement des lments de la liste ainsi que le recyclage des vues.

L'image et l' article Urls sont stocks dans un tableau de chanes deux dimensions, des articles dans la MyArticleData classe. La AnArticle classe a un constructeur
unique que nous utilisons pour crer un objet de l' article unique contenant l'image et l' article Urls. Appeler le getArticleData () mthode renvoie un ArrayList
contenant toutes les images et l' article Urls.

Enn, nous construisons une instance de notre adaptateur personnalis et le joindre notre RecyclerView.

Faites votre choix!

Faites votre choix!
En cliquant sur une image dclenche notre sur de clic auditeur onClick () mthode:

En cliquant sur une image commence une WebView o nous achons l'article slectionn

Une explication rapide

Ici , nous appelons getSelectedArticleUrl () pour obtenir l'URL de l'article li l'image slectionne:

Utilisez la position de l'image slectionne comme un indice pour obtenir l'URL de l'article

Une explication rapide

getChildPosition () retourne la position de l'image slectionne dans l'adaptateur. Nous l' utilisons comme l'indice de tableau pour obtenir Url de l'article
correspondant.

Nous passons ensuite cette URL sur le showSelectedArticle () mthode:

Get your Free

Start Download Software Here

Passer Url de l'article slectionn sur le WebView qui va tlcharger et acher l'article

Une explication rapide

Nous crons une intention, mettre Url de l'article en elle et ensuite appeler startActivity () pour dmarrer l'activit WebActivity qui tlcharge et ache l'article. Nous
discuterons plus tard.

Dnir le widget RecyclerView dans un chier de mise en page XML

Le widget RecyclerView est comme un ListView. Il ache une liste droulante des lments, qui dans ce cas, sont les images tlcharges.

Nous dnissons notre widget RecyclerView dans le chier de mise en page de l'activit principale, activity_main.xml :

Le RecyclerView ache les images tlcharges dans une liste droulante verticale

Notez que nous utilisons le widget RecyclerView de la bibliothque de support. Nous voulons que le RecyclerView pour remplir l'cran nous avons donc mis sa
largeur et la hauteur des attributs match_parent .

Tout se passe dans l'adaptateur

L'adaptateur permet d' accder nos donnes. Il fournit galement les points de vue pour les lments achs. Nous crons notre adaptateur recycleur
personnalis en dveloppant la RecyclerView.Adapter classe.

Il existe trois mthodes que vous devez mettre en uvre:

onCreateViewHolder () - cre une nouvelle ViewHolder contenant notre image

onBindViewHolder () - ache notre image la position spcie dans la liste
GetItemCount () - obtient le nombre d'lments dans l'adaptateur

Cration du ViewHolder
 onCreateViewHolder () cre un ViewHolder en gonant le ImageView dans le RecyclerView parent

Une explication rapide

onCreateViewHolder () est appele chaque fois que le RecyclerView a besoin d' un nouveau titulaire de vue pour acher une image. Ceci est appel d' abord
crer un certain nombre de supports vue qui sont ensuite recycls (donc onCreateViewHolder () ne sera pas appel nouveau).

Nous gonons notre row_layout contenant le ImageView dans la RecyclerView mre et retourner un nouvel objet MyViewHolder, titulaire .

Notre classe RecyclerView.ViewHolder

Notre classe ViewHolder personnalise contient une ImageView laquelle nous attachons un clic sur l'auditeur couter lorsque l'utilisateur clique sur une image.
Le ViewHolder contient galement des informations sur sa place dans le RecyclerView parent.

L'utilisation d'un ViewHolder acclre les choses que nous ne devons trouver le point de vue de l'image et attacher un auditeur chaque fois que nous avons
besoin d'acher une image. Nous rutilisons simplement le ViewHolder.

Notre ViewHolder contient un seul ImageView

Reliure du ViewHolder
onBindViewHolder () est appele par le RecyclerView pour acher une image une position spcie.

onBindViewHolder () est appele pour acher une image dans la liste des RecyclerView

Une explication rapide

Lorsque cette mthode est appele, elle reoit deux paramtres:

l'ViewHolder qui doit tre mis jour pour acher l'image donne
la position de l'lment (image) dans les donnes de l'ensemble de l'adaptateur

Nous obtenons l'URL de l'image que nous voulons acher en utilisant le paramtre de position (i) comme un indice la liste contenant tous les urls.

Ensuite, nous obtenons le contexte de l'ImageView puis appelons Picasso tlcharger, processus, cache et acher l'image.

Nous devons adopter Picasso trois paramtres:

le contexte de la ImageView
Uri pour l'image que nous voulons tlcharger
l'ImageView o nous voulons acher l'image

Picasso mettra en cache les images sur le premier de les tlcharger. Sur les tlchargements, il va d'abord vrier si l'image est dans le cache avant d'essayer de le
tlcharger.

La vue web
En cliquant sur une image dmarre le WebActivity et lui transmet l'Url de l'article que nous voulons tlcharger.

Voici le code contenu dans le onCreate () mthode:

 Les tlchargements de WebView et ache l'article slectionn

Une explication rapide

Nous crons une nouvelle WebView mais ne l'acher.

Appel setContentView () et faire passer la barre de progression de la mise en page en tant que paramtre, la barre de progression indique indtermins pendant
que l'article est tlcharg.

Ensuite , nous obtenons la chane Url de l'article qui a t adopte dans l'intention qui a commenc la WebActivity. Ensuite , nous appelons loadURL () pour charger
l'article dans le WebView.

Appel setWebViewClient () veillera ce que onPageFinished () sera appele quand l'article a ni de charger dans le WebView. Nous pouvons alors dnir le WebView
que le contenu ach, en remplacement de la barre de progression.

Vous pourriez tre intress regarder nos autres tutoriels Picasso:

Utilisation de la bibliothque Picasso pour charger des images dans un GridView (/index.php/articles/gridview-tutorial-using-the-picasso-library.html)
L'utilisation d'images sans tuer votre application (/index.php/articles/using-bitmaps-eciently.html)

Et voici une sur le RecyclerView, RecyclerView et Vignettes widgets d'Android (/index.php/articles/android-s-recyclerview-and-cardview-widgets.html)

J'esprequevousaveztrouvcetutorielutile.

CeprojetatcreenutilisantAndroidstudio(http://www.amazon.com/AndroidStudioHowguidetutorialebook/dp/B00HZ1O78S/ref=sr_1_2?
ie=UTF8&qid=1393066467&sr=82&keywords=android+studio).

Vouspouveztlchargerlesfichiersdeprojetici (/downloads.html)

Vous voulez apprendre comment exploiter la puissance du tiers API comme Twitter, Youtube, Flickr, Imgur et des milliers d'autres? Vous pouvez construire la
fonctionnalit de ces applications directement dans vos applications, accder leurs donnes, ce qui rend vos applications bond en avant de la comptition.

Nous avons prpar une application tutoriel qui utilise Imgur (e rfrentiel d'image) api de sa base de donnes pour eectuer la recherche, rcuprer quelques
images et les acher dans un RecyclerView. (/index.php/ebooks/let-your-apps-take-a-giant-leap-a-tutorial.html)

Nous vous avons galement introduit brivement Http, OkHttp, APIs, Json et Picasso le rendant facile comprendre que nous
travaillons travers le tutoriel.

Consultez notre package eBook, Laissez vos applications prennent un pas de gant (/index.php/ebooks/let-your-apps-take-a-
giant-leap-a-tutorial.html) .

Get your Free

Start Download Software Here

Articles connexes
Android app ApplicationId, versionName et codeVersion expliqu
(/index.php/item/188-android-app-applicationid-versionname-and-
versioncode-explained.html)

Les meilleures armes russes app Android (/index.php/item/187-the-best-

russian-weapons-android-app.html)

bases de donnes Realm pour les dbutants Android (/index.php/item/186-

realm-databases-for-android-beginners.html)

Addiction 101: Aide pour les toxicomanes (/index.php/item/185-addiction-

101-help-for-addicts.html)
Images Ouvrez Gold: Version 6 aide (/index.php/item/184-open-images-
gold-version-6-help.html)