The animation effect diagram is as follows:
The transition effect of one of these activity (pictured above) is described below. The current two activity has a common UI element, which is appropriate for this animation effect, giving the user a consistent experience.
Implementation steps
1. Create a new Android application project with two activity in it;
2. The following is the mainactivity code and XML layout;
The code and layout are very simple. Explain the code for the onclick () method.
The second parameter of the Makescenetransactionanimation () method is used to tell which is the specified common UI element, and here is the Shareview.
The third parameter of the Makescenetransactionanimation () method is "robot", and the value of the Android:transactionname= "robot" in the XML layout corresponds to one by one.
Package com.example.garena.myapplication;
Import Android.app.ActionBar;
Import android.app.Activity;
Import android.app.ActivityOptions;
Import android.content.Intent;
Import Android.os.Bundle;
Import Android.view.View;
public class Mainactivity extends activity {
@Override
protected void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.activity_main);
Final View Shareview = Findviewbyid (R.id.share_element_image_view);
Shareview.setonclicklistener (New View.onclicklistener () {
@Override
public void OnClick (View v) {
Intent Intent = new Intent (mainactivity.this, Secondactivity.class);
Activityoptions options = activityoptions
. Makescenetransitionanimation (Mainactivity.this, Shareview, "robot");
StartActivity (Intent, Options.tobundle ());
}
});
Actionbar Actionbar = Getactionbar ();
if (Actionbar!= null) {
Actionbar.settitle (r.string.first_activity);
}
}
}
<linearlayout 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"
android:orientation= "Vertical"
android:paddingbottom= "@dimen/activity_vertical_margin"
android:paddingleft= "@dimen/activity_horizontal_margin"
android:paddingright= "@dimen/activity_horizontal_margin"
android:paddingtop= "@dimen/activity_vertical_margin"
Tools:context= ". Mainactivity ">
<textview
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:text= "@string/hello_world"/>
<imageview
Android:id= "@+id/share_element_image_view"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:src= "@drawable/ic_launcher"
Android:transitionname= "Robot"/>
</LinearLayout>
3. The following is the code and layout of the secondactivity;
In the OnClick () method, call Finishaftertransaction () to finish the activity.
In the XML layout, it is also necessary to use Android:transactionname= "Roboto" to identify common UI elements.
Package com.example.garena.myapplication;
Import Android.app.ActionBar;
Import android.app.Activity;
Import Android.os.Bundle;
Import Android.view.View;
public class Secondactivity extends activity {
@Override
protected void OnCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (r.layout.second_activity);
Actionbar Actionbar = Getactionbar ();
if (Actionbar!= null) {
Actionbar.settitle (r.string.second_activity);
}
View btnback = Findviewbyid (R.id.btn_back);
Btnback.setonclicklistener (New View.onclicklistener () {
@Override
public void OnClick (View v) {
Finishaftertransition ();
}
});
}
}
<?xml version= "1.0" encoding= "Utf-8"?>
<linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android"
Android:layout_width= "Match_parent"
android:layout_height= "Match_parent"
android:gravity= "Center"
android:orientation= "Vertical" >
<imageview
Android:id= "@+id/title_icon_image_view"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:src= "@drawable/ic_launcher"
Android:transitionname= "Robot"/>
<button
Android:id= "@+id/btn_back"
Android:layout_width= "Wrap_content"
android:layout_height= "Wrap_content"
android:text= "@string/back"/>
</LinearLayout>
4. Operation effect (pictured above);
From the final operation of the effect of the picture can be seen, click on the small robot icon into the secondactivity, you can see the small robot icon to move to secondactivity this small robot icon position.
Click on the Secondactivity Back button, the small robot icon will be moved to the Mainactivity Small robot icon position.