Android Carousel

Question

Is there any library for animating image carousels available on iphone http://cocoacontrols.com/platforms/ios/controls/icarousel

I used a stream of covers, but it does not give an effect like iCarousel in iphone, so If some other tricks with which I can implement this, please Thanks

Answer 1

You can use this code, which you will find, similar to a carousel

The main function of CoverFlow

package pl.polidea.coverflow; import java.util.ArrayList; import android.app.Activity; import android.os.Bundle; import android.view.View; import android.view.ViewGroup.LayoutParams; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.AdapterView.OnItemSelectedListener; import android.widget.BaseAdapter; import android.widget.TextView; /** * The Class CoverFlowTestingActivity. */ public class CoverFlowActivity extends Activity { private TextView textView; BaseAdapter coverImageAdapter; /* * (non-Javadoc) * * @see android.app.Activity#onCreate(android.os.Bundle) */ private int[] DEFAULT_RESOURCE_LIST = { R.drawable.img1, R.drawable.img2, R.drawable.img3, R.drawable.img4, R.drawable.img5, R.drawable.img6, R.drawable.img7, R.drawable.img8 }; private int[] DEFAULT_RESOURCE_LIST1 = { R.drawable.img1a, R.drawable.img2a, R.drawable.img3a, R.drawable.img4a, R.drawable.img5a, R.drawable.img6a, R.drawable.img7a, R.drawable.img8a }; public static ArrayList<Imagedata> i11Set; @Override protected void onCreate(final Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); textView = (TextView) findViewById(this.getResources().getIdentifier( "statusText", "id", "pl.polidea.coverflow")); // note resources below are taken using getIdentifier to allow importing // this library as library. /* * final CoverFlow coverFlow1 = (CoverFlow) * findViewById(this.getResources().getIdentifier("coverflow", "id", * "pl.polidea.coverflow")); setupCoverFlow(coverFlow1, false); */ final CoverFlow reflectingCoverFlow = (CoverFlow) findViewById(this .getResources().getIdentifier("coverflowReflect", "id", "pl.polidea.coverflow")); setupCoverFlow(reflectingCoverFlow, true); } /** * Setup cover flow. * * @param mCoverFlow * the m cover flow * @param reflect * the reflect */ private void setupCoverFlow(final CoverFlow mCoverFlow, final boolean reflect) { try { i11Set = new ArrayList<Imagedata>(); for (int resourceId : DEFAULT_RESOURCE_LIST1) { i11Set.add(new Imagedata(resourceId)); // Global.i11.add(new Imagedata(resourceId)); } if (reflect) { coverImageAdapter = new ReflectingImageAdapter( new ResourceImageAdapter(this, i11Set), 3); } else { coverImageAdapter = new ResourceImageAdapter(this, i11Set); } mCoverFlow.setAdapter(coverImageAdapter, -1); mCoverFlow.setSelection(3, true); setupListeners(mCoverFlow); } catch(Exception e) { e.printStackTrace(); } } /** * Sets the up listeners. * * @param mCoverFlow * the new up listeners */ private void setupListeners(final CoverFlow mCoverFlow) { mCoverFlow.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(final AdapterView<?> parent, final View view, int position, final long id) { try { i11Set = new ArrayList<Imagedata>(); for (int resourceId = 0; resourceId < DEFAULT_RESOURCE_LIST1.length; resourceId++) { { if (resourceId == position) { i11Set.add(new Imagedata( DEFAULT_RESOURCE_LIST[resourceId])); } else { i11Set.add(new Imagedata( DEFAULT_RESOURCE_LIST1[resourceId])); } } // Global.i11.add(new Imagedata(resourceId)); } /*for (int resourceId : DEFAULT_RESOURCE_LIST) { i11Set.add(new Imagedata(resourceId)); // Global.i11.add(new Imagedata(resourceId)); }*/ coverImageAdapter = new ReflectingImageAdapter( new ResourceImageAdapter(CoverFlowActivity.this, i11Set), 3); mCoverFlow.setAdapter(coverImageAdapter, -1); mCoverFlow.setSelection(position, true); //coverImageAdapter.notifyDataSetChanged(); // mCoverFlow.invalidate(); } catch(Exception e) { e.printStackTrace(); } } }); mCoverFlow.setOnItemSelectedListener(new OnItemSelectedListener() { @Override public void onItemSelected(final AdapterView<?> parent, final View view, final int position, final long id) { textView.setText("Item selected! : " + id); /* * coverImageAdapter = new ReflectingImageAdapter(new * ResourceImageAdapter(CoverFlowActivity.this),position); * coverImageAdapter.notifyDataSetChanged(); * mCoverFlow.setAdapter(coverImageAdapter,position); * mCoverFlow.setSelection(position, true); * mCoverFlow.invalidate(); */ } @Override public void onNothingSelected(final AdapterView<?> parent) { textView.setText("Nothing clicked!"); } }); } } 

Coverflow.java

 package pl.polidea.coverflow; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Camera; import android.graphics.Matrix; import android.util.AttributeSet; import android.util.Log; import android.view.MotionEvent; import android.view.View; import android.view.animation.Transformation; import android.widget.Gallery; import android.widget.ImageView; import android.widget.SpinnerAdapter; /** * Cover Flow implementation. * */ public class CoverFlow extends Gallery { /** * Graphics Camera used for transforming the matrix of ImageViews. */ private final Camera mCamera = new Camera(); /** * The maximum angle the Child ImageView will be rotated by. */ private int mMaxRotationAngle = 60; /** * The maximum zoom on the centre Child. */ private int mMaxZoom = -220; /** * The Centre of the Coverflow. */ private int mCoveflowCenter; /** The image height. */ private float imageHeight; /** The image width. */ private float imageWidth; /** The reflection gap. */ private float reflectionGap; /** The with reflection. */ private boolean withReflection; /** The image reflection ratio. */ private float imageReflectionRatio; /** * Gets the image height. * * @return the image height */ public float getImageHeight() { return imageHeight; } /** * Sets the image height. * * @param imageHeight * the new image height */ public void setImageHeight(final float imageHeight) { this.imageHeight = imageHeight; } /** * Gets the image width. * * @return the image width */ public float getImageWidth() { return imageWidth; } /** * Sets the image width. * * @param imageWidth * the new image width */ public void setImageWidth(final float imageWidth) { this.imageWidth = imageWidth; } /** * Gets the reflection gap. * * @return the reflection gap */ public float getReflectionGap() { return reflectionGap; } /** * Sets the reflection gap. * * @param reflectionGap * the new reflection gap */ public void setReflectionGap(final float reflectionGap) { this.reflectionGap = reflectionGap; } /** * Checks if is with reflection. * * @return true, if is with reflection */ public boolean isWithReflection() { return withReflection; } /** * Sets the with reflection. * * @param withReflection * the new with reflection */ public void setWithReflection(final boolean withReflection) { this.withReflection = withReflection; } /** * Sets the image reflection ratio. * * @param imageReflectionRatio * the new image reflection ratio */ public void setImageReflectionRatio(final float imageReflectionRatio) { this.imageReflectionRatio = imageReflectionRatio; } /** * Gets the image reflection ratio. * * @return the image reflection ratio */ public float getImageReflectionRatio() { return imageReflectionRatio; } public CoverFlow(final Context context) { super(context); this.setStaticTransformationsEnabled(true); } public CoverFlow(final Context context, final AttributeSet attrs) { this(context, attrs, android.R.attr.galleryStyle); } public CoverFlow(final Context context, final AttributeSet attrs, final int defStyle) { super(context, attrs, defStyle); parseAttributes(context, attrs); this.setStaticTransformationsEnabled(true); } /** * Get the max rotational angle of the image. * * @return the mMaxRotationAngle */ public int getMaxRotationAngle() { return mMaxRotationAngle; } /** * Sets the. * * @param adapter * the new adapter */ public void setAdapter(final SpinnerAdapter adapter,int position) { if (!(adapter instanceof AbstractCoverFlowImageAdapter)) { throw new IllegalArgumentException("The adapter should derive from " + AbstractCoverFlowImageAdapter.class.getName()); } final AbstractCoverFlowImageAdapter coverAdapter = (AbstractCoverFlowImageAdapter) adapter; coverAdapter.setWidth(imageWidth); coverAdapter.setHeight(imageHeight); if (withReflection) { final ReflectingImageAdapter reflectAdapter = new ReflectingImageAdapter(coverAdapter,position); reflectAdapter.setReflectionGap(reflectionGap); reflectAdapter.setWidthRatio(imageReflectionRatio); reflectAdapter.setWidth(imageWidth); reflectAdapter.setHeight(imageHeight * (1 + imageReflectionRatio)); super.setAdapter(reflectAdapter); } else { super.setAdapter(adapter); } } /** * Set the max rotational angle of each image. * * @param maxRotationAngle * the mMaxRotationAngle to set */ public void setMaxRotationAngle(final int maxRotationAngle) { mMaxRotationAngle = maxRotationAngle; } /** * Get the Max zoom of the centre image. * * @return the mMaxZoom */ public int getMaxZoom() { return mMaxZoom; } /** * Set the max zoom of the centre image. * * @param maxZoom * the mMaxZoom to set */ public void setMaxZoom(final int maxZoom) { mMaxZoom = maxZoom; } /** * Get the Centre of the Coverflow. * * @return The centre of this Coverflow. */ private int getCenterOfCoverflow() { return (getWidth() - getPaddingLeft() - getPaddingRight()) / 2 + getPaddingLeft(); } /** * Get the Centre of the View. * * @return The centre of the given view. */ private static int getCenterOfView(final View view) { return view.getLeft() + view.getWidth() / 2; } /** * {@inheritDoc} * * @see #setStaticTransformationsEnabled(boolean) */ @Override protected boolean getChildStaticTransformation(final View child, final Transformation t) { final int childCenter = getCenterOfView(child); final int childWidth = child.getWidth(); int rotationAngle = 0; t.clear(); t.setTransformationType(Transformation.TYPE_MATRIX); if (childCenter == mCoveflowCenter) { transformImageBitmap((ImageView) child, t, 0); } else { //child.setLayoutParams(new LayoutParams(100,100)); rotationAngle = (int) ((float) (mCoveflowCenter - childCenter) / childWidth * mMaxRotationAngle); if (Math.abs(rotationAngle) > mMaxRotationAngle) { rotationAngle = rotationAngle < 0 ? -mMaxRotationAngle : mMaxRotationAngle; } Log.d("rotation Angle",""+rotationAngle); transformImageBitmap((ImageView) child, t, rotationAngle); } return true; } /** * This is called during layout when the size of this view has changed. If * you were just added to the view hierarchy, you're called with the old * values of 0. * * @param w * Current width of this view. * @param h * Current height of this view. * @param oldw * Old width of this view. * @param oldh * Old height of this view. */ @Override protected void onSizeChanged(final int w, final int h, final int oldw, final int oldh) { mCoveflowCenter = getCenterOfCoverflow(); super.onSizeChanged(w, h, oldw, oldh); } /** * Transform the Image Bitmap by the Angle passed. * * @param imageView * ImageView the ImageView whose bitmap we want to rotate * @param t * transformation * @param rotationAngle * the Angle by which to rotate the Bitmap */ private void transformImageBitmap(final ImageView child, final Transformation t, final int rotationAngle) { mCamera.save(); final Matrix imageMatrix = t.getMatrix(); final int height = child.getLayoutParams().height; final int width = child.getLayoutParams().width; final int rotation = Math.abs(rotationAngle); mCamera.translate(0.0f, 0.0f, 100.0f); // As the angle of the view gets less, zoom in if (rotation < mMaxRotationAngle) { //child.setLayoutParams(new LayoutParams(200,200)); final float zoomAmount = (float) (mMaxZoom + rotation * 10.0); mCamera.translate(0.0f, 0.0f, zoomAmount); } mCamera.rotateY(rotationAngle); mCamera.getMatrix(imageMatrix); imageMatrix.preTranslate(-(width / 2.0f), -(height / 2.0f)); imageMatrix.postTranslate((width / 2.0f), (height / 2.0f)); mCamera.restore(); } /** * Parses the attributes. * * @param context * the context * @param attrs * the attrs */ private void parseAttributes(final Context context, final AttributeSet attrs) { final TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CoverFlow); try { imageWidth = a.getDimension(R.styleable.CoverFlow_imageWidth, 480); imageHeight = a.getDimension(R.styleable.CoverFlow_imageHeight, 320); withReflection = a.getBoolean(R.styleable.CoverFlow_withReflection, false); imageReflectionRatio = a.getFloat(R.styleable.CoverFlow_imageReflectionRatio, 0.2f); reflectionGap = a.getDimension(R.styleable.CoverFlow_reflectionGap, 4); setSpacing(-50); } finally { a.recycle(); } } /* @Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { // TODO Auto-generated method stub boolean leftScroll = isScrollingLeft(e1, e2); float velX; if(leftScroll) { velX=500; } else { velX=-500; } return super.onFling(e1, e2, velX, velocityY); } private boolean isScrollingLeft(MotionEvent e1, MotionEvent e2){ return e2.getX() > e1.getX(); }*/ } 

ResourceImageAdapter

 package pl.polidea.coverflow; import java.lang.ref.WeakReference; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.content.Context; import android.graphics.Bitmap; import android.graphics.drawable.BitmapDrawable; import android.util.Log; /** * This class is an adapter that provides images from a fixed set of resource * ids. Bitmaps and ImageViews are kept as weak references so that they can be * cleared by garbage collection when not needed. * */ public class ResourceImageAdapter extends AbstractCoverFlowImageAdapter { /** The Constant TAG. */ private static final String TAG = ResourceImageAdapter.class .getSimpleName(); /** The Constant DEFAULT_LIST_SIZE. */ private static final int DEFAULT_LIST_SIZE = 20; /** The Constant IMAGE_RESOURCE_IDS. */ private static final List<Integer> IMAGE_RESOURCE_IDS = new ArrayList<Integer>( DEFAULT_LIST_SIZE); /** The Constant DEFAULT_RESOURCE_LIST. */ private static final int[] DEFAULT_RESOURCE_LIST = { R.drawable.img1a, R.drawable.img2a, R.drawable.img3a, R.drawable.img4a, R.drawable.img5a, R.drawable.img6a, R.drawable.img7a, R.drawable.img8a }; /** The bitmap map. */ private final Map<Integer, WeakReference<Bitmap>> bitmapMap = new HashMap<Integer, WeakReference<Bitmap>>(); private final Context context; private Imagedata i1; // private ArrayList<Imagedata> i11=new ArrayList<Imagedata>(); /** * Creates the adapter with default set of resource images. * * @param context * context */ public ResourceImageAdapter(final Context context, ArrayList<Imagedata> i11get) { super(); this.context = context; setResources(i11get); } /** * Replaces resources with those specified. * * @param resourceIds * array of ids of resources. */ public final synchronized void setResources(ArrayList<Imagedata> resourceIds) { /* * IMAGE_RESOURCE_IDS.clear(); * * for (final int resourceId : resourceIds) { * IMAGE_RESOURCE_IDS.add(resourceId); * * Global.i11.add(new Imagedata(resourceId)); } */ // Global.i11.clear(); try { Global.i11=new ArrayList<Imagedata>(); Global.i11 = resourceIds; Log.d("Size of i11", "" + Global.i11.size()); notifyDataSetChanged(); } catch(Exception e) { e.printStackTrace(); } } /* * (non-Javadoc) * * @see android.widget.Adapter#getCount() */ @Override public synchronized int getCount() { return Global.i11.size(); } /* * (non-Javadoc) * * @see pl.polidea.coverflow.AbstractCoverFlowImageAdapter#createBitmap(int) */ @Override protected Bitmap createBitmap(final int position) { Log.v(TAG, "creating item " + position); final Bitmap bitmap = ((BitmapDrawable) context.getResources() .getDrawable(Global.i11.get(position).getSetResourceId())) .getBitmap(); bitmapMap.put(position, new WeakReference<Bitmap>(bitmap)); return bitmap; } } 

globals

 package pl.polidea.coverflow; import java.util.ArrayList; public class Global { public static ArrayList<Imagedata> i11=new ArrayList<Imagedata>(); } 

ImageData p>

package pl.polidea.coverflow;

 public class Imagedata { private int setResourceId; public Imagedata() {} public Imagedata(int rid) { super(); this.setResourceId=rid; } public int getSetResourceId() { return setResourceId; } public void setSetResourceId(int setResourceId) { this.setResourceId = setResourceId; } } 

ReflectingImageAdapter

 package pl.polidea.coverflow; import android.R.color; import android.graphics.Bitmap; import android.graphics.Bitmap.Config; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.ColorMatrix; import android.graphics.ColorMatrixColorFilter; import android.graphics.LinearGradient; import android.graphics.Matrix; import android.graphics.Paint; import android.graphics.PorterDuff.Mode; import android.graphics.PorterDuffXfermode; import android.graphics.Shader.TileMode; import android.util.Log; /** * This adapter provides reflected images from linked adapter. * * @author potiuk * */ public class ReflectingImageAdapter extends AbstractCoverFlowImageAdapter { /** The linked adapter. */ private final AbstractCoverFlowImageAdapter linkedAdapter; /** * Gap between the image and its reflection. */ private float reflectionGap; /** The image reflection ratio. */ private float imageReflectionRatio; public int id; private int position=-1; /** * Sets the width ratio. * * @param imageReflectionRatio * the new width ratio */ public void setWidthRatio(final float imageReflectionRatio) { this.imageReflectionRatio = imageReflectionRatio; } /** * Creates reflecting adapter. * * @param linkedAdapter * adapter that provides images to get reflections */ public ReflectingImageAdapter( final AbstractCoverFlowImageAdapter linkedAdapter, int id) { super(); this.id=id; this.linkedAdapter = linkedAdapter; } /** * Sets the reflection gap. * * @param reflectionGap * the new reflection gap */ public void setReflectionGap(final float reflectionGap) { this.reflectionGap = reflectionGap; } /** * Gets the reflection gap. * * @return the reflection gap */ public float getReflectionGap() { return reflectionGap; } /* * (non-Javadoc) * * @see pl.polidea.coverflow.AbstractCoverFlowImageAdapter#createBitmap(int) */ @Override protected Bitmap createBitmap(int position) { // this.position=position; return createReflectedImages(linkedAdapter.getItem(position),position); } /** * Creates the reflected images. * * @param originalImage * the original image * @return true, if successful */ public Bitmap createReflectedImages(Bitmap originalImage,int position) { Bitmap sepia=null ; // Log.d("Id is",""+id); // Log.d("position is","position"+position); /*if(id==position) {*/ sepia=originalImage; /*} else { sepia = ConvertToBlackAndWhite(originalImage); }*/ final int width = sepia.getWidth(); final int height = sepia.getHeight(); final Matrix matrix = new Matrix(); matrix.preScale(1, -1); final Bitmap reflectionImage = Bitmap.createBitmap(sepia, 0, (int) (height * imageReflectionRatio), width, (int) (height - height * imageReflectionRatio), matrix, false); final Bitmap bitmapWithReflection = Bitmap.createBitmap(width, (int) (height + height * imageReflectionRatio), Config.ARGB_8888); final Canvas canvas = new Canvas(bitmapWithReflection); canvas.drawBitmap(sepia, 0, 0, null); final Paint deafaultPaint = new Paint(); deafaultPaint.setColor(color.transparent); canvas.drawBitmap(reflectionImage, 0, height + reflectionGap, null); final Paint paint = new Paint(); final LinearGradient shader = new LinearGradient(0, sepia.getHeight(), 0, bitmapWithReflection.getHeight() + reflectionGap, 0x70ffffff, 0x00ffffff, TileMode.CLAMP); paint.setShader(shader); paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN)); canvas.drawRect(0, height, width, bitmapWithReflection.getHeight() + reflectionGap, paint); return bitmapWithReflection; } /* * (non-Javadoc) * * @see android.widget.Adapter#getCount() */ @Override public int getCount() { return linkedAdapter.getCount(); } public Bitmap toSephia(Bitmap bmpOriginal) { int width, height, r, g, b, c, gry; height = bmpOriginal.getHeight(); width = bmpOriginal.getWidth(); int depth = 20; Bitmap bmpSephia = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(bmpSephia); Paint paint = new Paint(); ColorMatrix cm = new ColorMatrix(); cm.setScale(.3f, .3f, .3f, 1.0f); ColorMatrixColorFilter f = new ColorMatrixColorFilter(cm); paint.setColorFilter(f); canvas.drawBitmap(bmpOriginal, 0, 0, paint); for (int x = 0; x < width; x++) { for (int y = 0; y < height; y++) { c = bmpOriginal.getPixel(x, y); r = Color.red(c); g = Color.green(c); b = Color.blue(c); gry = (r + g + b) / 3; r = g = b = gry; r = r + (depth * 2); g = g + depth; if (r > 255) { r = 255; } if (g > 255) { g = 255; } bmpSephia.setPixel(x, y, Color.rgb(r, g, b)); } } return bmpSephia; } public Bitmap ConvertToBlackAndWhite(Bitmap sampleBitmap) { ColorMatrix bwMatrix = new ColorMatrix(); bwMatrix.setSaturation(0); final ColorMatrixColorFilter colorFilter = new ColorMatrixColorFilter( bwMatrix); Bitmap rBitmap = sampleBitmap.copy(Bitmap.Config.ARGB_8888, true); Paint paint = new Paint(); paint.setColorFilter(colorFilter); Canvas myCanvas = new Canvas(rBitmap); myCanvas.drawBitmap(rBitmap, 0, 0, paint); return rBitmap; } } 

Answer 2

You can find it here. http://code.google.com/p/android-ui-utils/downloads/detail?name=CarouselExample.zip Another good link is http://www.codeproject.com/Articles/146145/Android-3D-Carousel

Answer 3

Try iScroll. Here you can find the repository.

You can also use sencha for this purpose. He has many options.

It may be for ios, but just try

But the exact coating style cannot be achieved.

Edit: this is the same as the friend mentioned here http://horribile.blogspot.in/2011/11/android-3d-carousel.html

Coverflow Corousel is also possible on Android.

I saw him in the Regina 3D launcher . Just look at him

Another similar thing