2016-02-10 5 views
31

Kann ich einen Spinner im Platzhalter mit rotierender Animation laden, bis das Bild mit Glide geladen wird?Fortschrittsbalken beim Laden des Bildes mit Glide

Ich versuche das mit .Placeholder (R.Drawable.spinner) zu tun, keine Animation kommt auf?

Es wäre toll, wenn mir jemand helfen könnte?

Danke!

+1

Sie benötigen einen Code zu schreiben. – Roymunson

+0

http://stackoverflow.com/questions/39263403/progress-bar-set-visiblity-using-grid-view-images-gallery Bitte lösen Sie das Problem –

Antwort

76

Sie könnten ein normales ProgressBar, erstellen und dann auf Glide verstecken onResourceReady().

Die Methode, die aufgerufen wird, wenn die Ressourcenladung beendet ist.


Beispiel:

MainActivity.java

activity_main.xml (Layout):

<?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" 
    tools:context=".MainActivity"> 

    <ProgressBar 
     android:id="@+id/progress" 
     android:layout_width="match_parent" 
     android:layout_height="100dp" 
     android:visibility="visible" /> 

    <ImageView 
     android:id="@+id/img_glide" 
     android:layout_width="match_parent" 
     android:layout_height="100dp" /> 

</RelativeLayout> 

Ergebnis:

enter image description here

+6

Die onException sollte progressBar.setVisibility (View.GONE); auch. :) – AndroidRuntimeException

+1

es ist gut, aber es zeigt nicht den Wert des Fortschritts. Wie man es hinzufügt? –

+0

Die GlideDrawable-Klasse kann nicht aufgelöst werden, obwohl ich die Glide-Bibliothek importiert habe. Muss ich zusätzliche Bibliotheken hinzufügen, um GlideDrawable verwenden zu können? – XerXes

3

schrieb ich die einfache tutorial zu erklären, wie Sie Ihre Ladefortschrittsanzeige mit Glide V4 zu integrieren.

Sie können den Fortschrittswert beliebig setzen.

Hoffe es wird Ihre Frage lösen.

Hinweis: Ich habe keine 10 Ruf, Bilder zu posten.

APP DEMO

kapseln I Bild loader mit dem Fortschritt in GlideImageLoader.java & ProgressAppGlideModule .java-

Wie mit 3 Schritten zur Umsetzung:

1. build.gradle

//Glide 
implementation 'com.github.bumptech.glide:glide:4.4.0' 
annotationProcessor 'com.github.bumptech.glide:compiler:4.4.0' 
implementation 'com.github.bumptech.glide:okhttp3-integration:4.4.0' 

2. Clone GlideImageLoader.java & ProgressAppGlideModule.Java in Ihr Projekt

3.Einfache Verwendung überall

RequestOptions options = new RequestOptions() 
        .centerCrop() 
        .placeholder(R.drawable.placeholder) 
        .error(R.drawable.ic_pic_error) 
        .priority(Priority.HIGH); 

new GlideImageLoader(YOUR.imageView, 
        YOUR.progressBar).load(url,options); 

komplette Java-Code für Klon:

GlideImageLoader.java

public class GlideImageLoader { 

    private ImageView mImageView; 
    private ProgressBar mProgressBar; 

    public GlideImageLoader(ImageView imageView, ProgressBar progressBar) { 
     mImageView = imageView; 
     mProgressBar = progressBar; 
    } 

    public void load(final String url, RequestOptions options) { 
     if (url == null || options == null) return; 

     onConnecting(); 

     //set Listener & start 
     ProgressAppGlideModule.expect(url, new ProgressAppGlideModule.UIonProgressListener() { 
      @Override 
      public void onProgress(long bytesRead, long expectedLength) { 
       if (mProgressBar != null) { 
        mProgressBar.setProgress((int) (100 * bytesRead/expectedLength)); 
       } 
      } 

      @Override 
      public float getGranualityPercentage() { 
       return 1.0f; 
      } 
     }); 
     //Get Image 
     Glide.with(mImageView.getContext()) 
       .load(url) 
       .transition(withCrossFade()) 
       .apply(options.skipMemoryCache(true)) 
       .listener(new RequestListener<Drawable>() { 
        @Override 
        public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) { 
         ProgressAppGlideModule.forget(url); 
         onFinished(); 
         return false; 
        } 

        @Override 
        public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) { 
         ProgressAppGlideModule.forget(url); 
         onFinished(); 
         return false; 
        } 
       }) 
       .into(mImageView); 
    } 


    private void onConnecting() { 
     if (mProgressBar != null) mProgressBar.setVisibility(View.VISIBLE); 
    } 

    private void onFinished() { 
     if (mProgressBar != null && mImageView != null) { 
      mProgressBar.setVisibility(View.GONE); 
      mImageView.setVisibility(View.VISIBLE); 
     } 
    } 
} 

ProgressAppGlideModule.java

@GlideModule 
public class ProgressAppGlideModule extends AppGlideModule { 

    @Override 
    public void registerComponents(Context context, Glide glide, Registry registry) { 
     super.registerComponents(context, glide, registry); 
     OkHttpClient client = new OkHttpClient.Builder() 
       .addNetworkInterceptor(new Interceptor() { 
        @Override 
        public Response intercept(Chain chain) throws IOException { 
         Request request = chain.request(); 
         Response response = chain.proceed(request); 
         ResponseProgressListener listener = new DispatchingProgressListener(); 
         return response.newBuilder() 
           .body(new OkHttpProgressResponseBody(request.url(), response.body(), listener)) 
           .build(); 
        } 
       }) 
       .build(); 
     registry.replace(GlideUrl.class, InputStream.class, new OkHttpUrlLoader.Factory(client)); 
    } 

    public static void forget(String url) { 
     ProgressAppGlideModule.DispatchingProgressListener.forget(url); 
    } 
    public static void expect(String url, ProgressAppGlideModule.UIonProgressListener listener) { 
     ProgressAppGlideModule.DispatchingProgressListener.expect(url, listener); 
    } 

    private interface ResponseProgressListener { 
     void update(HttpUrl url, long bytesRead, long contentLength); 
    } 

    public interface UIonProgressListener { 
     void onProgress(long bytesRead, long expectedLength); 
     /** 
     * Control how often the listener needs an update. 0% and 100% will always be dispatched. 
     * @return in percentage (0.2 = call {@link #onProgress} around every 0.2 percent of progress) 
     */ 
     float getGranualityPercentage(); 
    } 

    private static class DispatchingProgressListener implements ProgressAppGlideModule.ResponseProgressListener { 
     private static final Map<String, UIonProgressListener> LISTENERS = new HashMap<>(); 
     private static final Map<String, Long> PROGRESSES = new HashMap<>(); 

     private final Handler handler; 

     DispatchingProgressListener() { 
      this.handler = new Handler(Looper.getMainLooper()); 
     } 

     static void forget(String url) { 
      LISTENERS.remove(url); 
      PROGRESSES.remove(url); 
     } 

     static void expect(String url, UIonProgressListener listener) { 
      LISTENERS.put(url, listener); 
     } 

     @Override 
     public void update(HttpUrl url, final long bytesRead, final long contentLength) { 
      //System.out.printf("%s: %d/%d = %.2f%%%n", url, bytesRead, contentLength, (100f * bytesRead)/contentLength); 
      String key = url.toString(); 
      final UIonProgressListener listener = LISTENERS.get(key); 
      if (listener == null) { 
       return; 
      } 
      if (contentLength <= bytesRead) { 
       forget(key); 
      } 
      if (needsDispatch(key, bytesRead, contentLength, listener.getGranualityPercentage())) { 
       handler.post(new Runnable() { 
        @Override 
        public void run() { 
         listener.onProgress(bytesRead, contentLength); 
        } 
       }); 
      } 
     } 

     private boolean needsDispatch(String key, long current, long total, float granularity) { 
      if (granularity == 0 || current == 0 || total == current) { 
       return true; 
      } 
      float percent = 100f * current/total; 
      long currentProgress = (long) (percent/granularity); 
      Long lastProgress = PROGRESSES.get(key); 
      if (lastProgress == null || currentProgress != lastProgress) { 
       PROGRESSES.put(key, currentProgress); 
       return true; 
      } else { 
       return false; 
      } 
     } 
    } 

    private static class OkHttpProgressResponseBody extends ResponseBody { 
     private final HttpUrl url; 
     private final ResponseBody responseBody; 
     private final ResponseProgressListener progressListener; 
     private BufferedSource bufferedSource; 

     OkHttpProgressResponseBody(HttpUrl url, ResponseBody responseBody, 
            ResponseProgressListener progressListener) { 
      this.url = url; 
      this.responseBody = responseBody; 
      this.progressListener = progressListener; 
     } 

     @Override 
     public MediaType contentType() { 
      return responseBody.contentType(); 
     } 

     @Override 
     public long contentLength() { 
      return responseBody.contentLength(); 
     } 

     @Override 
     public BufferedSource source() { 
      if (bufferedSource == null) { 
       bufferedSource = Okio.buffer(source(responseBody.source())); 
      } 
      return bufferedSource; 
     } 

     private Source source(Source source) { 
      return new ForwardingSource(source) { 
       long totalBytesRead = 0L; 

       @Override 
       public long read(Buffer sink, long byteCount) throws IOException { 
        long bytesRead = super.read(sink, byteCount); 
        long fullLength = responseBody.contentLength(); 
        if (bytesRead == -1) { // this source is exhausted 
         totalBytesRead = fullLength; 
        } else { 
         totalBytesRead += bytesRead; 
        } 
        progressListener.update(url, totalBytesRead, fullLength); 
        return bytesRead; 
       } 
      }; 
     } 
    } 
} 
+0

Sie haben Recht, ich möchte ursprünglich die Kommentare hinterlassen, anstatt eine Antwort zu posten. Aber es scheint, dass ich nicht genug Ruf habe, um Kommentare zu hinterlassen. Ich füge den notwendigen Code hier hinzu, um die Verbindung ungültig zu machen. –