Android GridView scale type similar to html contain

Question

I have a gridview with 3 columns. I want the images to be scaled so that the entire image is displayed in each gridview cell, even if that means leaving blank space at the top/bottom (landscape) or sides (portrait). The effect should be similar to html background-size:contain.

Incidentally, no matter which scale type I pick, except FIT-XY, the pictures, which as all wider than tall, appear as overlapping each other. In FIT-XY, the pictures are cropped and then stretched to fill. And I have no idea how the crop is being chosen. I would have thought FIT-XY would have just stretched and fitted the entire picture.

Shown below is FIT-CENTER. The image of the truck at the bottom is the full image shown in an imageview from clicking on a gridview item. I would like the gridview to display the full image.

Also, here is FIT-XY:

activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.carrentalapp.MainActivity"
    tools:ignore="MergeRootFrame"
    android:layout_gravity="center_horizontal"
    android:gravity="center_horizontal">

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="wrap_content"
        android:layout_height="250dp"
        android:numColumns="3" 
        android:horizontalSpacing="10dp"
        android:verticalSpacing="5dp"
        android:stretchMode="columnWidth"
        android:padding="5dp"> 
    </GridView>

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher"
        android:layout_gravity="center_horizontal" />

</LinearLayout>

ImageAdapter.getView:

public View getView(int position, View convertView, ViewGroup parent) {
  // TODO Auto-generated method stub
  Toast.makeText(MainActivity.this, "in get view", Toast.LENGTH_SHORT).show();
  thumbnail = new ImageView(context);
  thumbnail.setImageResource(image_ids[position]);
  thumbnail.setScaleType(ImageView.ScaleType.CENTER);
  thumbnail.setLayoutParams(new GridView.LayoutParams(188,200));
  return thumbnail;
}

Answer 1

The scale type you want is indeed FIT_CENTER.

It looks like your ImageViews are bigger than you want, and hence are the cause of your issue. Check your ImageView width/height values, and if those seem correct (you probably want match_parent), then check your GridView column widths.

Edit:

Change your lines:

thumbnail.setScaleType(ImageView.ScaleType.CENTER);
thumbnail.setLayoutParams(new GridView.LayoutParams(188,200));

To:

thumbnail.setScaleType(ImageView.ScaleType.FIT_CENTER);
thumbnail.setLayoutParams(new GridView.LayoutParams(LayoutParams.MATCH_PARENT,200));