blocks|key|4435046|text|我正在用Kotlin编写一个应用程序，遇到了这个问题，但不幸的是，公认的答案是Java。所以，我用Kotlin重写了它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4435047|Glide.with(context)
++++++++++++++++.load("<Insert+Your+URL>")
++++++++++++++++.listener(object+:+RequestListener<Drawable>+{
++++++++++++++++++++override+fun+onResourceReady(resource:+Drawable?,+model:+Any?,+target:+Target<Drawable>?,+dataSource:+DataSource?,+isFirstResource:+Boolean):+Boolean+{
++++++++++++++++++++++++progressBar.visibility+=+View.GONE
++++++++++++++++++++++++return+false
++++++++++++++++++++}

++++++++++++++++++++override+fun+onLoadFailed(e:+GlideException?,+model:+Any?,+target:+Target<Drawable>?,+isFirstResource:+Boolean):+Boolean+{
++++++++++++++++++++++++progressBar.visibility+=+View.GONE
++++++++++++++++++++++++return+false
++++++++++++++++++++}
++++++++++++++++})
++++++++++++++++.into(holder.imageView)|code-block|syntax|javascript|4435048|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I was writing an app in Kotlin and was having this exact problem, but, unfortunately, the accepted answer was in Java. So, I rewrote it in Kotlin.

<pre><code>Glide.with(context)
 .load("&lt;Insert Your URL&gt;")
 .listener(object : RequestListener&lt;Drawable&gt; {
 override fun onResourceReady(resource: Drawable?, model: Any?, target: Target&lt;Drawable&gt;?, dataSource: DataSource?, isFirstResource: Boolean): Boolean {
 progressBar.visibility = View.GONE
 return false
 }

 override fun onLoadFailed(e: GlideException?, model: Any?, target: Target&lt;Drawable&gt;?, isFirstResource: Boolean): Boolean {
 progressBar.visibility = View.GONE
 return false
 }
 })
 .into(holder.imageView)
</code></pre>

blocks|key|4435093|text|另一个诀窍:把你的ImageView放在一个RelativeLayout里面，后面有一个ProgressBar。然后通过Glide或Picasso加载图像。它将为您完成这项工作，而无需深入挖掘。您不再需要隐藏或显示进度条。它将与图像完全重叠。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4435094|<RelativeLayout
++++++++++++android:layout_width="match_parent"
++++++++++++android:layout_height="@dimen/_180sdp">
++++++++++++<ProgressBar
++++++++++++++++android:layout_centerInParent="true"
++++++++++++++++android:layout_width="wrap_content"
++++++++++++++++android:layout_height="wrap_content"/>
++++++++++++<ImageView
++++++++++++++++android:id="@%2Bid/iv_image"
++++++++++++++++android:layout_width="match_parent"
++++++++++++++++android:layout_height="@dimen/_180sdp"
++++++++++++++++android:scaleType="centerCrop"/>
</RelativeLayout>|code-block|syntax|javascript|4435095|entityMap^0|9|9|M|E|18|B|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|U|8|@]|D|@]|E|$]]]|L|$]]

Another trick: Put your <code>ImageView</code> inside a <code>RelativeLayout</code> with a <code>ProgressBar</code> behind it. Then load the image via Glide or Picasso. It will do the job for you without any deep digging. You don't need to hide or show the progressbar anymore. It will be fully overlapped by the image.

<pre><code>&lt;RelativeLayout
 android:layout_width="match_parent"
 android:layout_height="@dimen/_180sdp"&gt;
 &lt;ProgressBar
 android:layout_centerInParent="true"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"/&gt;
 &lt;ImageView
 android:id="@+id/iv_image"
 android:layout_width="match_parent"
 android:layout_height="@dimen/_180sdp"
 android:scaleType="centerCrop"/&gt;
&lt;/RelativeLayout&gt;
</code></pre>

blocks|key|4435166|text|是的，我们可以使用Glide+RequestOptions在ImageView上显示加载器。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4435167|1)在app级gradle文件中使用下面的编译行。|4435168|implementation+'com.github.bumptech.glide:glide:4.8.0'++++annotationProcessor+'com.github.bumptech.glide:compiler:4.8.0'|offset|length|style|CODE|4435169|2)在可绘图中添加progress_animation.xml文件|4435170|<?xml+version="1.0"+encoding="utf-8"?>
<animated-rotate+xmlns:android="http://schemas.android.com/apk/res/android"
++++android:drawable="@drawable/loader_test"
++++android:pivotX="50%25"
++++android:pivotY="50%25"/>|code-block|syntax|javascript|4435171|3)在drawable中添加下面的loader_test.png图像|4435172|📷|atomic|4435173|​|4435174|4)如下所示创建RequestOption|4435175|public++RequestOptions+options+=+new+RequestOptions()
++++++++++++.centerCrop()
++++++++++++.placeholder(R.drawable.progress_animation)
++++++++++++.error(R.drawable.user_image)
++++++++++++.diskCacheStrategy(DiskCacheStrategy.ALL)
++++++++++++.priority(Priority.HIGH)
++++++++++++.dontAnimate()
++++++++++++.dontTransform();|4435176|5)最后使用它加载图片，如下所示|4435177|Glide.with(this).load(//*Your+image+url*//).apply(options).into(image_view);|4435178|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/ecbce56ab1308bd9dfa1a42d6a01b275.png|imageAlt^0|0|0|0|3C|0|0|0|0|0|1|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1E|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1F|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|1G|8|@$F|1H|G|1I|H|I]]|9|@]|A|$]]|$1|J|3|K|5|6|7|1J|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|1K|8|@]|9|@]|A|$O|P]]|$1|Q|3|R|5|6|7|1L|8|@]|9|@]|A|$]]|$1|S|3|T|5|U|7|1M|8|@]|9|@$F|1N|G|1O|1|1P]]|A|$]]|$1|V|3|W|5|6|7|1Q|8|@]|9|@]|A|$]]|$1|X|3|Y|5|6|7|1R|8|@]|9|@]|A|$]]|$1|Z|3|10|5|N|7|1S|8|@]|9|@]|A|$O|P]]|$1|11|3|12|5|6|7|1T|8|@]|9|@]|A|$]]|$1|13|3|14|5|N|7|1U|8|@]|9|@]|A|$O|P]]|$1|15|3|-4|5|6|7|1V|8|@]|9|@]|A|$]]]|16|$17|$5|18|19|1A|A|$1B|1C|1D|-4]]]]

Yes we can show loader on ImageView using Glide RequestOptions. 
1)Use below compile line in app level gradle file. 

<code>implementation 'com.github.bumptech.glide:glide:4.8.0'
 annotationProcessor 'com.github.bumptech.glide:compiler:4.8.0'</code>

2)Add progress_animation.xml file in drawable 

<pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
 android:drawable="@drawable/loader_test"
 android:pivotX="50%"
 android:pivotY="50%"/&gt;
</code></pre>

3)Add below loader_test.png image in drawable 
<a href="https://i.stack.imgur.com/hu3Fv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/hu3Fv.png" alt="enter image description here"></a>

4)Create RequestOption as below 

<pre><code>public RequestOptions options = new RequestOptions()
 .centerCrop()
 .placeholder(R.drawable.progress_animation)
 .error(R.drawable.user_image)
 .diskCacheStrategy(DiskCacheStrategy.ALL)
 .priority(Priority.HIGH)
 .dontAnimate()
 .dontTransform();
</code></pre>

5)Finally use this to load image as below 

<pre><code>Glide.with(this).load(//*Your image url*//).apply(options).into(image_view);
</code></pre>

blocks|key|4435235|text|这是我的完整解决方案，其中包含一个循环加载进度。我认为最好使用requestOptions属性来实现这一点。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4435236|CircularProgressDrawable+circularProgressDrawable+=+new+CircularProgressDrawable(context);
circularProgressDrawable.setStrokeWidth(5f);
circularProgressDrawable.setCenterRadius(30f);
circularProgressDrawable.start();

RequestOptions+requestOptions+=+new+RequestOptions();
requestOptions.placeholder(circularProgressDrawable);
requestOptions.error(R.drawable.ic_image_not_found);
requestOptions.skipMemoryCache(true);
requestOptions.fitCenter();


glide.load(imagePath)+//passing+your+url+to+load+image.
++++++++.load(imagePath)
++++++++.apply(requestOptions)+//+here+you+have+all+options+you+need
++++++++.transition(DrawableTransitionOptions.withCrossFade())+//+when+image+(url)+will+be+loaded+by+glide+then+this+face+in+animation+help+to+replace+url+image+in+the+place+of+placeHolder+(default)+image.
++++++++.listener(requestListener)
++++++++.into(view);+//pass+imageView+reference+to+appear+the+image.|code-block|syntax|javascript|4435237|你得到了它。|4435238|entityMap^0|V|E|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|S|8|@]|D|@]|E|$]]|$1|M|3|-4|5|6|7|T|8|@]|D|@]|E|$]]]|N|$]]

Here is my complete solution with a circle loading progress. I think it is better to use <code>requestOptions</code>attributes to achieve this.

<pre><code>CircularProgressDrawable circularProgressDrawable = new CircularProgressDrawable(context);
circularProgressDrawable.setStrokeWidth(5f);
circularProgressDrawable.setCenterRadius(30f);
circularProgressDrawable.start();

RequestOptions requestOptions = new RequestOptions();
requestOptions.placeholder(circularProgressDrawable);
requestOptions.error(R.drawable.ic_image_not_found);
requestOptions.skipMemoryCache(true);
requestOptions.fitCenter();


glide.load(imagePath) //passing your url to load image.
 .load(imagePath)
 .apply(requestOptions) // here you have all options you need
 .transition(DrawableTransitionOptions.withCrossFade()) // when image (url) will be loaded by glide then this face in animation help to replace url image in the place of placeHolder (default) image.
 .listener(requestListener)
 .into(view); //pass imageView reference to appear the image.
</code></pre>

And you got it.

blocks|key|4435272|text|第1步创建可绘制为progress_animation.xml|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4435273|<?xml+version="1.0"+encoding="utf-8"?>
<animated-rotate+xmlns:android="http://schemas.android.com/apk/res/android"
++++android:drawable="@drawable/loader_test"
++++android:pivotX="50%25"
++++android:pivotY="50%25"/>|code-block|syntax|javascript|4435274|步骤2下载loader_test并保存到drawable中。|4435275|第3步用于动画加载|4435276|步骤4如果出现错误，用户可以在错误中设置错误图像|4435277|+Glide.with(this).load(url).apply(
+++++++++RequestOptions().placeholder(R.drawable.progress_animation).error((R.drawable.ic_account)).centerCrop()
++++++++++++++++++++++++++++.diskCacheStrategy(DiskCacheStrategy.ALL)
++++++++++++++++++++++++++++.priority(Priority.HIGH)
++++++++++++++++++++++++++++.transform(CenterCrop(),+RoundedCorners(1000)))
++++++++++++++++++++.into(image_view)|4435278|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

Step -1 create drawable as progress_animation.xml
<pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
&lt;animated-rotate xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
 android:drawable=&quot;@drawable/loader_test&quot;
 android:pivotX=&quot;50%&quot;
 android:pivotY=&quot;50%&quot;/&gt;
</code></pre>
step 2 download loader_test and save in drawable.
step 3 for animate loading
step 4 in case of error user can set error image in error
<pre><code> Glide.with(this).load(url).apply(
 RequestOptions().placeholder(R.drawable.progress_animation).error((R.drawable.ic_account)).centerCrop()
 .diskCacheStrategy(DiskCacheStrategy.ALL)
 .priority(Priority.HIGH)
 .transform(CenterCrop(), RoundedCorners(1000)))
 .into(image_view)
</code></pre>

Can I load a spinner in placeholder with rotating animation until the image is loaded using Glide?

I am trying to do that using .placeholder(R.Drawable.spinner) no animation is coming up?

It would be great if somebody could help me out?

Thanks!

Progress bar while loading image using Glide

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

在使用Glide加载图像之前，我可以使用旋转动画加载占位符中的微调器吗？我正在尝试使用.placeholder(R.Drawable.spinner)来做这件事，没有动画吗？如果有人能帮我就太好了？谢谢!

问使用Glide加载图像时的进度条
EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Glide加载图像时的进度条EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Glide加载图像时的进度条
EN