fullscreen ImageSwitcher without gallery in Android

11,208

Solution 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;
            }
        });

Solution 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...

Share:
11,208
osayilgan
Author by

osayilgan

(your about me is currently blank)

Updated on June 04, 2022

Comments

  • osayilgan
    osayilgan about 2 years

    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;
    }
    
  • osayilgan
    osayilgan about 12 years
    Thanks for advice, I guess I found a way for it. But I dont know how proper it is. What I'm doing in this way is basicly changing the dimensions of gallery view area in custom gallery view. In that way , instead of listening touch events I can just use custom gallery view functions include slide right and left. Here is my code below.
  • osayilgan
    osayilgan about 12 years
    Now it works, you can check my edit as a solution. Thanks again imran khan.