I have MainActivity which show two fragment with shared image.
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActivityCompat.postponeEnterTransition(this);
if (savedInstanceState == null) {
Fragment firstFragment = new FirstFragment();
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.add(R.id.frame, firstFragment);
transaction.commit();
}
}
public void showPhoto(View sharedView, String sharedName) {
Fragment listFragment = getSupportFragmentManager().findFragmentById(R.id.frame);
Fragment detailFragment = new SecondFragment();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
listFragment.setSharedElementReturnTransition(new ChangeImageTransform());
listFragment.setExitTransition(TransitionInflater.from(this)
.inflateTransition(android.R.transition.explode));
detailFragment.setSharedElementEnterTransition(new ChangeImageTransform());
detailFragment.setEnterTransition(TransitionInflater.from(this)
.inflateTransition(android.R.transition.explode));
}
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.addSharedElement(sharedView, sharedName);
transaction.replace(R.id.frame, detailFragment);
transaction.addToBackStack("viewer");
transaction.commit();
}
}
First fragment:
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_first, container, false);
final ImageView image = (ImageView) view.findViewById(R.id.image_small);
image.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
((MainActivity) getActivity()).showPhoto(image, "name");
}
});
ViewCompat.setTransitionName(image, "name");
return view;
}
Fist fragment layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:transitionName="name"
android:id="@+id/image_small"
android:layout_width="200dp"
android:scaleType="centerCrop"
android:layout_height="200dp"
android:layout_centerInParent="true"
android:src="@drawable/image"/>
</RelativeLayout>
Second fragment:
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.fragment_second, container, false);
ImageView image = (ImageView) view.findViewById(R.id.image_big);
ViewCompat.setTransitionName(image, "name");
return view;
}
Second fragment layout:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/image_big"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/image"
android:transitionName="name"/>
</FrameLayout>
And I have next animation: https://youtu.be/pRYHC59sSL8
But I want to make animation like this: https://developer.android.com/design/material/videos/ContactsAnim.webm
What I am doing wrong?
Phone with Android 5.0.
