Search code examples
androidandroid-gallery

Properly scaling images for Gallery widget using an adapter


I'm using a Gallery widget adapter class to lazy load images in. The images I'm getting from the web service are 640x431. I want the images to fill the screen by width, while keeping the same aspect ratio no matter what what the height is.

I'm not sure how to handle this type of scaling.

Below is my Gallery adapter:

public class GalleryImageAdapter extends BaseAdapter{

    private Activity activity;
    private ArrayList<String> listOfImages;
    public ImageLoader imageLoader; 


    public GalleryImageAdapter(Activity a, ArrayList<String> listOfImages){
        activity = a;
        this.listOfImages = listOfImages;
        imageLoader=new ImageLoader(activity.getApplicationContext());
    }

    @Override
    public int getCount() {
        return listOfImages.size();
    }

    @Override
    public Object getItem(int position) {
        return listOfImages.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup viewGroup) {
        View v = convertView;


        if (v == null) {
            LayoutInflater vi = (LayoutInflater) activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = vi.inflate(R.layout.gallery_layout, null);

        }


        final String url = listOfImages.get(position);


         ImageView galleryImage = (ImageView) v.findViewById(R.id.galleryImage);
         imageLoader.DisplayImage(url, activity, galleryImage);
        return v;
    }

}

gallery_layout.xml

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

    <ImageView
        android:id="@+id/galleryImage"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="centerInside"/>

</LinearLayout>

Solution

  • If I understand correctly, you want the current image to take the whole width of the widget when shown (with the next and previous images not visible until we scroll horizontally), right?

    You need to set the LayoutParams of the returned view from your adapter's getView() method as follow:

    @Override
    public View getView(int position, View convertView, ViewGroup viewGroup) {
    
        // current code here ..
    
        v.setLayoutParams(new Gallery.LayoutParams(LayoutParams.MATCH_PARENT,
             LayoutParams.MATCH_PARENT));
        return v;
    }
    

    As for the ScaleType on the ImageView, use centerInside if you want the whole image to fit the space, or use centerCrop if it's fine to crop it.