Android: Fragment Animation

Android: Fragment Animation

Recently, many people are very interested in Fragment animation. I will give you an example. Now, I want to do the following types of Animation:

Pop-up animation: click "up/down" to enter, and click "up/down/left" to pop up. Of course, you can combine them all. In addition, you can also add some changes in transparency, which depends on your performance...

1. Write the xml file of the animation first

All developers know that, in the/res/anim/directory, create xml animation files, such:

Fragment_slide_in_from_bottom.xml

Fragment_slide_in_from_left.xml

Fragment_slide_in_from_right.xml

Fragment_slide_in_from_top.xml

The above is the animation. As for the animation, you only need to flip the values of from and. You all know, don't know, just go to github and clone the address below.

2. When adding Fragment, use the setCustomAnimations method.

Directly paste the code, which is simple and clear.

package com.example.testfragment;import android.os.Bundle;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentTransaction;import android.support.v7.app.ActionBarActivity;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;/** *  * @author Zheng Haibo * @web  http://www.mobctrl.net * */public class MainActivity extends ActionBarActivity {private FragmentManager fragmentManager;private Button northBtn;private Button southBtn;private Button eastBtn;private Button westBtn;private Button popBtn;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);fragmentManager = getSupportFragmentManager();initButton();}private void initButton() {northBtn = (Button) findViewById(R.id.btn_north);southBtn = (Button) findViewById(R.id.btn_south);eastBtn = (Button) findViewById(R.id.btn_east);westBtn = (Button) findViewById(R.id.btn_west);popBtn = (Button) findViewById(R.id.btn_pop);northBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {addNorthFragment();}});southBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {addSouthFragment();}});eastBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {addEastFragment();}});westBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {addWestFragment();}});popBtn.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View arg0) {fragmentManager.popBackStack();}});}private void addNorthFragment() {addFragment(R.anim.fragment_slide_in_from_top,R.anim.fragment_slide_out_to_top,R.anim.fragment_slide_in_from_top,R.anim.fragment_slide_out_to_top, 0xa0ff0000);}private void addSouthFragment() {addFragment(R.anim.fragment_slide_in_from_bottom,R.anim.fragment_slide_out_to_bottom,R.anim.fragment_slide_in_from_bottom,R.anim.fragment_slide_out_to_bottom, 0xa000ff00);}private void addEastFragment() {addFragment(R.anim.fragment_slide_in_from_left,R.anim.fragment_slide_out_to_left,R.anim.fragment_slide_in_from_left,R.anim.fragment_slide_out_to_left, 0xa00000ff);}private void addWestFragment() {addFragment(R.anim.fragment_slide_in_from_right,R.anim.fragment_slide_out_to_right,R.anim.fragment_slide_in_from_right,R.anim.fragment_slide_out_to_right, 0xa0ff00ff);}/** * add the fragment *  * @param arg0 * @param arg1 * @param arg2 * @param arg3 * @param color */private void addFragment(int arg0, int arg1, int arg2, int arg3, int color) {FragmentTransaction ft = fragmentManager.beginTransaction();ft.setCustomAnimations(arg0, arg1, arg2, arg3);MyFragment fragment = new MyFragment();Bundle bundle = new Bundle();bundle.putInt("color", color);fragment.setArguments(bundle);ft.add(R.id.rl_container, fragment);ft.addToBackStack(null);ft.commitAllowingStateLoss();}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.main, menu);return true;}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {int id = item.getItemId();if (id == R.id.action_settings) {return true;}return super.onOptionsItemSelected(item);}}

The GIF effect is so dazzling that I will not post it. You can download it and try it ..

Github: https://github.com/nuptboyzhb/FragmentAnimationDemo

Follow-up questions:

The execution of animation is asynchronous. If you want to monitor the execution of animation, you can rewrite the following methods in fragment:

/** * if you need add animation listener for the fragment * please use this method */@Overridepublic Animation onCreateAnimation(int transit, boolean enter, int nextAnim) {Animation anim;if (enter) {anim = AnimationUtils.loadAnimation(getActivity(),android.R.anim.fade_in);} else {anim = AnimationUtils.loadAnimation(getActivity(),android.R.anim.fade_out);}anim.setAnimationListener(new AnimationListener() {public void onAnimationEnd(Animation animation) {}public void onAnimationRepeat(Animation animation) {}public void onAnimationStart(Animation animation) {}});return anim;}

Then, in the callback, do what you want to do

-------------------------------------------------------------------

For more information, the Android Development Alliance's QQ group: 272209595