共有要素の移行は、デフォルトでアンドロイドによってサポートされています。
1.ウィンドウの内容の移行をイネーブル
あなたのstyles.xmlファイルにウィンドウの内容のトランジションを有効にする:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:windowContentTransitions">true</item>
...
</style>
2.共通の遷移の名前の割り当て
を共通の割り当て両方のレイアウトの共有要素への移行名。 android:transitionName属性を使用します。
その場合アンドロイドを問わない
<LinearLayout
...>
<ImageView
android:id="@+id/ivProfile"
android:transitionName="profile"
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="380dp" />
...
</LinearLayout>
注意こと:
DetailActivity.xmlで
<android.support.v7.widget.CardView
...>
<ImageView
android:id="@+id/ivProfile"
android:transitionName="profile"
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="160dp" />
...
</android.support.v7.widget.CardView>
:MainActivity.xmlでIDが異なる場合やレイアウト階層のソースとターゲットビューが存在する場合。
3.スタート活性
源からこれらの共有要素とビューの束を指定することにより、標的活性を起動
。
Intent intent = new Intent(this, DetailsActivity.class);
// Pass data object in the bundle and populate details activity.
intent.putExtra(DetailsActivity.EXTRA_CONTACT, contact);
ActivityOptionsCompat options = ActivityOptionsCompat.
makeSceneTransitionAnimation(this, (View)ivProfile, "profile");
startActivity(intent, options.toBundle());
それはそれです!ソースビューと遷移名を指定すると、ソース階層内に同じ遷移名を持つ複数のビューがあっても、本質的にアニメーションを開始するための正しいビューを選択することができます。
2番目のアクティビティを終了したときにシーントランジションアニメーションを逆にするには、Activity.finish()
の代わりにActivity.supportFinishAfterTransition()
メソッドを呼び出します。また、あなたは、このような場合のためのツールバー/アクションバーにあるホームボタンの動作をオーバーライドする必要があります。
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
// Respond to the action bar's Up/Home button
case android.R.id.home:
supportFinishAfterTransition();
return true;
}
return super.onOptionsItemSelected(item);
}
4.複数の共有要素
時には、あなたはから複数の要素をアニメーション化したい場合がありますソースビュー階層。これは、ソースとターゲットのレイアウトXMLファイルで異なる遷移名を使用することで実現できます。
Intent intent = new Intent(context, DetailsActivity.class);
intent.putExtra(DetailsActivity.EXTRA_CONTACT, contact);
Pair<View, String> p1 = Pair.create((View)ivProfile, "profile");
Pair<View, String> p2 = Pair.create(vPalette, "palette");
Pair<View, String> p3 = Pair.create((View)tvName, "text");
ActivityOptionsCompat options = ActivityOptionsCompat.
makeSceneTransitionAnimation(this, p1, p2, p3);
startActivity(intent, options.toBundle());
注:デフォルトではandroid.util.Pairがインポートされますが、我々は代わりにandroid.support.v4.util.Pairクラスを選択します。
共有要素間で過度の遷移をしないように注意してください。 1つの画面から別の画面に複数の共有要素が含まれている場合と含まれていない場合がありますが、共有要素が多すぎると、アニメーションが邪魔になります。
5カスタマイズ共有要素移行
アンドロイドLにおいて、ChangeBounds、ChangeTransform、ChangeImageTransform、及びChangeClipBoundsの組み合わせに要素転移デフォルトを共有しました。これはほとんどの典型的なケースでうまくいきます。ただし、この動作をカスタマイズしたり、独自のカスタムトランジションを定義することもできます。
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- enable window content transitions -->
<item name="android:windowContentTransitions">true</item>
<!-- specify enter and exit transitions -->
<!-- options are: explode, slide, fade -->
<item name="android:windowEnterTransition">@transition/change_image_transform</item>
<item name="android:windowExitTransition">@transition/change_image_transform</item>
<!-- specify shared element transitions -->
<item name="android:windowSharedElementEnterTransition">
@transition/change_image_transform</item>
<item name="android:windowSharedElementExitTransition">
@transition/change_image_transform</item>
</style>
次のように、この例でchange_image_transform遷移が定義されている:
<!-- res/transition/change_image_transform.xml -->
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
<changeImageTransform/>
</transitionSet>
、代わりに、実行時にウィンドウのコンテンツ遷移をイネーブルWindow.requestFeature()
メソッドを呼び出す:
// inside your activity (if you did not enable transitions in your theme)
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
// set an enter transition
getWindow().setEnterTransition(new Explode());
// set an exit transition
getWindow().setExitTransition(new Explode());
を