Переход общих элементов от recyclerView в viewPager к фрагменту

Я создаю приложение, где в основном фрагменте есть viewPager с фрагментами с recyclerView. Каждый элемент recyclerView имеет изображение, которое необходимо сделать общим для фрагмента детализации с анимацией. Проблема в том, что это не работает. Я попытался сделать это без viewPager, используя только один фрагмент с recyclerView, и он работает хорошо. Какая разница в реализации перехода разделяемых элементов в viewPager и без него?

В адаптере я устанавливаю transitionName

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        holder.movieImage.setTransitionName("transition" + position);
 }

В действии я показываю фрагмент детали:

 public void showFragmentWithTransition(Fragment current, Fragment newFragment, String tag, View sharedView, String sharedElementName) {
    FragmentManager fragmentManager = getSupportFragmentManager();
    // check if the fragment is in back stack
    boolean fragmentPopped = fragmentManager.popBackStackImmediate(tag, 0);
    if (fragmentPopped) {
        // fragment is pop from backStack
    } else {

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            current.setSharedElementReturnTransition(TransitionInflater.from(this).inflateTransition(R.transition.default_transition));
            current.setExitTransition(TransitionInflater.from(this).inflateTransition(android.R.transition.no_transition));

            newFragment.setSharedElementEnterTransition(TransitionInflater.from(this).inflateTransition(R.transition.default_transition));
            newFragment.setEnterTransition(TransitionInflater.from(this).inflateTransition(android.R.transition.no_transition));
        }
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
        fragmentTransaction.replace(R.id.fragment_container, newFragment, tag);
        fragmentTransaction.addToBackStack(tag);
        fragmentTransaction.addSharedElement(sharedView, sharedElementName);
        fragmentTransaction.commit();
    }
}

В подробном фрагменте я получаю такие аргументы:

 @Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    Bundle arguments = getArguments();
    if (arguments != null) {
        String transitionName = arguments.getString("transitionName");
        Movie movie = (Movie) arguments.getSerializable("movie");

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            movieImage.setTransitionName(transitionName);
        }

        if (movie != null) {
            if (!TextUtils.isEmpty(movie.getImage()))
                Picasso.with(getActivity()).load("https://i.ytimg.com/vi/qh7LLydY8eo/maxresdefault.jpg").into(movieImage);
            else
                movieImage.setImageDrawable(null);

        }
    }
}

android android-fragments android-viewpager shared-element-transition
person Александр Шевчук    schedule 08.02.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

У меня была такая же проблема. Стандартные переходы общих элементов не работают между страницами ViewPager.

Поэтому я написал библиотеку SharedElement ViewPager . Он работает как для переходов, вызванных событиями onClick() (например, viewPager.setCurrentItem(x)), так и для слайдов страниц, вызванных пользователем. Анимация привязана к движению пальцев.

Посмотри.

демонстрационный gif SharedElementPageTransformer

использование

  1. Добавьте весь фрагмент из вашего ViewPager в список в том же порядке.
        ArrayList<Fragment> fragments = new ArrayList<>();
        fragments.add(hello_fragment);
        fragments.add(small_picture_fragment);
  1. Создайте SharedElementPageTransformer предположительно в Activity.onCreate().
    это относится к действию:
        SharedElementPageTransformer transformer =
                new SharedElementPageTransformer(this,  fragments);
  1. Добавьте общий переход, передав пары идентификаторов просмотра, которые необходимо связать вместе.
        transformer.addSharedTransition(R.id.smallPic_image_cat, R.id.bigPic_image_cat);
  1. Установите для нашего transformer значение pageTransformer ViewPager AND onPageChangeListener.
        viewPager.setPageTransformer(false, transformer);
        viewPager.addOnPageChangeListener(transformer);

Единственное, что вам может понадобиться, это создать дополнительный ImageView во фрагменте RecyclerView поверх ImageView, который нужно анимировать. Затем вы можете перейти от него к ImageView на целевой странице ViewPager.

person Kirill Gerasimov    schedule 02.05.2019