グライドライブラリを使用して、画像の読み込みが完了するとプログレスバーの表示が消えるように設定します


90

こんにちは私は画像の読み込み中に表示される画像のプログレスバーが欲しいのですが、画像の読み込みが完了すると消えるように設定したいと思います。以前、私はこれにPicassoライブラリを使用していました。しかし、Glideライブラリでそれを使用する方法がわかりません。リソース対応機能があるとは思いますが、使い方がわかりません。誰か助けてもらえますか?

ピカソライブラリのコード

Picasso.with(mcontext).load(imgLinkArray.get(position).mUrlLink)
       .into(imageView, new Callback() {
           @Override
           public void onSuccess() {
               progressBar.setVisibility(View.GONE);
           }

           @Override
           public void onError() {
           }
        })
;

グライドでこれを行うにはどうすればよいですか?

Glide.with(mcontext).load(imgLinkArray.get(position).mUrlLink)
     .into(imageView);

これでGlideを使って画像を読み込むことができprogressBar.setVisibility(View.GONE);ますが、画像が読み込まれた場合、コードのどこかに書き込むにはどうすればよいですか?


2
なぜライブラリを変更したのですか?ピカソは素晴らしいです。
tasomaniac 2014

ライブラリを変更する正当な理由がない限り、ピカソを使い続けることもお勧めします
クリス

回答:


229

質問はかなり古く、当時のグライドの状況はわかりませんが、今ではリスナーで簡単に行うことができます(正解として選択された回答では提案されていません)。

progressBar.setVisibility(View.VISIBLE);
Glide.with(getActivity())
     .load(args.getString(IMAGE_TO_SHOW))
     .listener(new RequestListener<String, GlideDrawable>() {
         @Override
         public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
             return false;
         }

         @Override
         public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
             progressBar.setVisibility(View.GONE);
             return false;
         }
     })
     .into(imageFrame)
;

アニメーションなどを自分で処理する場合はtrueを返し、グライドで処理する場合はfalseを返します。


13
隠れて考えてみましょうprogressBarではonExceptionそれ以外の場合は、誤った希望を与えて無期限スピンだろう、としても。一度onException呼び出されると、Glideはに渡されるものを設定する以外に何もしません.error()
TWiStErRob 2015年

2
これにより、画像が読み込まれる前にフラグメント/アクティビティを離れると、NullPointerExceptionが発生する可能性があります。
aProperFox 2016

1
私はあなたが内部クラスのリスナーを作成することを扇動しているのではなく、タスクを完了するためのツールを示すための最も簡潔な方法です。
Yaroslav

1
確かに、Glide.clear(yourImageView)
aProperFox 2016

7
注:.listener前に呼び出す必要があります.into()
Ahmed Mostafa 2018年

31

KOTLINでこれを実行したい場合は、次の方法で試すことができます。

    Glide.with(context)
            .load(url)
            .listener(object : RequestListener<Drawable> {
                override fun onLoadFailed(e: GlideException?, model: Any?, target: Target<Drawable>?, isFirstResource: Boolean): Boolean {
                    //TODO: something on exception
                }
                override fun onResourceReady(resource: Drawable?, model: Any?, target: Target<Drawable>?, dataSource: DataSource?, isFirstResource: Boolean): Boolean {
                    Log.d(TAG, "OnResourceReady")
                    //do something when picture already loaded
                    return false
                }
            })
            .into(imgView)

5
:また、ターゲットをインポートする必要がありますimport com.bumptech.glide.request.target.Target
Gibolt

この@Giboltストレート10分間私を盗聴された
johnrao07

17

私の答えは、時代遅れのAPIに基づいていました。最新の回答については、こちらをご覧ください。


.listener()負荷(モデル、メモリキャッシュなど)に関するより多くの情報を受け取るので、より多くのカスタムロジックを決定するのが簡単になるため、より優れています。RequestListenerまた、より安定しており、Target作成するものをオーバーライドしても、将来の修正のメリットは得られません。VisibilityListener<T, R>さまざまなコンテキストで再利用できるを簡単に作成することもできます。
TWiStErRob 2015年

10

例外として、もう一度表示するための条件を設定します ProgressBar

 Glide.with(context)
    .load(image_url)
    .listener(new RequestListener<String, GlideDrawable>() {
        @Override
        public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
            if(e instanceof UnknownHostException)
                progressBar.setVisibility(View.VISIBLE);
            return false;
        }

        @Override
        public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
            progressBar.setVisibility(View.GONE);
            return false;
        }
    })
    .into(imageView);

7

上記の解決策は私にとってもかなりうまく機能しますが、asBitmap()を使用して画像をダウンロードすると。それは動作しません。

BitmapImageViewTargetを使用する必要があります

Glide.with(this) .load(imageURL)
 .asBitmap()
 .placeholder(R.drawable.bg)
 .into(new BitmapImageViewTarget(imageView) {
            @Override
            public void onResourceReady(Bitmap  drawable, GlideAnimation anim) {
                super.onResourceReady(drawable, anim);
                progressBar.setVisibility(View.GONE);
            }
        });

私のコメントを参照してください:stackoverflow.com/questions/26054420/…。この答えは、私がそこで言ったことの良いデモンストレーションです。
TWiStErRob 2015年

7

GlideDrawableは非推奨です。シンプルなDrawableを使用してください

RequestOptions requestOptions = new RequestOptions();
requestOptions.placeholder(R.drawable.placeholder);
requestOptions.error(R.drawable.error);

Glide.with(getContext())
                 .setDefaultRequestOptions(requestOptions)
                 .load(finalPathOrUrl)
                 .listener(new RequestListener<Drawable>() {
                        @Override
                        public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) {
                            progressBar.setVisibility(View.GONE);
                            return false;
                        }

                        @Override
                        public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) {
                            progressBar.setVisibility(View.GONE);
                            return false;
                        }
                    })
                 .into(mImageView);

4

Kotlinでは、以下のように実行できます

Glide.with(context)
            .setDefaultRequestOptions(RequestOptions().placeholder(R.drawable.ic_image_placeholder).error(R.drawable.ic_image_placeholder))
            .load(url)
            .listener(object : RequestListener<Drawable>{
                override fun onLoadFailed(e: GlideException?, model: Any?, target: Target<Drawable>?, isFirstResource: Boolean): Boolean {
                    return false
                }

                override fun onResourceReady(resource: Drawable?, model: Any?, target: Target<Drawable>?, dataSource: DataSource?, isFirstResource: Boolean): Boolean {
                    return false
                }

            })
            .into(imageView)

2
  1. xmlで、高さと幅(match_parent)のプログレスバーを取得します。
  2. 以下のメソッドを呼び出す前に、プログレスバーの可視性を表示するように設定します。

    public void setImageWIthProgressBar(Context context, final ImageView imageView, String imageUrl, final ProgressBar progressBar) {
    
            Glide.with(context)
                    .load(imageUrl)
                    .listener(new RequestListener<String, GlideDrawable>() {
                        @Override
                        public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource) {
                            progressBar.setVisibility(View.GONE);
                            return false;
                        }
    
                        @Override
                        public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource) {
                            progressBar.setVisibility(View.GONE);
                            return false;
                        }
                    })
                    .into(imageView);
    
        }//setImageWIthProgressBar
    

あなたの答えはstackoverflow.com/a/31675796/3812404とどのように異なりますか?また、ポイント1は必要ありません。
HariRam 2017年

2

更新:

Glide.with(this)
            .load(imageUrl)
            .listener(new RequestListener<Drawable>() {
                @Override
                public boolean onLoadFailed(@Nullable final GlideException e,
                                            final Object model, final Target<Drawable> target,
                                            final boolean isFirstResource) {
                    showProgress(false);

                    mNoContentTextView.setVisibility(View.VISIBLE);

                    return false;
                }

                @Override
                public boolean onResourceReady(final Drawable resource, 
                                               final Object model, 
                                               final Target<Drawable> target, 
                                               final DataSource dataSource, 
                                               final boolean isFirstResource) {
                    showProgress(false);

                    mNoContentTextView.setVisibility(View.GONE);
                    mContentImageView.setImageDrawable(resource);

                    return false;
                }
            })
            .into(mContentImageView);

たとえば、すでにonResourceReadyがある場合、「into」の使用は何ですか?リスナーだけを使うことはできませんか?もしそうなら、どのように私はそれがに」なしでロードを開始することができますか?
Androidの開発者

@android開発者私が知っているようにあなたは中になくても使用できます
Narek Hayrapetyan

試してみる
価値がある

しかし、「into」を使用しない場合は、警告があると思います。
Androidの開発者

1

私が物事をした方法。より短い方法で、よりクリーンなコード

例:

progress_bar.visibility = View.VISIBLE

profilePicturePath?.let {
    GlideApp.with(applicationContext)
        .load(CloudStorage.pathToReference(it))
        .placeholder(R.drawable.placeholder)
        .listener(GlideImpl.OnCompleted {
            progress_bar.visibility = View.GONE
        })
    .into(profile_picture)
} ?: profile_picture.setImageResource(R.drawable.placeholder)

使用法:

GlideImpl.OnCompleted {
    // completed
}

GlideImpl.OnCompleted { }グライドに渡すだけ.listener()

GlideのRequestListenerを受け入れるGlideImpl.ktクラス

import android.graphics.drawable.Drawable
import com.bumptech.glide.load.DataSource
import com.bumptech.glide.load.engine.GlideException
import com.bumptech.glide.request.RequestListener
import com.bumptech.glide.request.target.Target

object GlideImpl {

    object OnCompleted : RequestListener<Drawable> {

        private lateinit var onComplete: () -> Unit

        operator fun invoke(onComplete: () -> Unit): OnCompleted {
            OnCompleted.onComplete = { onComplete() }
            return this
        }

        override fun onResourceReady(
            resource: Drawable?,
            model: Any?,
            target: Target<Drawable>?,
            dataSource: DataSource?,
            isFirstResource: Boolean
        ): Boolean {
            onComplete()
            return false
        }

        override fun onLoadFailed(
            e: GlideException?,
            model: Any?,
            target: Target<Drawable>?,
            isFirstResource: Boolean
        ): Boolean {
            onComplete()
            return false
        }
    }
}

それだけです!


0

Kotlinの方法

Glide.with(context)
                .load(image_url)
                .listener(object : com.bumptech.glide.request.RequestListener<Drawable> {
                    override fun onLoadFailed(
                        e: GlideException?,
                        model: Any?,
                        target: Target<Drawable>?,
                        isFirstResource: Boolean
                    ): Boolean {
                        return false
                    }

                    override fun onResourceReady(
                        resource: Drawable?,
                        model: Any?,
                        target: Target<Drawable>?,
                        dataSource: DataSource?,
                        isFirstResource: Boolean
                    ): Boolean {
                        img_product_banner.visibility = View.VISIBLE
                        return false
                    }

                }).placeholder(R.drawable.placeholder)
                .diskCacheStrategy(DiskCacheStrategy.ALL)
                .into(img_product_banner)

-1

これは、可視性を設定して目的の出力を取得するなどのハックを使用しないため、最良の回答です。

プログレスバーのgifをダウンロードして呼び出しprogressbargif、ドローアブルフォルダに入れます。

        Glide.with(ctx)
            .load(url)
            .thumbnail(Glide.with(ctx).load(R.drawable.progressbargif))
            .diskCacheStrategy(DiskCacheStrategy.SOURCE)
            .error(R.drawable.image_unavailable)
            .crossFade(200)
            .into(iv);

URL画像が読み込まれると、サムネイルは消えます。キャッシュされた画像が読み込まれると、サムネイルはすぐに消えます。


4
それは質問に答えていないからだと思います:OPはすでに彼が満足しているスピナーを持っています。また、Androidのベストプラクティスにも反します。スピナーとしてGIFを使用すると、90年代になり、APKサイズが大幅に増加します。GIFを挿入drawableすること自体は、フレームワークによってロードされないため、悪いことです。GIFは、含まれるrawassets、せいぜいである必要があります。アプリでイベントが発生したときに可視性を変更しても問題はありません。Androidはそのために設計されています。
TWiStErRob 2017年

1
GIFデコードが行われている間、ユーザーには空のスペースも表示されます。これは非同期であり、即時ではありません。あなたもRESULT、プログレスバーをキャッシュしているため、読み込みに時間がかかります。GIFはSOURCE、効率を上げるためにせいぜいキャッシュする必要があります。ただし、これはローカルファイルであるため、キャッシュはNONEディスク上で複製しないようにする必要があり、さらに多くのユーザースペースを消費します。
TWiStErRob 2017年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.