Duncan Duncan - 4 months ago 81
Android Question

Shared Element Transition not working on first load with Picasso

I am trying to load an image from a URL into an

ImageView
using Picasso.

The image for the shared transition is inside a
CardView
in a
RecyclerView
and the second it just in a LinearLayout.
The first time the request is made the element doesn't animate as picasso needs to load the image into the view, but on subsequent requests it is fine.

How can I ensure that the
ImageView
has been successfully populated before initiating the transition?

Answer

The solution was in using the postponeEnterTransition() and startPostponedEnterTransition() calls to ensure that picasso has finished loading the image into the view before the activity starts.

This is a great blog entry about this.

Below is an example of what you might use in onCreate

ActivityCompat.postponeEnterTransition(this);
Picasso.with(this.getApplicationContext())
    .load("https://goo.gl/oiyTor")
    .noFade()
    .fit()
    .centerInside()
    .error(R.drawable.user_placeholder_error)
    .into(((ImageView) findViewById(R.id.game_view_image)), new Callback() {
        @Override
        public void onSuccess() {
            ActivityCompat.startPostponedEnterTransition(targetActivity);
        }

        @Override
        public void onError() {
            ActivityCompat.startPostponedEnterTransition(targetActivity);
        }
    });
Comments