Android：使用Fragment实现共享元素转场

Question

我正在处理一个项目，需要使用共享元素实现片段之间的过渡效果。我已经尝试了几乎所有方法，但是转换效果并没有生效。

我有一个名为TimelineActivity的活动，其中包含两个片段：动态添加到TimelineActivity的ListFragment和DetailFragment。

每当我在ListFragment中的ListView上点击一个项目时，该片段就会被DetailFragment替换。

@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

    DetailFragment fragment = DetailFragment.newInstance();

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        fragment.setSharedElementEnterTransition(new ChangeBounds().setDuration(2000));
        fragment.setEnterTransition(new ChangeBounds().setDuration(2000));
        setExitTransition(new ChangeBounds().setDuration(2000));
        fragment.setSharedElementReturnTransition(new ChangeBounds().setDuration(2000));
    }

    FragmentTransaction ft = getActivity().getSupportFragmentManager().beginTransaction();

    fragment.setAllowEnterTransitionOverlap(true);
    fragment.setAllowReturnTransitionOverlap(true);

    ft.replace(R.id.timeline_container, fragment);
    ft.addSharedElement(view.findViewById(R.id.transition), "selectClientTransition");
    ft.addToBackStack(null);

    // Start the animated transition.
    ft.commit();
}

在我的listview_row.xml中，这是listview的布局，我有以下内容：

   <LinearLayout
   android:id="@+id/transition"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:background="#FFF"
   android:orientation="vertical"
   android:padding="10dp"
   android:transitionName="selectClientTransition">
   </LinearLayout>

在我的fragment_detail.xml文件中，我有以下内容：

<LinearLayout
                android:id="@+id/transition"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#FFF"
                android:orientation="vertical"
                android:padding="10dp"
                android:transitionName="selectClientTransition"
                android:weightSum="12">
</LinearLayout>

我将这个添加到了我的App主题中

<item name="android:windowContentTransitions">true</item>

为了清楚起见，这些片段被替换，这很正常，但没有改变边界效果。我真的很困扰，所以任何建议都受欢迎。

提前感谢。

- jeroenvdbergh

Answer 1

我刚刚发现，只有在使用自定义的ArrayAdapter且其中有超过1个元素时才会出现问题。如果我将ListView切换为普通的String数组，则一切正常；同样地，如果我的ListView中只有一个元素且使用自定义的ArrayAdapter，则一切正常。

- jeroenvdbergh

Answer 2

您需要为列表中的每个元素设置唯一的转换名称。这是一个例子：

在适配器的getView方法中设置转换名称：

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    // your code...

    sharedView.setTransitionName("transition_name_" + position);
}

在onItemClick方法中发送转换名称到DetailFragment：

@Override
public void onListItemClick(ListView l, View v, int position, long id) {
    DetailFragment fragment = DetailFragment.newInstance();
    View sharedView = v.findViewById(R.id.shared_view);

    Bundle arguments = new Bundle();
    arguments.putString(DetailFragment.TRANSITION_NAME, sharedView.getTransitionName());
    fragment.setArguments(arguments);

    // the rest of your code (replacing fragments, etc)...
}

在DetailFragment的onCreateView方法中，将过渡名称设置为视图。

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    // your code...

    View sharedView = inflatedLayout.findViewById(R.id.shared_view);
    sharedView.setTransitionName(getArguments().getString(TRANSITION_NAME))
}

- Erdenian