fullscreen ImageSwitcher without gallery in Android

Question

I'm trying to build an application in android, in one of my activities I wanna show full screen images and make them slide left and right by sliding finger on the pictures.

I have tried basic gallery view and Image Switcher but I couldn't handle the touch event to have a sliding effect as like in custom android gallery but without thumbnails.

Here is my simple image switcher xml and activity class. I would be very appreciated if anybody shows me a way or edits my code below. Thanks in advance...

layout xml:

 <?xml version="1.0" encoding="utf-8"?>
    <ImageSwitcher 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/imageSwitcher"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:onClick="imageClick"
    android:src="@drawable/ic_launcher"
    android:keepScreenOn="true">
    </ImageSwitcher>

code :

public class GalleryActivity extends Activity implements ViewFactory {

    private ImageSwitcher imageSwitcher ;


    @Override  
    public void onCreate(Bundle savedInstanceState) {  
         super.onCreate(savedInstanceState);  
         setContentView(R.layout.activities);  

         imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
         imageSwitcher.setFactory(this);
         imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));
         imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));

         imageSwitcher.setImageResource(R.drawable.menu);

         imageSwitcher.setOnTouchListener(new OnTouchListener() {

            public boolean onTouch(View v, MotionEvent event) {
                findViewById(R.drawable.menu);
                imageSwitcher.addView((ImageSwitcher) findViewById(R.drawable.etkinlik));
                imageSwitcher.showNext();

                return false;
            }
        });
    }  
        public View makeView() {  
        ImageView iView = new ImageView(this);
        iView.setScaleType(ImageView.ScaleType.FIT_CENTER);
        iView.setLayoutParams(new
                    ImageSwitcher.LayoutParams(
                                LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
        iView.setBackgroundColor(0xFF000000);
        return iView;
    }
}  

After editing a bit of @imran khan 's solution , here is the code which works quite well.

SOLUTION:

ImageSwitcher imageSwitcher ;

Integer[] imageList = {
        R.drawable.gallery,
        R.drawable.menu,
        R.drawable.promotion,
        R.drawable.info,
        R.drawable.activities       
};

int curIndex=0;
int downX,upX;

@Override  
public void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.activities);  

     imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
     imageSwitcher.setFactory(this);
     imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_in));
     imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,android.R.anim.fade_out));

     imageSwitcher.setImageResource(imageList[curIndex]);
     imageSwitcher.setOnTouchListener(new OnTouchListener() {
     @Override
     public boolean onTouch(View v, MotionEvent event) {

         if (event.getAction() == MotionEvent.ACTION_DOWN) {
             downX = (int) event.getX(); 
             Log.i("event.getX()", " downX " + downX);
             return true;
         } 

         else if (event.getAction() == MotionEvent.ACTION_UP) {
             upX = (int) event.getX(); 
             Log.i("event.getX()", " upX " + downX);
             if (upX - downX > 100) {

                 //curIndex  current image index in array viewed by user
                 curIndex--;
                 if (curIndex < 0) {
                     curIndex = imageList.length-1;
                 }

                 imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(GalleryActivity.this,R.anim.slide_in_left));
                 imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(GalleryActivity.this,R.anim.slide_out_right));

                 imageSwitcher.setImageResource(imageList[curIndex]);
                 //GalleryActivity.this.setTitle(curIndex);
             } 

             else if (downX - upX > -100) {

                 curIndex++;
                 if (curIndex > 4) {
                     curIndex = 0;
                 }

                 imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(GalleryActivity.this,R.anim.slide_in_right));
                 imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(GalleryActivity.this,R.anim.slide_out_left));

                 imageSwitcher.setImageResource(imageList[curIndex]);
                 //GalleryActivity.this.setTitle(curIndex);
             }
                 return true;
             }
             return false;
         }
     });
}
@Override
public View makeView() {
    ImageView i = new ImageView(this);  
    i.setScaleType(ImageView.ScaleType.FIT_CENTER);
    return i;
}

Answer 1

try this way:

imageSwitcher1 = (ImageSwitcher) findViewById(R.id.imageSwitcher1);
imageSwitcher1.setFactory(this);
imageSwitcher1.setInAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_in));
imageSwitcher1.setOutAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_out));
imageSwitcher1.setImageResource(R.drawable.girl2);
imageSwitcher1.setOnTouchListener(new OnTouchListener() { 
        @Override 
        public boolean onTouch(View v, MotionEvent event) { 
            if (event.getAction() == MotionEvent.ACTION_DOWN) { 
                downX = (int) event.getX();
                return true; 
            } else if (event.getAction() == MotionEvent.ACTION_UP) { 
                upX = (int) event.getX();
                if (upX - downX > 100) {
                imageSwitcher1.setInAnimation(AnimationUtils.loadAnimation(ShowPhotoActivity.this,
                android.R.anim.slide_in_left));
                mageSwitcher1.setOutAnimation(AnimationUtils.loadAnimation(ShowPhotoActivity.this,
                android.R.anim.slide_out_right));
                imageSwitcher1.setImageResource(R.drawable.girl1);
                } else if (downX - upX > 100)//                { 
                imageSwitcher1.setInAnimation(AnimationUtils.loadAnimation(ShowPhotoActivity.this,
                android.R.anim.slide_in_left));
                imageSwitcher1.setOutAnimation(AnimationUtils.loadAnimation(ShowPhotoActivity.this,
                android.R.anim.slide_out_right));
                imageSwitcher1.setImageResource(R.drawable.girl2);
                } 
                return true; 
            } 
            return false; 
        } 
    };

and if u have image array then try this:

imgSwitcher.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                // TODO Auto-generated method stub
                if (event.getAction() == MotionEvent.ACTION_DOWN) {
                    downX = (int) event.getX(); 
                    Log.i("event.getX()", " downX " + downX);
                    return true;
                } else if (event.getAction() == MotionEvent.ACTION_UP) {
                    upX = (int) event.getX(); 
                    Log.i("event.getX()", " upX " + downX);
                    if (upX - downX > 100) {
                        imgSwitcher.setInAnimation(AnimationUtils
                        .loadAnimation(firstActivity.this,
                         android.R.anim.slide_in_left));
                        imgSwitcher.setOutAnimation(AnimationUtils
                         .loadAnimation(firstActivity.this,
                         android.R.anim.slide_out_right));
                         //curIndex  current image index in array viewed by user
                        curIndex--;
                        if (curIndex < 0) {
                            curIndex = 5;
                        }
                        //IMAGE_LIST :-image list array
                        imgSwitcher.setImageResource(IMAGE_LIST[curIndex]);
                        firstActivity.this.switchTitle(curIndex);
                    } else if (downX - upX > 100) { 
                        imgSwitcher.setInAnimation(AnimationUtils
                        .loadAnimation(firstActivity.this,
                        R.anim.slide_out_left));
                        imgSwitcher.setOutAnimation(AnimationUtils
                        .loadAnimation(firstActivity.this,
                        R.anim.slide_in_right));
                        curIndex++;
                        if (curIndex > 5) {
                            curIndex = 0;
                        }
                        imgSwitcher.setImageResource(IMAGE_LIST[curIndex]);
                        firstActivity.this.switchTitle(curIndex);
                    }
                    return true;
                }
                return false;
            }
        });

Answer 2

I would recommend using the compatability library and then use the view pager. That way Android will be doing all the heavy lifting for you and all you will have to do is tell the ViewPager how many images you have and what they are.

Here is an example from google that I changed a bit for you.

public class FragmentPagerSupport extends FragmentActivity {
static final int NUM_ITEMS = 10;

MyAdapter mAdapter;

ViewPager mPager;

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

    mAdapter = new MyAdapter(getSupportFragmentManager());

    mPager = (ViewPager)findViewById(R.id.pager);
    mPager.setAdapter(mAdapter);

    // Watch for button clicks.
    Button button = (Button)findViewById(R.id.goto_first);
    button.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            mPager.setCurrentItem(0);
        }
    });
    button = (Button)findViewById(R.id.goto_last);
    button.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
            mPager.setCurrentItem(NUM_ITEMS-1);
        }
    });
}

public static class MyAdapter extends FragmentPagerAdapter {
    public MyAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public int getCount() {
        return NUM_ITEMS;
    }

    @Override
    public Fragment getItem(int position) {
        return ArrayListFragment.newInstance(position);
    }
}

public static class ArrayListFragment extends ListFragment {
    int mNum;

    /**
     * Create a new instance of CountingFragment, providing "num"
     * as an argument.
     */
    static ArrayListFragment newInstance(int num) {
        ArrayListFragment f = new ArrayListFragment();

        // Supply num input as an argument.
        Bundle args = new Bundle();
        args.putInt("num", num);
        f.setArguments(args);

        return f;
    }

    /**
     * When creating, retrieve this instance's number from its arguments.
     */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mNum = getArguments() != null ? getArguments().getInt("num") : 1;
    }

    /**

     */
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.fragment_pager_list, container, false);
        View tv = v.findViewById(R.id.text);
        ((ImageView)tv).setImageDrawable(#INSERT YOUR IMAGEHERE) //you can pass the id of the drawable into the mNum. Or you could make it a String instead of int and pass the url.
        return v;
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        setListAdapter(new ArrayAdapter<String>(getActivity(),
                android.R.layout.simple_list_item_1, Cheeses.sCheeseStrings));
    }

    @Override
    public void onListItemClick(ListView l, View v, int position, long id) {
        Log.i("FragmentList", "Item clicked: " + id);
    }
}
}

EDIT: Sorry that the formatting is a bit off...