2010-06-08 6 views
7

안드로이드에서 이미지 슬라이드 쇼를 만들고 싶습니다.안드로이드에 이미지 슬라이드 쇼 예?

안드로이드 GridView에 많은 이미지가 있습니다. 이미지가 클릭되면 수동 슬라이드 쇼를 열어서 왼쪽 또는 오른쪽으로 손가락을 왼쪽 또는 오른쪽으로 이동하고 이전 이미지 과 같은 안드로이드를 갤러리에 표시 할 수 있습니다.

어떤 가이드 나 어떻게 이것을 달성하기 위해?

어떤 도움을 주시면 감사하겠습니다.

답변

6

당신은 ApiDemos에에 Gallery1와 Gallery2의 예를 찾을 수 있습니다

c:\android-sdk-windows\samples\android-7\ApiDemos\src\com\example\android\apis\view\

+0

없이 모두 내가 열려는 도움이되지 않습니다 풀 사이드에서 이미지를 누른 다음 슬라이더로 전체 화면 이미지를 여는 방법 수동으로 왼쪽 및 오른쪽으로 슬라이드? – UMAR

+3

은 전체 화면 ImageView (fill_parent에 너비와 높이 설정)를 만들고 onFling 제스처를 인식하는 SimpleGestureListener를 추가하기 만하면됩니다.그것이 인식되면 ImageView에서 이미지를 전환하십시오. – reflog

+1

애니메이션은 어떻게됩니까? 몸짓은 어떨까요? 꼬집고 확대/축소하는 것은 어떨까요? 회전? 수확고? 배경 화면으로 설정 하시겠습니까? 문제는 3D 갤러리를 다시 사용할 수 없다는 것입니다. –

19

이 사용 중지하려면 이미지

slideShowBtn.setOnClickListener(new OnClickListener() { 

      @Override 
      public void onClick(View arg0) { 

       runnable = new Runnable() { 

        @Override 
        public void run() { 
         handler.postDelayed(runnable, 3000); 
         imageFrame.showNext(); 

        } 
       }; 
       handler.postDelayed(runnable, 500); 
      } 
     }); 

을 표시 ViewFlipper를 사용하는 경우이 코드를 시도 handler.removeCallbacks(runnable);

public class PhotoSlideShowActivity 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; 
    private GestureDetector gestureDetector; 
    View.OnTouchListener gestureListener; 
    ViewFlipper imageFrame; 
    RelativeLayout slideShowBtn; 
    Handler handler; 
    Runnable runnable; 
    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     // TODO Auto-generated method stub 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.photo_slideshow_main); 
     imageFrame = (ViewFlipper) findViewById(R.id.imageFrames); 

       //get sd card path for images 

     File parentFolder = new 
     File(Environment.getExternalStorageDirectory() 
     .getAbsolutePath() 
     + "/images"); 

     addFlipperImages(imageFrame, parentFolder); 
     // Gesture detection 
     gestureDetector = new GestureDetector(new MyGestureDetector()); 
     gestureListener = new View.OnTouchListener() { 
      public boolean onTouch(View v, MotionEvent event) { 
       if (gestureDetector.onTouchEvent(event)) 
        return true; 
       else 
        return false; 
      } 
     }; 
     handler = new Handler(); 
     imageFrame.setOnClickListener(PhotoSlideShowActivity.this); 
     imageFrame.setOnTouchListener(gestureListener); 
     slideShowBtn = (RelativeLayout) findViewById(R.id.slideShowBtn); 
     slideShowBtn.setOnClickListener(new OnClickListener() { 
      @Override 
      public void onClick(View arg0) { 

       runnable = new Runnable() { 

        @Override 
        public void run() { 
         handler.postDelayed(runnable, 3000); 
         imageFrame.showNext(); 

        } 
       }; 
       handler.postDelayed(runnable, 500); 
      } 
     }); 

    } 

    private void addFlipperImages(ViewFlipper flipper, File parent) { 
     int imageCount = parent.listFiles().length; 
     RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
       RelativeLayout.LayoutParams.FILL_PARENT, 
       RelativeLayout.LayoutParams.FILL_PARENT); 
     for (int count = 0; count < imageCount - 1; count++) { 
      ImageView imageView = new ImageView(this); 
      Bitmap imbm = BitmapFactory.decodeFile(parent.listFiles()[count] 
        .getAbsolutePath()); 
      imageView.setImageBitmap(imbm); 
      imageView.setLayoutParams(params); 
      flipper.addView(imageView); 
     } 

    } 
    class MyGestureDetector extends SimpleOnGestureListener { 
     @SuppressWarnings("static-access") 
     @Override 
     public boolean onSingleTapConfirmed(MotionEvent e) { 
      // TODO Auto-generated method stub 
      slideShowBtn = (RelativeLayout) findViewById(R.id.slideShowBtn); 
      slideShowBtn.setVisibility(slideShowBtn.VISIBLE); 
      handler.removeCallbacks(runnable); 
      runnable = new Runnable() { 

       @Override 
       public void run() { 
        slideShowBtn.setVisibility(slideShowBtn.INVISIBLE); 
       } 
      }; 
      handler.postDelayed(runnable, 2000); 
      return true; 
     } 
     @SuppressWarnings("static-access") 
     @Override 
     public boolean onSingleTapUp(MotionEvent e) { 
      // TODO Auto-generated method stub 
      slideShowBtn = (RelativeLayout) findViewById(R.id.slideShowBtn); 
      slideShowBtn.setVisibility(slideShowBtn.VISIBLE); 
      handler.removeCallbacks(runnable); 
      runnable = new Runnable() { 

       @Override 
       public void run() { 
        slideShowBtn.setVisibility(slideShowBtn.INVISIBLE); 
       } 
      }; 
      handler.postDelayed(runnable, 2000); 
      return true; 
     } 

     @Override 
     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, 
       float velocityY) { 
      try { 
       if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH) 
        return false; 
       // right to left swipe 
       if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE 
         && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 
        handler.removeCallbacks(runnable); 
        imageFrame.setInAnimation(inFromRightAnimation()); 
        imageFrame.setOutAnimation(outToLeftAnimation()); 
        imageFrame.showNext(); 
       } else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE 
         && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 
        handler.removeCallbacks(runnable); 
        imageFrame.setInAnimation(inFromLeftAnimation()); 
        imageFrame.setOutAnimation(outToRightAnimation()); 
        imageFrame.showPrevious(); 
       } 
      } catch (Exception e) { 
       // nothing 
      } 
      return false; 
     } 

    } 

    @Override 
    public void onClick(View view) { 

    } 

    private Animation inFromRightAnimation() { 

     Animation inFromRight = new TranslateAnimation(
       Animation.RELATIVE_TO_PARENT, +1.2f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f); 
     inFromRight.setDuration(500); 
     inFromRight.setInterpolator(new AccelerateInterpolator()); 
     return inFromRight; 
    } 
    private Animation outToLeftAnimation() { 
     Animation outtoLeft = new TranslateAnimation(
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, -1.2f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f); 
     outtoLeft.setDuration(500); 
     outtoLeft.setInterpolator(new AccelerateInterpolator()); 
     return outtoLeft; 
    } 
    private Animation inFromLeftAnimation() { 
     Animation inFromLeft = new TranslateAnimation(
       Animation.RELATIVE_TO_PARENT, -1.2f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f); 
     inFromLeft.setDuration(500); 
     inFromLeft.setInterpolator(new AccelerateInterpolator()); 
     return inFromLeft; 
    } 
    private Animation outToRightAnimation() { 
     Animation outtoRight = new TranslateAnimation(
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, +1.2f, 
       Animation.RELATIVE_TO_PARENT, 0.0f, 
       Animation.RELATIVE_TO_PARENT, 0.0f); 
     outtoRight.setDuration(500); 
     outtoRight.setInterpolator(new AccelerateInterpolator()); 
     return outtoRight; 
    } 

} 

레이아웃

+0

XML도 제공하십시오. 사람이 이것을 읽고 XML을 작성할 수 있다면, 그는 이것을 처음에는 읽지 않을 것입니다. – Jaseem

+0

좋은 대답 .. 나는 왜 사람들이 그를 + 1. 내 측면에서 +1 – Sameer

+0

ty sameer :) 줄지 못 했어 .. .. 언제든지 .. – Chet

11

안드로이드의 ViewFlipper를 사용하여 슬라이드 쇼를 적용하는 것은 매우 쉽습니다.

이미지를 드로어 블 폴더에 넣고 아래 코드를 따르십시오. 사용자가 와이프 동안 slide_show.xml

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

    <ViewFlipper 
     android:id="@+id/myflipper" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:gravity="center" > 
    </ViewFlipper> 

</LinearLayout> 

SlideShowActivity.java

package com.example.viewpagerexample; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.MotionEvent; 
import android.widget.ImageView; 
import android.widget.ViewFlipper; 

public class SlideShowActivity extends Activity { 

    private ViewFlipper myViewFlipper; 
    private float initialXPoint; 
    int[] image = { R.drawable.one_full, R.drawable.two_full, 
     R.drawable.three_full, R.drawable.four_full, R.drawable.five_full, 
     R.drawable.six_full, R.drawable.seven_full, R.drawable.eight_full, 
     R.drawable.nine_full, R.drawable.ten_full }; 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 

    super.onCreate(savedInstanceState); 
    setContentView(R.layout.slide_show); 
    myViewFlipper = (ViewFlipper) findViewById(R.id.myflipper); 

    for (int i = 0; i < image.length; i++) { 
     ImageView imageView = new ImageView(SlideShowActivity.this); 
     imageView.setImageResource(image[i]); 
     myViewFlipper.addView(imageView); 
    } 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent event) { 
    switch (event.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
     initialXPoint = event.getX(); 
     break; 
    case MotionEvent.ACTION_UP: 
     float finalx = event.getX(); 
     if (initialXPoint > finalx) { 
      if (myViewFlipper.getDisplayedChild() == image.length) 
       break; 
      myViewFlipper.showNext(); 
     } else { 
      if (myViewFlipper.getDisplayedChild() == 0) 
       break; 
      myViewFlipper.showPrevious(); 
     } 
     break; 
    } 
    return false; 
    } 
} 

여기서 이미지 만 변경된다.

당신은

myViewFlipper.setAutoStart(true); 
myViewFlipper.setFlipInterval(3000); 
myViewFlipper.startFlipping(); 
+0

잘 작동하지만 이미지를 중앙으로 확대하는 방법은 무엇입니까? 이미지의 왼쪽과 오른쪽에 빈 공간이 표시됩니다. –

+0

안녕하세요, 저는이 라인을 추가함으로써 그렇게했습니다 : imageView.setScaleType (ScaleType.CENTER_CROP); –

+0

문제가 있습니다. 메모리가 부족합니다. 이 오류를 해결할 방법이 있습니까? ''529420012 바이트 할당에 4194304 프리 바이트와 31MB를 OOM까지 할당하지 못했습니다. ' –

0

은 전체 소스 코드 아래에서 이러한 시도는 다음 코드를 자동으로 일정한 간격으로 슬쩍 추가하려면 :

MainActivity.java :

package com.example.splashanimation; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.Menu; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.widget.Button; 
import android.widget.ViewFlipper; 

public class MainActivity extends Activity { 

    int mFlipping = 0 ; // Initially flipping is off 
    Button mButton ; // Reference to button available in the layout to start and stop the flipper 

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

     /** Click event handler for button */ 


       ViewFlipper flipper = (ViewFlipper) findViewById(R.id.flipper1); 


        /** Start Flipping */ 
        flipper.startFlipping(); 
        mFlipping=1; 

      } 


    @Override 
    public boolean onCreateOptionsMenu(Menu menu) { 
     // Inflate the menu; this adds items to the action bar if it is present. 
     getMenuInflater().inflate(R.menu.main, menu); 
     return true; 
    } 

} 

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" > 



    <ViewFlipper 
     android:id="@+id/flipper1" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:flipInterval="3000" 
     android:inAnimation="@anim/slide_in_right" 
     android:outAnimation="@anim/slide_in_left" 
     android:layout_centerInParent="true" > 

     <ImageView 
      android:src="@drawable/img1" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/str_img1" 
      android:layout_gravity="center_horizontal" /> 

     <ImageView 
      android:src="@drawable/img2" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/str_img2" 
      android:layout_gravity="center_horizontal" /> 

     <ImageView 
      android:src="@drawable/img3" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/str_img3" 
      android:layout_gravity="center_horizontal" /> 

     <ImageView 
      android:src="@drawable/img4" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:contentDescription="@string/str_img4" 
      android:layout_gravity="center_horizontal" /> 

     <ImageView 
      android:src="@drawable/img5" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:contentDescription="@string/str_img5" 
      android:layout_gravity="center_horizontal" /> 

    </ViewFlipper> 

</RelativeLayout> 

/ANIM/slide_in_left.xml :

고해상도에서
<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/decelerate_interpolator" > 
    <translate 
     android:fromXDelta="0" 
     android:toXDelta="-100%p" 
     android:duration="500"/> 
</set> 

/ANIM/slide_in_right.xml :

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/decelerate_interpolator"> 
    <translate 
     android:fromXDelta="100%p" 
     android:toXDelta="0" 
     android:duration="500"/> 
</set>