0 Swipe screen navigation using Fragment and View pager in android application

Posted by Blogger Name. Category: Advance Android , Fragment

Swiping screens in android application gives a interactive look to application. Using activity its quite difficult as it need some animations. But solution is to use Viewpager (it has default behavior of swipe left right). In ViewPager, attach fragment and its done.

Requirement of this tutorial will be

• ViewPager 
• Multiple fragment
• And one Main fragment Activity

And Result will be like this video

Let move into depth, This result contain few steps to achieve it

Step 1) Make one fragment activity. This activity xml should contain one ViewPager. Using FragmentPagerAdapter we will add all fragment inside a ViewPager

 package com.horizontalscrollviewwithpageindicator;

import java.util.Vector;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.widget.Toast;

import com.fragmentadapter.FragmentAdapter;
import com.fragmentclass.FragmentOne;
import com.fragmentclass.FragmentThree;
import com.fragmentclass.FragmentTwo;

public class FragmentMainActivity extends FragmentActivity {
 @Override
 protected void onCreate(Bundle arg0) {
  super.onCreate(arg0);
  setContentView(R.layout.activity_main);
  Vector<Fragment> fragments = new Vector<Fragment>();
  FragmentOne fragmentOne = new FragmentOne();
  Bundle bundle = new Bundle();
  bundle.putString(
    "url",
    "https://lh6.googleusercontent.com/-jZgveEqb6pg/"
      + "T3R4kXScycI/AAAAAAAAAE0/xQ7CvpfXDzc/s1024/sample_image_01.jpg");
  fragmentOne.setArguments(bundle);
  fragments.add(fragmentOne);

  FragmentTwo fragmenttwo = new FragmentTwo();
  bundle.putString(
    "url",
    "https://lh3.googleusercontent.com/"
      + "-WujkdYfcyZ8/T3R4qrIMGUI/AAAAAAAAAGk/277LIdgvnjg/s1024/sample_image_15.jpg");
  fragmenttwo.setArguments(bundle);
  fragments.add(fragmenttwo);

  FragmentThree fragmenthree = new FragmentThree();
  fragmenthree.setArguments(bundle);
  fragments.add(fragmenthree);

  ViewPager myPager = (ViewPager) findViewById(R.id.myfivepanelpager);
  FragmentAdapter adapter = new FragmentAdapter(
    getSupportFragmentManager(), fragments);
  myPager.setAdapter(adapter);
  myPager.setCurrentItem(0);

  myPager.setOnPageChangeListener(new OnPageChangeListener() {

   @Override
   public void onPageSelected(int arg0) {
    Toast.makeText(FragmentMainActivity.this,
      "Page Selected " + arg0, Toast.LENGTH_LONG).show();
   }

   @Override
   public void onPageScrolled(int arg0, float arg1, int arg2) {
   }

   @Override
   public void onPageScrollStateChanged(int arg0) {
   }
  });
 }
}

Step 2) Create one FragementPagerAdapter to add data (say Fragment here) to swipe this

package com.fragmentadapter;

import java.util.Vector;

import android.os.Parcelable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.view.View;
import android.view.ViewGroup;

public class FragmentAdapter extends FragmentPagerAdapter {

 FragmentManager mManager;
 Vector<Fragment> localFragmentArray;

 public FragmentAdapter(FragmentManager fm, Vector<Fragment> loadFragment) {
  super(fm);
  localFragmentArray = loadFragment;
  mManager = fm;
 }

 @Override
 public Fragment getItem(int arg0) {
  return localFragmentArray.get(arg0);
 }

 @Override
 public int getCount() {
  return localFragmentArray.size();
 }

 @Override
 public void destroyItem(ViewGroup container, int position, Object object) {
  this.notifyDataSetChanged();
 }

 @Override
 public Object instantiateItem(ViewGroup container, int position) {
  return super.instantiateItem(container, position);
 }

 @Override
 public boolean isViewFromObject(View arg0, Object arg1) {
  return super.isViewFromObject(arg0, arg1);
 }

 @Override
 public Parcelable saveState() {
  return super.saveState();
 }

}

Step 3) Create some Fragment Class and add these inside Apdater. Download the code and see how i have added Fragment inside ViewPager

Download Code

Tweet

Komentar →