使用Glide加载GIF到ImageSwitcher时背景为空的问题排查

你的问题我碰到过类似的情况，咱们来拆解下为啥用Glide加载GIF到ImageSwitcher会显示为空：

问题根源 #

1. nextView可能未初始化：ImageSwitcher的视图是通过Factory按需创建的，你直接调用backgroundView.nextView时，这个视图可能还没被Factory生成，Glide相当于把GIF加载到了一个空对象上，自然看不到效果。
2. 异步加载的时序问题：Glide加载网络资源是异步操作，你在调用into()后立刻执行showNext()，这时候GIF还没下载并解码完成，切换过去的视图当然是空的。
3. 视图属性缺失：你原来的Factory里给ImageView设置了CENTER_CROP的scaleType，但加载GIF时没有确保这个属性被继承，也可能导致图片显示异常（比如缩成一团或者不显示）。

修复方案 #

我们需要解决这三个问题，修改你的setBackgroundWithImage方法如下：

private fun setBackgroundWithImage(activity: Activity, url: String) {
    val backgroundView = activity.findViewById<ImageSwitcher>(R.id.view_background)
    
    // 先确保nextView已被创建，为空则通过Factory手动生成
    val nextImageView = backgroundView.nextView?.let { it as ImageView } 
        ?: backgroundView.factory?.makeView() as ImageView
    
    // 保持和Factory中一致的ScaleType，避免显示异常
    nextImageView.scaleType = ImageView.ScaleType.CENTER_CROP
    
    Glide.with(activity)
        .asGif()
        .load(url)
        .listener(object : RequestListener<GifDrawable> {
            override fun onLoadFailed(
                e: GlideException?,
                model: Any?,
                target: Target<GifDrawable>?,
                isFirstResource: Boolean
            ): Boolean {
                // 加载失败可以加个容错，比如显示默认图
                return false
            }

            override fun onResourceReady(
                resource: GifDrawable?,
                model: Any?,
                target: Target<GifDrawable>?,
                dataSource: DataSource?,
                isFirstResource: Boolean
            ): Boolean {
                // 只有当GIF加载完成后，再切换视图
                backgroundView.showNext()
                return false
            }
        })
        .into(nextImageView)
}

另外，建议你优化下ImageSwitcher的Factory设置，确保每个生成的ImageView都有正确的布局参数：

view_background.setFactory {
    ImageView(this@MainActivity).apply {
        scaleType = ImageView.ScaleType.CENTER_CROP
        layoutParams = ImageSwitcher.LayoutParams(
            ViewGroup.LayoutParams.MATCH_PARENT,
            ViewGroup.LayoutParams.MATCH_PARENT
        )
    }
}

原理说明 #

• 先检查并初始化nextView，保证Glide有一个有效的ImageView可以加载资源；
• 同步视图属性，确保GIF的显示方式和你之前的本地图片一致；
• 利用RequestListener监听加载完成事件，等GIF完全加载好再切换视图，避免空视图展示。

这样修改后，你的ImageSwitcher应该就能正常显示网络GIF，并且保持原来的淡入淡出效果了。

内容的提问来源于stack exchange，提问作者justHelloWorld