SHOWING IMAGES IN VIEW PAGER

Screen slides are transitions between one entire screen to another and are common with UIs like setup wizards or slideshows. This lesson shows you how to do screen slides with a ViewPager provided by the support library. ViewPagers can animate screen slides automatically. Here's what a screen slide looks like that transitions from one screen of content to the next:

In this tutorial I am showing a list of images in a custom pager adapter.For full code we can comment below.I am sharing the main activity code with comments for helping you out at each step.

Below is the code snippet for your main activity .

	package com.roy.airteldemo;
	import android.content.Context;
	import android.os.Bundle;
	import android.os.Handler;
	import android.os.Looper;
	import android.os.PersistableBundle;
	import android.support.design.widget.FloatingActionButton;
	import android.support.design.widget.Snackbar;
	import android.support.v4.view.PagerAdapter;
	import android.support.v4.view.ViewPager;
	import android.support.v7.app.AppCompatActivity;
	import android.support.v7.widget.Toolbar;
	import android.util.Log;
	import android.view.LayoutInflater;
	import android.view.View;
	import android.view.Menu;
	import android.view.MenuItem;
	import android.view.ViewGroup;
	import android.widget.Button;
	import android.widget.ImageView;
	import android.widget.LinearLayout;
	import android.widget.RelativeLayout;
	import android.widget.TextView;
	import android.widget.Toast;
	import com.roy.http.HTTPResponseListener;
	import com.roy.http.HttpGet;
	import com.roy.utils.AsyncThreadPool;
	import com.roy.utils.ImageLoader;
	import com.roy.utils.Util;
	import com.roy.vo.ImageVO;
	import org.json.JSONArray;
	import org.json.JSONException;
	import org.json.JSONObject;
	import java.util.ArrayList;
	import butterknife.Bind;
	import butterknife.ButterKnife;
	public class MainActivity extends AppCompatActivity implements HTTPResponseListener {
	@Bind(R.id.pager)
	ViewPager mViewPager;
	@Bind(R.id.progress_bar)
	RelativeLayout mBar;
	@Bind(R.id.back_button)
	Button btnBack;
	@Bind(R.id.foward_button)
	Button btnForward;
	@Bind(R.id.text_number)
	TextView tvCount;
	private CustomPagerAdapter mCustomPagerAdapter;
	public Handler mUIHandler;
	private AsyncThreadPool mThreadPool;
	private ArrayList<ImageVO> mImageList = new ArrayList<ImageVO>();
	ImageLoader loader;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.activity_main);
	ButterKnife.bind(this);
	Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
	setSupportActionBar(toolbar);
	mUIHandler = new Handler(Looper.getMainLooper());
	AsyncThreadPool.init(mUIHandler);
	mThreadPool = AsyncThreadPool.get();
	fetchImages(); //fetching images -used asynctask for background processing
	// button for swiping left and right views
	btnBack.setOnClickListener(new View.OnClickListener() {
	@Override
	public void onClick(View v) {
	if (mViewPager.getCurrentItem() >= 0) {
	mViewPager.setCurrentItem(getItem(-1), true);
	}
	}
	});
	btnForward.setOnClickListener(new View.OnClickListener() {
	@Override
	public void onClick(View v) {
	if (mViewPager.getCurrentItem() <= mImageList.size() - 1) {
	mViewPager.setCurrentItem(getItem(+1), true);
	}
	}
	});
	mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
	public void onPageScrollStateChanged(int state) {
	}
	public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
	}
	public void onPageSelected(int position) {
	int count = position + 1;
	tvCount.setText(count + " " + "of" + " " + mImageList.size());
	}
	});
	}
	class CustomPagerAdapter extends PagerAdapter { //custom adpter for showing images
	Context mContext;
	LayoutInflater mLayoutInflater;
	public CustomPagerAdapter(Context context, ArrayList<ImageVO> mList) {
	mContext = context;
	mImageList = mList;
	loader = new ImageLoader(mContext);
	mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
	}
	@Override
	public int getCount() {
	return mImageList.size();
	}
	@Override
	public boolean isViewFromObject(View view, Object object) {
	return view == ((LinearLayout) object);
	}
	@Override
	public Object instantiateItem(ViewGroup container, final int position) {
	View itemView = mLayoutInflater.inflate(R.layout.pager_item, container, false);
	ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
	try {
	JSONObject obj = (mImageList.get(position).getMedia());
	String url = obj.getString("m");
	loader.DisplayImage(url, imageView);
	} catch (Exception e) {
	Log.e("log exception", "" + e.getMessage());
	}
	container.addView(itemView);
	return itemView;
	}
	@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
	container.removeView((LinearLayout) object);
	}
	}
	private void fetchImages() {
	if (Util.haveNetworkConnection(this)) {
	mBar.setVisibility(View.VISIBLE);
	String url = "http://api.flickr.com/services/feeds/photos_public.gne?format=json";
	HttpGet getAllLogs = new HttpGet(this, url);
	getAllLogs.run(url);
	} else {
	Toast.makeText(this, "No network connectivity", Toast.LENGTH_SHORT)
	.show();
	}
	}
	@Override
	public Boolean setGetStatus(JSONObject finalResult, String getUrl, int responseCode) { //make an interface for updating ui on post execute
	mBar.setVisibility(View.GONE);
	if (finalResult != null) {
	try {
	if (finalResult.has("items")) {
	JSONArray jsonArray = finalResult.getJSONArray("items");
	for (int i = 0; i < jsonArray.length(); i++) {
	JSONObject jsonObject = jsonArray.getJSONObject(i);
	ImageVO appObj = new ImageVO(jsonObject);
	mImageList.add(appObj);
	}
	if (mImageList != null && !mImageList.isEmpty()) {
	mCustomPagerAdapter = new CustomPagerAdapter(this, mImageList);
	mViewPager.setAdapter(mCustomPagerAdapter);
	int count = mViewPager.getCurrentItem() + 1;
	tvCount.setText(count + " " + "of" + " " + mImageList.size());
	Log.e("logtag", "" + mImageList.size());
	}
	}
	} catch (JSONException e) {
	}
	}
	return false;
	}
	private int getItem(int i) {
	return mViewPager.getCurrentItem() + i;
	}
	}

view raw gistfile1.txt hosted with ❤ by GitHub