글라이드를 사용하여 간단한 공유 요소 전이시 지연

Question

두 가지 활동간에 매우 간단한 전환이 있으며 때로는 중간에 이미지가 멈추고 뒤쳐져 검은 색으로 깜박입니다.

글라이드에서 여러 번 shared-element-transitions을 사용했지만 이번에는 지연되지 않습니다.

이 제 활동 :

:이 제 활동에 대한 레이아웃

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 
     } 
    }) 

이다

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) 

이 두번째 작업은

1. constraintLayout는
는

이 애니메이션

-backbutton (하여 ImageButton)

- 이미지 (이미지 뷰)입니다 : 그것은 매우 간단

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

,하지만 난 내 머리를 정리하고 수 없습니다 그것 주위. 두 번째 이미지에는 원래 제스처를 사용하는 청취자가 있었으며 그 이유가 여기에 있다고 생각했지만 모든 것을 주석으로 처리하는 데는 그 지연이 여전히 있습니다. 첫 번째 Activity의 이미지가 동일한 transitionName을 가진 다른 공유 요소 전이의 대상입니다. 문제가 될 수 있습니까? 내가 잘못하고 있니? ConstraintLayout에 문제가 있습니까? 글라이드에 문제가 있습니까?

도움을 미리 감사드립니다.

Answer 1

대신에 PreDrawListener을 사용하여 리스너와 함께 glide를 사용하면 문제를 해결할 수 있습니다. 당신이

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

     return true 
    } 
}) 

UPDATE 내가 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) { 
        media_zoom_image.setImageBitmap(resource); 
        startPostponedEnterTransition(); 
        return true; 
       } 
      }) 
      .into(media_zoom_image); 

가있는 것 같습니다. 제발 해봐.

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

전화 가능한 한 빨리 postponeEnterTransition.

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); 
... 
}) 

UPDATE 3

는 이미지를 최적화 할 수 있습니다. 일부 온라인 웹 사이트 또는 도구가 있거나 그래픽 디자이너에게 문의 할 수 있습니다.

부드러운 로딩을 위해 애니메이션 재생 시간을 늘릴 수도 있습니다.

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

glide의 수신기는보기 위해 bitmap을 설정하기 전에 실행됩니다. Picasso와 Glide의 차이점 인 Picasso는 into() 메소드의 콜백 매개 변수를 선택적으로 사용하며 비트 맵을 표시하도록 설정 한 후 onSuccess()을 실행합니다. 따라서 우리의 공유 된 전환을 만드는 실행이 지연되면서 (ImageView # setBitmapImage) 이미 실행되었습니다. 이 상황에서 피카소는 조금 더 빛났다.