How to swipe images

I am trying to implement a simple gallery of images in which I have an image to be displayed at a time on the device screen. When we swipe the screen from left to right it should show the next image.
For that I implemented a view flipper and added image views to it.
But I don't know how to catch that swipe event.
Can anyone tell me with an example?


I needed the same thing for my app, and used a ViewPager : http://blog.sqisland.com/2012/09/android-swipe-image-viewer-with-viewpager.html

Previously I used a ImageSwitcher combined with a GestureDetector : http://blog.sqisland.com/2012/07/android-swipe-image-viewer.html

The code with ViewPager is much simpler, and the experience is much better because the image slides as your finger swipe across the screen. I create ImageView directly, no fragments required.


You can use ViewPager by extends PagerAdapter...like this

    public class ImageAdapter extends PagerAdapter {
    private Context context;
    private int[] GalImages = new int[] {
            R.drawable.cap8, R.drawable.cap2, R.drawable.cap3, R.drawable.cap1,R.drawable.cap5,
            R.drawable.cap6, R.drawable.cap7, R.drawable.cap9,R.drawable.cap4,
            R.drawable.cap10

    };
    ImageAdapter(Context context)
    {
        this.context=context;
    }

    @Override
    public int getCount() {
        return GalImages.length;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == 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]);
        container.addView(imageView, 0);
        return imageView;
    }
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((ImageView) object);
    }
}

xml code is......

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

You can do like this way also, without using view flipper

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<ImageView

                 android:layout_width="fill_parent"

                 android:layout_height="fill_parent"

                 android:layout_gravity="center"

                 android:gravity="center"

                 android:layout_margin="10dip"

                 android:id="@+id/image_place_holder"
                 />

 </RelativeLayout>

Activity Class

 public class MainActivity extends Activity  {

    private Integer[] mImageIds = { R.drawable.img1, R.drawable.img2,
        R.drawable.img3 };
private static final String DEBUG_TAG = "MainActivity ";
ImageView imageView;
float startXValue = 1;


@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.gallery);
    imageView = (ImageView) findViewById(R.id.image_place_holder);
    imageView.setImageResource(mImageIds[num]);
}

@Override
public boolean onTouchEvent(MotionEvent event) {    
    float endXValue = 0;
    float x1 = event.getAxisValue(MotionEvent.AXIS_X);
    int action = MotionEventCompat.getActionMasked(event);
    switch (action) {
        case (MotionEvent.ACTION_DOWN):
            startXValue = event.getAxisValue(MotionEvent.AXIS_X);

            return true;

        case (MotionEvent.ACTION_UP):
            endXValue = event.getAxisValue(MotionEvent.AXIS_X);
            if (endXValue > startXValue) {
                if (endXValue - startXValue > 100) {
                System.out.println("Left-Right");
                imageView.setImageResource(mImageIds[2]);
                }
            }else {
                if (startXValue -endXValue> 100) {
                System.out.println("Right-Left");
                imageView.setImageResource(mImageIds[0]);

                     }
                         }
        return true;


           default:
        return super.onTouchEvent(event);
     }

}

}
链接地址: http://www.djcxy.com/p/91222.html

上一篇: Android:滑动屏幕打开另一个活动?

下一篇: 如何轻扫图像