CODEWITHSUNDEEP
androidandroid-recyclerviewandroid-transitions
sidecarcat
sidecarcat

Reputation: 472

Ripple effect not working with shared element transition and RecyclerView

I have a shared element transition when a `RecyclerView item click starts a detail Activity, but the ripple effect on the item click is never visible

Start Activity with shared element transition

Intent intent = IntentUtils.createDetailsIntent(InspectionListFragment.this.getContext(), record);
Bundle options = ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(),
                  view, getString(R.string.transition_element)).toBundle();
getActivity().startActivity(intent, options);

I noticed this log message

D/OpenGLRenderer: endAllStagingAnimators on 0x95e86600 (RippleDrawable) with handle 0xaa6c2760

If I remove the transition, the ripple works (and I don't see this message).

Delay Activity start using Handler

If I use a Handler with postDelayed to start the Activity, the results were mixed. I see the ripple, but the transition is not as smooth:

    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            Intent intent = IntentUtils.createDetailsIntent(InspectionListFragment.this.getContext(), record);
            Bundle options = ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(),
                  view, getString(R.string.transition_element)).toBundle();
            getActivity().startActivity(intent, options);
        }
    }, 200);

Using ListView

Note that using a ListView with the same item layout and makeSceneTransitionAnimation works fine. Unfortunately this is not suitable.

The item layout

<LinearLayout
    android:background="?android:attr/selectableItemBackground"
    android:clickable="true"
    android:focusable="true"

Upvotes: 4

Views: 1594

Answers (1)

Lorne Laliberte
Lorne Laliberte

Reputation: 6311

I ran into the same issue when I had an ImageView within the card as the shared element. I was able to resolve it by using the CardView as the source view for the shared element transition (and the ripple effect) instead.

<android.support.v7.widget.CardView
    android:id="@+id/itemCard"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:cardCornerRadius="@dimen/card_corner_radius"
    app:cardElevation="@dimen/card_elevation"
    android:layout_gravity="center"
    android:clickable="true"
    android:onClick="@{onItemClick}"
    android:foreground="?android:attr/selectableItemBackground"
    >

I'm using data binding, but the shared element change was essentially just selecting a different source view:

// before:
//onItemClickListener.onItemClick(view, getAdapterPosition(), getItemId(), Pair.create((View)b.itemImage, "activity_image"));

// after:
onItemClickListener.onItemClick(view, getAdapterPosition(), getItemId(), Pair.create((View)b.itemCard, "activity_image"));

Before this, I also tried using postDelayed with a short delay, but I found that approach added too much delay to the navigation for my liking.

Upvotes: 0

Related Questions