Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

android circular gallery?

I am a newbie to android development.Now i would like to do gallery view as circular like image as below.The things is that i want to enlarge the center image when user scroll from left to right and right to left. Is there any tutorials for that ?

enter image description here what I want is the image that's been swiped need to be enlarged while it's at the center. I thought I could do it with Gallery. but the example from the android developer is not the one I want. :(

like image 493
geekmyo Avatar asked Sep 03 '10 06:09

geekmyo


2 Answers

youcan try:

public class TestGallery extends Activity {
/** Called when the activity is first created. */
private Integer[] mImageIds = { R.drawable.sample_1, R.drawable.sample_2, R.drawable.sample_3, R.drawable.sample_4 }; 

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    Gallery g = (Gallery) findViewById(R.id.gallery); 
    g.setAdapter(new ImageAdapter(this)); 

    g.setOnItemClickListener(new OnItemClickListener() { 
        public void onItemClick(AdapterView parent, View v, int position, long id) { 
            if (position >= mImageIds.length) { 
                position = position % mImageIds.length; 
            } 
            Toast.makeText(TestGallery.this, "" + position, Toast.LENGTH_SHORT).show(); 
        } 
    }); 

}

public class ImageAdapter extends BaseAdapter { 
    int mGalleryItemBackground; 
    private Context mContext; 

    public ImageAdapter(Context c) { 
        mContext = c; 
        TypedArray a = obtainStyledAttributes(R.styleable.Gallery1); 
        mGalleryItemBackground = a.getResourceId(R.styleable.Gallery1_android_galleryItemBackground, 0); 

        a.recycle(); 
    } 

    public int getCount() { 
        return Integer.MAX_VALUE; 
    } 

    public Object getItem(int position) { 
        if (position >= mImageIds.length) { 
            position = position % mImageIds.length; 
        } 
        return position; 
    } 

    public long getItemId(int position) { 
        if (position >= mImageIds.length) { 
            position = position % mImageIds.length; 
        } 
        return position; 
    } 

    public View getView(int position, View convertView, ViewGroup parent) { 
        ImageView i = new ImageView(mContext); 
        if (position >= mImageIds.length) { 
            position = position % mImageIds.length; 
        } 
        i.setImageResource(mImageIds[position]); 
        i.setLayoutParams(new Gallery.LayoutParams(80, 80)); 
        i.setScaleType(ImageView.ScaleType.FIT_XY); 
        i.setBackgroundResource(mGalleryItemBackground); 
        return i; 
    } 

    public int checkPosition(int position) { 
        if (position >= mImageIds.length) { 
            position = position % mImageIds.length; 
        } 
        return position; 
    } 
}}
like image 105
pengwang Avatar answered Oct 10 '22 20:10

pengwang



If you want to enlarge the center selected image there is one possible way. On your onItemSelected method, just call an animation to zoom the object. The property of gallery is that it is always center-locked. So the center element will be always selected. Hope that will work..

<?xml version="1.0" encoding="utf-8"?>
<set
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false"
    android:fillAfter="true"
>
<scale 
       android:fromXScale="1.0"
       android:toXScale="1.50"
       android:fromYScale="1.0"
       android:toYScale="1.50"
       android:duration="600"
       android:pivotX="50%"
       android:pivotY="50%"
       android:fillAfter="true"/>

</set>

Do remember that you will have to store the previous view as when the element is move away from center it should be put to the normal size.

So you can have two views - prevView and currView.
Do the animation on the currView.

Thanks,
Sen

like image 40
Navaneeth Sen Avatar answered Oct 10 '22 19:10

Navaneeth Sen