Adjust GridView with ImageViews to different screen sizes, Android

问题

I'd so appreciate if someone could advise on below.

My GridView has 3 columns that will be filled with ImageViews:

 <GridView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/grid_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:numColumns="3"
        android:columnWidth="0.3dp"
        android:horizontalSpacing="20dp"
        android:verticalSpacing="20dp"
        android:stretchMode="columnWidth">
    </GridView>

The Adapter that adds ImageViews into the grid cells:

@Override
public View getView(int position, View convertView, ViewGroup parent) {

    ImageView imageView = new ImageView(mContext);
    imageView.setImageResource(mThumbIds.get(position));
    imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
    imageView.setLayoutParams(new GridView.LayoutParams(300, 300));//problem here

    return imageView;
}

My images are all of the size 358x385px.

It works fine on bigger screens but fails on smaller ones (for example 4", 800x480). I'm not sure how to set LayoutParams to be like 1/3 of the screen width and the height to form a square.

I wouldn't like to add more images with appropriate sizes for different screen densities, instead I want to resize ImageViews only.

回答1:

Follow this code for squre gridview to all device compitible.

Step :1 Create one class SquareImageView.class that extends Imageview.

public class SquareImageView extends ImageView {

public SquareImageView(Context context) {
    super(context);
}

public SquareImageView(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public SquareImageView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    setMeasuredDimension(getMeasuredWidth(), getMeasuredWidth()); //Snap to width
}
}

Step :2 Change your adapter like this.

@Override
public View getView(int position, View convertView, ViewGroup parent) {

SquareImageView imageView = new SquareImageView (mContext);
imageView.setImageResource(mThumbIds.get(position));
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

return imageView;
}

And your xml like this

<GridView
    android:id="@+id/grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:numColumns="3"
    android:gravity="center"
    android:padding="3dp"
    android:stretchMode="columnWidth"
    android:horizontalSpacing="2dp"
    android:verticalSpacing="2dp"
    />

And test in small screen device..It will help you

来源：https://stackoverflow.com/questions/40581947/adjust-gridview-with-imageviews-to-different-screen-sizes-android

标签

android

android-layout

android-imageview

android-adapter

android-gridview