使用 Glide 的简单共享元素转换滞后

Question

我在两个活动之间有一个非常简单的过渡，有时，图像停在中间，滞后，闪烁黑色。

我在 Glide 中多次使用了 shared-element-transitions，但我不能让它不延迟。

这是第一个Activity:

val intent = Intent(this, MediaZoomImageActivity::class.java)
intent.putExtra(MediaZoomActivity.ZOOM_MEDIA_URL, submission.imageUrl)

val bundle = ActivityOptionsCompat.makeSceneTransitionAnimation(this,
            post_image_parallax, ViewCompat.getTransitionName(post_image_parallax)).toBundle()

startActivity(intent, bundle)

这是第二个Activity:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_zoom_image)
    postponeEnterTransition()

    back.setOnClickListener { finish() }

    val url = intent.getStringExtra(ZOOM_MEDIA_URL)
    Glide.with(this)
            .load(url)
            .apply(RequestOptions().diskCacheStrategy(DiskCacheStrategy.RESOURCE))
            .into(media_zoom_image)

    media_zoom_image.viewTreeObserver.addOnPreDrawListener(object : ViewTreeObserver.OnPreDrawListener {
        override fun onPreDraw(): Boolean {
            media_zoom_image.viewTreeObserver.removeOnPreDrawListener(this)
            startPostponedEnterTransition()

            return true
        }
    })

这是第二个的布局Activity:

约束布局
-后退按钮 (ImageButton)
-图像（ImageView）

这是动画：

<changeBounds
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="200" />

这很简单，但我无法理解它。第二张图片原本有一些听众使用手势，我认为这就是原因，但将所有内容都注释掉仍然存在延迟。第一个 Activity 中的图像是另一个具有相同 transitionName 的 shared-element-transition 的目标，这会是问题所在吗？难道我做错了什么？是ConstraintLayout的问题吗？ Glide有问题吗？

在此先感谢您的帮助。

Answer 1

而不是使用 PreDrawListener，使用带有滑行的侦听器可以修复它。看起来有时间问题

 Glide
            .with(this)
            .asBitmap()
            .load(url)
            .apply(RequestOptions().diskCacheStrategy(DiskCacheStrategy.RESOURCE))
            .listener(new RequestListener<Bitmap>() {
                @Override
                public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Bitmap> target, boolean isFirstResource) {
                    return false;
                }

                @Override
                public boolean onResourceReady(Bitmap resource, Object model, Target<Bitmap> target, DataSource dataSource, boolean isFirstResource) {
                    media_zoom_image.setImageBitmap(resource);
                    startPostponedEnterTransition();
                    return true;
                }
            })
            .into(media_zoom_image);

确保删除

 media_zoom_image.viewTreeObserver.addOnPreDrawListener(object : ViewTreeObserver.OnPreDrawListener {
    override fun onPreDraw(): Boolean {
        media_zoom_image.viewTreeObserver.removeOnPreDrawListener(this)
        startPostponedEnterTransition()

        return true
    }
})

更新

我更新了 onResourceReady 块。请试一试。

Glide
        .with(this)
        .asBitmap()
        .load(url)
        .apply(RequestOptions().diskCacheStrategy(DiskCacheStrategy.RESOURCE))
        .listener(new RequestListener<Bitmap>() {
            @Override
            public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Bitmap> target, boolean isFirstResource) {
                return false;
            }

            @Override
            public boolean onResourceReady(Bitmap resource, Object model, Target<Bitmap> target, DataSource dataSource, boolean isFirstResource) {
                startPostponedEnterTransition();
                return false;
            }
        })
        .into(media_zoom_image);

更新 2

尽早调用postponeEnterT运行sition。

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState);

postponeEnterTransition(); // Called it before set content. Try to call it before super.onCreate to see if it also works?

setContentView(R.layout.activity_zoom_image);
...
})

更新 3

优化您的图像。有一些在线网站或工具，或者您可以询问您的平面设计师。

您还可以增加动画的持续时间，以便为平滑加载留出时间。

<changeBounds
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300" />

请注意，glide 中的侦听器在设置要查看的位图之前运行。 Picasso 和 Glide 的区别，Picasso 在 into() 方法中有回调参数作为可选参数，在设置位图查看后运行 onSuccess()。因此，使我们共享的 t运行站点的执行在推迟时已经运行不稳定 (ImageView#setBitmapImage)。毕加索在这种情况下更闪耀一点。

使用 Glide 的简单共享元素转换滞后

Lag with simple shared-element-transition using Glide

android

android-glide

android-transitions