Thursday, January 16, 2014

How to Swipe the Images in Android

3 comments :
Hi,

  This is an example for swipe the image in android using pager adapter

1. create a xml file called activity_main.xml

activity_main.xml:

 <RelativeLayout 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"
    tools:context=".MainActivity" >

     <android.support.v4.view.ViewPager
          android:id="@+id/view_pager"
          android:layout_width="match_parent"
          android:layout_height="match_parent" />

</RelativeLayout>


2. create  a Java class called MainActivity.class

using Imageadapter class create view for page adapter and override a method called instantiateItem

MainActivity.class :

package com.example.imageswipe;
import android.os.Bundle;
import android.app.Activity;
import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
public class MainActivity extends Activity {
 @Override
 public void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.activity_main);

   ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
   ImageAdapter adapter = new ImageAdapter(this);
   viewPager.setAdapter(adapter);
 }
 public class ImageAdapter extends PagerAdapter {
 Context context;
 private int[] GalImages = new int[] {
 R.drawable.img1,
 R.drawable.img2,
 R.drawable.img3,
 R.drawable.img4,
 R.drawable.img5,
 R.drawable.img6,
 R.drawable.img7
 };
                ImageAdapter(Context context)
 {
 this.context=context;
 }
 @Override
 public int getCount() {
 return GalImages.length;
 }

 @Override
 public boolean isViewFromObject(View view, Object object) {
 return view == ((ImageView) object);
 }

 @Override
 public Object instantiateItem(ViewGroup container, int position) {
 ImageView imageView = new ImageView(context);
 int padding = context.getResources().getDimensionPixelSize(R.dimen.activity_horizontal_margin);
 imageView.setPadding(padding, padding, padding, padding);
 imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
 imageView.setImageResource(GalImages[position]);
 ((ViewPager) container).addView(imageView, 0);
 return imageView;
 }

 @Override
 public void destroyItem(ViewGroup container, int position, Object object) {
 ((ViewPager) container).removeView((ImageView) object);
 }
 }
}

3. Here the output is shown below

           
       


3 comments :

  1. Hi I need coding exactly like our gallery it look likes grid view when we select it become single view den I need swipe image left and right

    ReplyDelete
    Replies
    1. Check this out

      http://www.androidhive.info/2013/09/android-fullscreen-image-slider-with-swipe-and-pinch-zoom-gestures/

      Delete