2010-06-08 20 views
7

मैं एंड्रॉइड में छवि स्लाइड शो बनाना चाहता हूं।छवि स्लाइड शो उदाहरण एंड्रॉइड में?

मेरे पास एंड्रॉइड ग्रिड व्यू में कई छवियां हैं, यदि मैं किसी भी छवि पर क्लिक किया गया है तो मैन्युअल स्लाइड शो खोलना चाहता हूं ताकि मैं गैलरी में निर्मित एंड्रॉइड की तरह अगली और पिछली छवियों पर उंगली को बाएं या दाएं स्थानांतरित करके देख सकूं।

कोई भी मुझे यह कैसे प्राप्त करने के लिए मार्गदर्शन करता है?

किसी भी मदद की सराहना की जाएगी।

उत्तर

6

आप ApiDemos में Gallery1 और Gallery2 का उदाहरण देख सकते हैं:

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

+0

कोई दोनों उपयोगी मैं खोलना चाहते हैं नहीं कर रहे हैं पूरी तरफ छवि, स्लाइडर के साथ पूर्ण स्क्रीन छवि को कैसे खोलें मैन्युअल रूप से बाएं और दाएं स्लाइड करें? – UMAR

+3

बस एक पूर्णस्क्रीन ImageView (fill_parent को सेट चौड़ाई और ऊंचाई) बनाएं और ऑनफलिंग इशारा को पहचानने के लिए एक सरल जेस्चर लिस्टर जोड़ें।जब यह पहचाना जाता है, छवि को ImageView में स्विच करें। – reflog

+1

एनीमेशन के बारे में क्या? इशारे के बारे में क्या? चुटकी और ज़ूम के बारे में क्या? बारी बारी से? फसल? वॉलपेपर के रूप में सेट करें? आदि समस्या यह है कि 3 डी गैलरी का पुन: उपयोग नहीं किया जा सकता !!! –

19

आप ViewFlipper उपयोग कर रहे हैं छवियों

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

प्रदर्शित करने के लिए इस कोड का प्रयास करें इसका इस्तेमाल को रोकने के लिए 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; 
    } 

} 

लेआउट

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

    <ViewFlipper 
     android:id="@+id/imageFrames" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:background="@android:drawable/screen_background_dark" > 
    </ViewFlipper> 

    <RelativeLayout 
     android:id="@+id/slideShowBtn" 
     android:layout_width="fill_parent" 
     android:layout_height="40dp" 
     android:layout_alignParentBottom="true" 
     android:gravity="center" android:visibility="invisible"> 

     <RelativeLayout 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:background="#33FFFFFF" 
      android:gravity="center" 
      android:paddingLeft="1dp" 
      android:paddingRight="1dp" 
      android:paddingTop="1dp" > 

      <RelativeLayout 
       android:layout_width="fill_parent" 
       android:layout_height="fill_parent" 
       android:background="#66000000" 
       android:gravity="center" > 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="fill_parent" 
        android:gravity="center" 
        android:text="Slideshow" 
        android:textSize="18dp" /> 
      </RelativeLayout> 
     </RelativeLayout> 
    </RelativeLayout> 

</RelativeLayout> 
+0

कृपया एक्सएमएल भी प्रदान करें। यदि कोई व्यक्ति इसे पढ़ने के लिए XML लिख सकता है, तो वह इसे पहले स्थान पर नहीं पढ़ पाएगा। – Jaseem

+0

अच्छा जवाब .. मुझे नहीं मिला कि लोग उसे क्यों देते हैं + 1. मेरी तरफ से +1 – Sameer

+0

टाइमर :) .. किसी भी समय .. – 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

मुझे कोई समस्या है, यह स्मृति से बाहर हो रहा है। क्या इस त्रुटि को हल करने का उनका कोई तरीका है? मुझे 41 9 4304 बाइट आवंटन 4194304 मुफ्त बाइट्स और 31 एमबी के साथ ओओएम तक आवंटित करने में विफल ' –

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> 
संबंधित मुद्दे