0

Myself trying to load the images(from webservice) in gridview and it was succesfully done. I used Lazy Adapter to load all images from web service.

If i click on some image it should be displayed in next Activity and while swiping that image next image should be displayed. Any Ideas???

Kalai Selvan.G
  • 482
  • 3
  • 10
  • 22

1 Answers1

0

This can be relatively easy realised using a ViewPager, I'd say. Consider the flow as follows: When the user selects a list item, pass on a list of all the images (e.g. their URIs) and an index indicating the one selected to the activity containing the ViewPager. You can then initialise the ViewPager's adapter with the passed on list and set the current item to display to the index.

Have a look at the API demos for some more hints on how to use a ViewPager, or read the blog post on developers.android.com. In stead of feeding Fragments as Views to the ViewPager, simply instantiate an ImageView - you may find this Q/A on SO useful for some pointers on how to do that. Also, probably equally important to read through is the documentation on PagerAdapter.

//Edit: Some pointers for coding up above suggestion:

Have your onItemClick create a new Intent, add the relevant data for retrieving the images as extra as well as the selected index and start the Activity:

@Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
    Intent intent = new Intent(this, ImageViewer.class);
    intent.putExtra(PAGE_POSITION, position);
    intent.putStringArrayListExtra(IMAGE_LIST, mImages)
    // or add a serializable, e.g. an ArrayList<T> with your POJOs
    intent.putExtra(IMAGE_LIST, mImages);
    startActivity(intent);
}

In your ImageViewer Activity containing the ViewPager, retrieve all the extras and initialise the ViewPager to the given position/index:

if (getIntent() != null && getIntent().getExtras() != null {
    mImagePosition = getIntent().getExtras().getInt(PAGE_POSITION, 0);
    mImageList = getIntent().getExtras().getStringArrayList(IMAGE_LIST);
    // or if you used Serializables
    mImageList = (ArrayList<T>) getIntent().getExtras().getSerializable(IMAGE_LIST);
    mViewPager.setAdapter(new ImagePagerAdapter());
    mViewPager.setCurrentItem(mImageIndex);
}

In the ImagePaderAdapter you instantiate the ImageViews containing the images you want to display. There are tons of examples out there, but it'll look something like this in the basis:

private class ImagePagerAdapter extends PagerAdapter {

    public int getCount() {
        return mImageList == null ? 0 : mImageList.size();
    }

    public Object instantiateItem(View pager, int position) {
        if (mInflater == null) mInflater = (LayoutInflater) container.getContext().getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        View view = mInflater.inflate(R.layout.image_pager_item_layout, null, false);
        ImageView photoImageView = (ImageView) view.findViewById(R.id.photo_imageview);

        mImageLoader().loadImage(mImageList.get(position), photoImageView);

        ((ViewPager) pager).addView(view, 0);

        return view;
    }       

    public void destroyItem(View pager, int position, Object object) { 
        ((ViewPager) pager).removeView((View) object);
    }

    public boolean isViewFromObject(View view, Object object) {
        return view.equals(object);
    }

    public void finishUpdate(View container) { }
    public void restoreState(Parcelable state, ClassLoader loader) { }
    public void startUpdate(View container) { }
    public Parcelable saveState() { return null; }
}

Note that I have not tested the code above, nor is it meant to be complete. For instance, I assume you know how to get a reference to a LayoutInflater yourself and have a 'lazy' image loader that asynchronously sets an image against an ImageView. The image_pager_item_layout file can simply be an ImageView, but also a more complex hierarchy of views inside a ViewGroup (like with ListView and GridView), e.g. you can easily add an caption to images. It's quite similar to

Community
  • 1
  • 1
MH.
  • 45,303
  • 10
  • 103
  • 116
  • I added a bunch of snippets to illustrate the work flow earlier suggested. Hope that helps! – MH. Feb 20 '12 at 10:04
  • Thanks..Are u mentioning me to use Viewpager instead Gridview or what? – Kalai Selvan.G Feb 20 '12 at 10:29
  • No, you should keep the GridView to display a 'gallery'-like UI (assuming that's what you want, if I understood you correctly) and read through my suggestions from that point on. So the flow is more or less: GridView (gallery-like interface) -> onItemClick -> ImageViewer (containing ViewPager that enables you to flick from one specific image to another). Compare it to the standard Gallery app, which also initially shows images in a grid, but at the same time allows you to swipe to the previous/next after having 'enlarged' an image. – MH. Feb 20 '12 at 10:37
  • Hello MH.. mImageLoader().loadImage(mImageList.get(position), photoImageView); ((ViewPager) pager).addView(view, 0); Here what mImageloader() function does?..And i used string Arrray to store the ImageuRl,How to Store these in arraylist.please Guide me friend – Kalai Selvan.G Feb 21 '12 at 06:37
  • The mImageLoader is just an object respresenting a random image loading libary, e.g. the one in the [libs-for-android project](http://code.google.com/p/libs-for-android/wiki/ImageLoader) from Google and is responsible for asynchronously setting an image against an ImageView. And there's not really any need to convert your array to a list, because you can use arrays just as easy, but if you insist on it, you can convert it with the help of the static [Arrays.asList(...)](http://docs.oracle.com/javase/6/docs/api/java/util/Arrays.html#asList%28T...%29) method. – MH. Feb 21 '12 at 08:03
  • Sorry, but this is as far as I go. I'll gladly help out the community that so willingsly helps others, but I'm not a personal helpdesk or tutor. I'm confident that you'll be able to accomplish what you're looking for with the pointers given. If not, you can always ask new questions regarding specific problems you encounter along the way. Cheers. – MH. Feb 21 '12 at 09:22
  • okay..mImageLoader().loadImage(mImageList.get(position), photoImageView); Here i am getting mImageList.length only not its position – Kalai Selvan.G Feb 21 '12 at 09:56
  • I'm not sure what you're trying to ask - do you have problems retrieving a specific element from an array? If your `mImageList` variable is an array, access any item by its index: `mImageList[index]` (where 0 <= `index` <= `mImageList.length`). – MH. Feb 21 '12 at 10:11