Animiertes Laden Bild in Picasso

Question

Ich habe den folgenden Code, um ein Bild in Picasso zu laden, mit einem Zeichen für den Platzhalter, um anzuzeigen, während das Bild heruntergeladen wird. Was ich will, ist jedoch ein animierter drehender Fortschrittstabellen-Spinner, der herum und herum animiert, während das Bild geladen wird, wie ich es in den meisten professionellen Apps sehe. Picasso scheint dies nicht zu unterstützen, nur statische Bildauszüge. Gibt es eine Möglichkeit, mit Picasso zusammenzuarbeiten, oder muss ich etwas anderes machen?

Picasso.with(context).load(url)    
        .placeholder(R.drawable.loading) 
        .error(R.drawable.image_download_error) 
        .into(view); 

Answer 1

Picasso unterstützt leider keine animierten Platzhalter.

Eine Möglichkeit, wie Sie das umgehen können, ist das Platzieren Ihres ImageView in einem FrameLayout mit dem animierten Zeichnungsobjekt darunter. Auf diese Weise lädt Picasso das Bild über den animierten Platzhalter und gibt dem Benutzer den gewünschten Effekt.

Alternativ können Sie das Bild in eine Target laden. Dann wird standardmäßig der Fortschrittsbalken angezeigt, und wenn die Methode onBitmapLoaded aufgerufen wird, können Sie sie ausblenden und das Bild anzeigen. Sie können eine grundlegende Implementierung dieser here

Answer 2

finden Sie eine Ladefortschritt Animationsbild mit Picasso Platzhalter haben:

ich dies einfach eine animierte drehen xml-Objekt gelöst.

Schritte:

progress_image.png

/res/drawable/progress_animation.xml

<?xml version="1.0" encoding="utf-8"?> 

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android" 
    android:drawable="@drawable/progress_image" 
    android:pivotX="50%" 
    android:pivotY="50%"/> 

Picasso Laden:

Picasso.with(context) 
     .load(your_path) 
     .error(R.drawable.ic_error) 
     .placeholder(R.drawable.progress_animation) 
     .into(image_view); 

Ich hoffe, das hilft!

Answer 3

Ich habe den Fortschrittsdialog bis zum Bilddownload implementiert und es ist sehr einfach. Nehmen Sie Ihr ImageView im relativen Layout und platzieren Sie den Fortschrittslader in derselben Bildansicht. Wenden Sie den folgenden Code an und behandeln Sie nur die Sichtbarkeit des Fortschrittsdialogs.

holder.loader.setVisibility(View.VISIBLE); 
      holder.imageView.setVisibility(View.VISIBLE); 
     final ProgressBar progressView = holder.loader; 
      Picasso.with(context) 
      .load(image_url) 
      .transform(new RoundedTransformation(15, 0)) 
      .fit() 
      .into(holder.imageView, new Callback() { 
       @Override 
       public void onSuccess() { 
        progressView.setVisibility(View.GONE); 
       } 

       @Override 
       public void onError() { 
        // TODO Auto-generated method stub 

       } 
      }); 
     } 

Genießen.:)

Answer 4

Ich habe es in folgenden Weise arbeiten:

1. ein ziehbar Erstellt (irgendwo im Internet zu finden) und legt es in dem res/ziehbar:

   <?xml version="1.0" encoding="utf-8"?> 
   <rotate xmlns:android="http://schemas.android.com/apk/res/android" 
   android:fromDegrees="90" 
   android:pivotX="50%" 
   android:pivotY="50%" 
   android:toDegrees="360"> 
   
   <shape 
       android:innerRadiusRatio="3" 
       android:shape="ring" 
       android:thicknessRatio="7.0"> 
   
       <gradient 
        android:angle="0" 
        android:centerColor="#007DD6" 
        android:endColor="#007DD6" 
        android:startColor="#007DD6" 
        android:type="sweep" 
        android:useLevel="false" /> 
   </shape> 
   

2. In meinem Element für die GridView hinzugefügt ProgressBar Element:

   <ProgressBar 
       android:id="@+id/movie_item_spinner" 
       android:layout_width="@dimen/poster_width" 
       android:layout_height="@dimen/poster_height" 
       android:progressDrawable="@drawable/circular_progress_bar"/> 
   

3. In-Adapter hinzugefügt Zielobjekt mit folgenden Parametern, wo Poster und Spinner Verweise auf Image und ProgressBar sind:

   // Ziel/auszublenden ProgressBar auf Image

   final Target target = new Target() { 
   
        @Override 
        public void onPrepareLoad(Drawable drawable) { 
         poster.setBackgroundResource(R.color.white); 
         spinner.setVisibility(View.VISIBLE); 
        } 
   
        @Override 
        public void onBitmapLoaded(Bitmap photo, Picasso.LoadedFrom from) { 
         poster.setBackgroundDrawable(new BitmapDrawable(photo)); 
         spinner.setVisibility(View.GONE); 
        } 
   
        @Override 
        public void onBitmapFailed(Drawable drawable) { 
         poster.setBackgroundResource(R.color.white); 
        } 
       }; 
   

4. Ergebnisse wie wird zu zeigen, dass beim Laden - Kreis dreht (sorry für diesen Screenshot, aber Bilder erscheinen zu schnell): ScreenShot

Answer 5

Für alle, die versuchen, die Technik von DBragion zu verwenden: Stellen Sie sicher, dass Sie die neueste Version von Picasso haben oder dass sie sich nicht dreht. Meins hat nicht funktioniert, bis ich die Version 2.5.2 benutzt habe.

compile 'com.squareup.picasso:picasso:2.5.2'