SCREEN TRANSITIONS INANDROID
GO FROM A TO B IN STYLECreated by from Andrei Diaconu Android Iasi
CODE ON GITHUBhttps://github.com/andreidiaconu/transitions-animate-demo
Presentation (with working video) at https://andreidiaconu.github.io/transitions-animate-demo
bit.ly/screen-anim
INITIAL SETUPACTIVITY A
grid.setOnItemClickListener( DetailsActivity1.start(GridActivity1.this, imageUrl);)
ACTIVITY Bstatic void start(...,String imageUrl) intent = new Intent(...); void onCreate() Picasso .with(this) .load(imageUrl) .into(imageView);
SEND POSITIONACTIVITY A
void onItemClick() DetailsActivity2.start(GridActivity2.this, imageUrl, view);
ACTIVITY Bstatic void start(..., View initialView) ... initialView.getGlobalVisibleRect(initialPosition); intent.putExtra("initialPosition", initialPosition);
startActivity(intent);
REMOVE DEFAULTSSTYLES.XML
<style name="AppTheme.Transparent">
</style>
<item name="android:windowBackground">rtransparent</item> <item name="android:windowIsTranslucent">true</item>
STARTING ACTIVITYfrom.overridePendingTransition(0,0);
WAIT FOR MEASUREMENTSrunAnimations() imageView .getViewTreeObserver() .addOnPreDrawListener( boolean onPreDraw() actuallyRunAnimations(); removeOnPreDrawListener(this); return false; );
SET INITIAL POSITIONvoid actuallyRunAnimations() Rect initialPosition = getIntent().getParcelableExtra(...); imageView.getGlobalVisibleRect(endPosition);
//use initialPosition, endPosition imageView.setScaleY(...); imageView.setScaleX(...); imageView.setTranslationY(...); imageView.setTranslationX(...);
ANIMATE THINGS BACK TO NORMALimageView.animate() .scaleX(1) .scaleY(1) .translationX(0) .translationY(0) .setListener( void onAnimationEnd() actionbar.animate() .translationY(0) .start(); ).start();
PREVENT FINISH()@Overridepublic void finish() if (canAnimateBack) runAnimationsBackwards(); else super.finish();
DELAY FINISH()imageView.animate() .scaleX(...) .scaleY(...) .translationX(...) .translationY(...) .setListener( void onAnimationEnd() DetailsActivity6.super.finish(); overridePendingTransition(0, 0); ).start();
STYLES.XML<style name="AppTheme.Transitions"> <item name = "windowActivityTransitions" >true</item></style>
INTENT BUNDLEActivityOptionsCompat .makeSceneTransitionAnimation(from, initialView, "shared_image") .toBundle();
STAGE 8 - MAGICContent exit transition for AContent enter transition for BDetaults for exiting B and reentering A
EXIT + ENTER CONTENT TRANSITIONSACTIVTY A
getWindow().setExitTransition(new Explode());
ACTIVTY BgetWindow().setEnterTransition(new Slide());
CODE ON GITHUBhttps://github.com/andreidiaconu/transitions-animate-demo
Presentation (with working video) at https://andreidiaconu.github.io/transitions-animate-demo
bit.ly/screen-anim