Cómo deslizar imágenes

Question

Estoy tratando de implementar una galería simple de imágenes en las que tengo una imagen para mostrar a la vez en la pantalla del dispositivo. Cuando deslizamos la pantalla de izquierda a derecha, debería mostrarse la siguiente imagen.
Para eso implementé un flipper de vista y le agregué vistas de imagen.
Pero no sé cómo atrapar ese evento de deslizamiento.
¿Alguien puede decirme con un ejemplo?

Answer 1

¿Por qué no hacerlo operativo galería de widgets .....

Here is the gallery tutorial....

Gracias ......

Answer 2

Usted desea utilizar un ViewPager disponible en el Android Support Jar. Aquí hay un tutorial: http://thepseudocoder.wordpress.com/2011/10/05/android-page-swiping-using-viewpager/

No desea utilizar Gallery como algunos sugieren, ya que no está en desuso. Sin embargo desde el documentation que sugieren la ViewPager y HorizantleScrollView para resolver este problema de manera relativamente fácil:

This class is deprecated. 
    This widget is no longer supported. Other horizontally scrolling widgets include 
    HorizontalScrollView and ViewPager from the support library. 

Answer 3

que necesitaba lo mismo para mi aplicación, y se utiliza un ViewPager: http://blog.sqisland.com/2012/09/android-swipe-image-viewer-with-viewpager.html

Anteriormente he usado un ImageSwitcher combinado con un GestureDetector: http://blog.sqisland.com/2012/07/android-swipe-image-viewer.html

el código con ViewPager es mucho más simple, y la experiencia es mucho mejor porque XX La imagen se desliza mientras desliza el dedo por la pantalla. Creo ImageView directamente, no se requieren fragmentos.

Answer 4

Puede hacerlo así, funciona hoscos sin ninguna vista

public class Swipe extends Activity implements OnClickListener { 

private static final int SWIPE_MIN_DISTANCE = 120; 
//private static final int SWIPE_MAX_OFF_PATH = 250; 
private static final int SWIPE_THRESHOLD_VELOCITY = 200; 
final GestureDetector gdt = new GestureDetector(new GestureListener()); 
private GestureDetector gestureDetector; 
ImageView img; 


View.OnTouchListener gestureListener; 

@Override 
public void onCreate(Bundle savedInstanceState) { 

    super.onCreate(savedInstanceState); 
    setContentView(R.layout.swipe); 
    img = (ImageView)findViewById(R.id.imageView1swipe); 

    img.setOnTouchListener(new OnTouchListener() { 
     public boolean onTouch(final View view, final MotionEvent event) { 
      // TODO Auto-generated method stub 
      gdt.onTouchEvent(event); 
      //Log.i("Hello my Log 1","How dfgfd are you"); 
      return true; 
     } 
    }); 

y declarar este método en su .java

private class GestureListener extends SimpleOnGestureListener { 
     @Override 
     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, 
       float velocityY) { 
      Log.i("Hello my Log 2","How dfgfd are you"); 
      if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE 
        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 

       Log.i("dfsd", "Right to left"); 
       return false; // Right to left 
      } else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE 
        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 
       return false; // Left to right 
      } 

      if (e1.getY() - e2.getY() > SWIPE_MIN_DISTANCE 
        && Math.abs(velocityY) > SWIPE_THRESHOLD_VELOCITY) { 
       return false; // Bottom to top 
      } else if (e2.getY() - e1.getY() > SWIPE_MIN_DISTANCE 
        && Math.abs(velocityY) > SWIPE_THRESHOLD_VELOCITY) { 
       return false; // Top to bottom 
      } 

      return false; 
     }' 

Puede ser this le ayudará a organizar todo el deslizar de Imágenes

Answer 5

Puede hacer de esta manera también, sin usar ver 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> 

Clase Actividad

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

} 

} 

Answer 6

Éste es cómo obtenidos:

package com.demoimageslider; 

import java.util.List; 
import java.util.Vector; 

import com.nineoldandroids.view.ViewHelper; 

import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentActivity; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 
import android.support.v4.view.ViewPager; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.ImageView; 

public class MainActivity extends FragmentActivity { 

    private PagerAdapter mPagerAdapter; 

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

     this.initialisePaging(); 
    } 

    private void initialisePaging() { 

     List<Fragment> fragments = new Vector<Fragment>(); 
     fragments.add(Fragment.instantiate(this, Tab1Fragment.class.getName())); 
     fragments.add(Fragment.instantiate(this, Tab2Fragment.class.getName())); 
     fragments.add(Fragment.instantiate(this, Tab3Fragment.class.getName())); 
     this.mPagerAdapter = new PagerAdapter(
       super.getSupportFragmentManager(), fragments); 

     ViewPager pager = (ViewPager) super.findViewById(R.id.pager); 
     pager.setAdapter(this.mPagerAdapter); 
     pager.setPageTransformer(true, new ZoomOutPageTransformer()); 
    } 

    public static class Tab1Fragment extends Fragment { 

     public View onCreateView(LayoutInflater inflater, ViewGroup container, 
       Bundle savedInstanceState) { 
      if (container == null) { 
       return null; 
      } 
      return (ImageView) inflater.inflate(R.layout.tab_frag1_layout, 
        container, false); 
     } 
    } 

    public static class Tab2Fragment extends Fragment { 

     public View onCreateView(LayoutInflater inflater, ViewGroup container, 
       Bundle savedInstanceState) { 
      if (container == null) { 
       return null; 
      } 
      return (ImageView) inflater.inflate(R.layout.tab_frag2_layout, 
        container, false); 
     } 
    } 

    public static class Tab3Fragment extends Fragment { 

     public View onCreateView(LayoutInflater inflater, ViewGroup container, 
       Bundle savedInstanceState) { 
      if (container == null) { 
       return null; 
      } 
      return (ImageView) inflater.inflate(R.layout.tab_frag3_layout, 
        container, false); 
     } 
    } 

    public static class PagerAdapter extends FragmentPagerAdapter { 

     private List<Fragment> fragments; 

     public PagerAdapter(FragmentManager fm, List<Fragment> fragments) { 
      super(fm); 
      this.fragments = fragments; 
     } 

     @Override 
     public Fragment getItem(int position) { 
      return this.fragments.get(position); 
     } 

     @Override 
     public int getCount() { 
      return this.fragments.size(); 
     } 
    } 

    public static class ZoomOutPageTransformer implements 
      ViewPager.PageTransformer { 
     private static final float MIN_SCALE = 0.85f; 
     private static final float MIN_ALPHA = 0.5f; 

     public void transformPage(View view, float position) { 
      int pageWidth = view.getWidth(); 
      int pageHeight = view.getHeight(); 

      if (position < -1) { // [-Infinity,-1) 
       // This page is way off-screen to the left. 
       // view.setAlpha(0); 
       ViewHelper.setAlpha(view, 0); 

      } else if (position <= 1) { // [-1,1] 
       // Modify the default slide transition to shrink the page as 
       // well 
       float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position)); 
       float vertMargin = pageHeight * (1 - scaleFactor)/2; 
       float horzMargin = pageWidth * (1 - scaleFactor)/2; 
       if (position < 0) { 
        // view.setTranslationX(horzMargin - vertMargin/2); 
        ViewHelper.setTranslationX(view, horzMargin - vertMargin 
          /2); 
       } else { 
        // view.setTranslationX(-horzMargin + vertMargin/2); 
        ViewHelper.setTranslationX(view, -horzMargin + vertMargin 
          /2); 
       } 

       // Scale the page down (between MIN_SCALE and 1) 
       // view.setScaleX(scaleFactor); 
       // view.setScaleY(scaleFactor); 
       ViewHelper.setScaleX(view, scaleFactor); 
       ViewHelper.setScaleY(view, scaleFactor); 

       // Fade the page relative to its size. 
       // view.setAlpha(MIN_ALPHA + 
       // (scaleFactor - MIN_SCALE)/
       // (1 - MIN_SCALE) * (1 - MIN_ALPHA)); 

       ViewHelper.setAlpha(view, MIN_ALPHA + (scaleFactor - MIN_SCALE) 
         /(1 - MIN_SCALE) * (1 - MIN_ALPHA)); 

      } else { // (1,+Infinity] 
       // This page is way off-screen to the right. 
       // view.setAlpha(0); 
       ViewHelper.setAlpha(view, 0); 
      } 
     } 
    } 
} 

Solía ​​biblioteca nineoldroids para soportar los efectos sobre las versiones anteriores de Android.

Answer 7

Se puede utilizar por ViewPager extiende PagerAdapter ... como el código XML

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

es ......

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