Search code examples
androidanimationandroid-viewpagerslideshow

how to show/start animation in each page of viewPager in android?


I want to show some images as very simple animation in viewPager(each page of ViewPager has different animation). My ViewPager code:

public class Sport2Activity extends AppCompatActivity {
private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_sport1);

    mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());

    mViewPager = (ViewPager) findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);


   // tab layout for circle of view pager
    TabLayout tabLayout = (TabLayout) findViewById(R.id.tabDots);
    tabLayout.setupWithViewPager(mViewPager);

}

//********Adapter class*********************************************************
public class SectionsPagerAdapter extends FragmentPagerAdapter {
    public SectionsPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0:
                return new EyeSportFragment();
                //return FragmentWithOneImage.newInstance("Fragment 1", R.drawable.android_1);
            case 1:
                return new FingerSportFragment();
            case 2:
                return new NeckSportFinger();
            case 3:
                return new WristSportFragment();
            case 4:
                return new ShoulderSportFragment();
            case 5:
                return new BackSportFragment();
            case 6:
                return new WaterFragment();
            default:
                return null;
        }
    }

    @Override
    public int getCount() { // Show 3 total pages.
        return 7;
    }

and animation class:

    public class BackSportFragment extends Fragment {
    private ImageView sportShowing_img;

    public BackSportFragment() {
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_sport_show, container, false);
        sportShowing_img= (ImageView) view.findViewById(R.id.sport_img);



        AnimationDrawable animation = new AnimationDrawable();
        animation.addFrame(getResources().getDrawable(R.drawable.ic_action_hardware_keyboard_arrow_left), 1000); //1 Sec
        animation.addFrame(getResources().getDrawable(R.drawable.ic_action_action_home), 1000); //1 Sec
        animation.addFrame(getResources().getDrawable(R.drawable.cast_ic_notification_1), 1000); //1 Sec
        animation.addFrame(getResources().getDrawable(R.drawable.common_google_signin_btn_icon_light), 1000); //1 Sec
        animation.setOneShot(true);

        sportShowing_img.setBackgroundDrawable(animation);
        animation.start();

        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                sportShowing_img.setVisibility(View.INVISIBLE);
            }
        }, 10000);
        return view;
    }

}

how can I do ViewPager that with clicking/scrolling on each page, its animation starts?


Solution

  • Implement OnPageChangeListener [Callback interface for responding to changing state of the selected page] interface on your Activity

    Define the onPageSelected() method like below:

    @Override
    public abstract void onPageSelected (int position){
        Toast.makeText(getActivity(),"In the page " + position, 
                Toast.LENGTH_SHORT).show();
    // depends on the position display your relevant animation
    }
    

    And don't forget to call

    viewPager.setOnPageChangeListener(this);