I'm not sure if this is a defect or if I'm doing something wrong here. When I have an ImageView as a shared element between two activities, if the end image view has padding, the image view no longer respects the nav bar at the bottom of the screen. If I move the padding into the container view, or switch to using a margin instead, it works fine.
Video of animation with padding on second imageView: https://www.youtube.com/watch?v=hg4bc6h2u5o&feature=youtu.be
Video of animation without padding on second imageView: https://www.youtube.com/watch?v=pW4hyAfn9Hs&feature=youtu.be
First activity xml:
<LinearLayout
android:id="@+id/title_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="@dimen/header_elevation"
android:orientation="vertical"
android:transitionGroup="true">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="@dimen/header_elevation"
android:background="?attr/colorPrimary" />
...
<!-- other header layouts -->
</LinearLayout>
</LinearLayout>
<View
android:id="@+id/header_title_cover"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/title_container"
android:layout_alignTop="@+id/title_container"
android:background="?android:colorAccent"
android:elevation="@dimen/header_elevation"
android:visibility="invisible" />
<ImageView
android:id="@+id/comic_cover"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:contentDescription="@string/placeholder_image_description"
android:src="@drawable/dog_eat_cat"
/>
Second activity xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<ImageView
android:id="@+id/image"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_centerInParent="true"
android:scaleType="fitXY"
android:paddingTop="80dp"
/>
</RelativeLayout>
First activity:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Slide ts = new Slide(Gravity.TOP);
ts.excludeTarget(android.R.id.statusBarBackground, true)
.excludeTarget(android.R.id.navigationBarBackground, true);
getWindow().setReenterTransition(ts);
getWindow().setExitTransition(ts);
... // set up views
}
public void openActivity() {
imageView.setTransitionName(PagesActivity.SHARED_IMAGE_NAME);
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,
image, PagesActivity.SHARED_IMAGE_NAME);
startActivity(intent, options.toBundle());
}
Second Activity:
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().getEnterTransition().excludeTarget(android.R.id.statusBarBackground, true)
.excludeTarget(android.R.id.navigationBarBackground, true);
getWindow().getReturnTransition().excludeTarget(android.R.id.statusBarBackground, true)
.excludeTarget(android.R.id.navigationBarBackground, true);
... //Load views
imageView.setTransitionName(SHARED_IMAGE_NAME);
}