Android中GridView中的图片重叠问题

Question

我将创建一个GridView以展示图片。即使我设置了垂直和水平间距，图片仍然会重叠在一起。这是为什么？如何解决这个问题？您可以在图像中看到这一点。

我的代码：

public class Images extends Activity {

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

        GridView gridView = (GridView) findViewById(R.id.grid_view);
        gridView.setAdapter(new ImageAdapter(this));
        gridView.setOnItemClickListener(new OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View v, int position, long id) { 
                Intent i = new Intent(getApplicationContext(), FullImageActivity.class);
                i.putExtra("id", position);
                startActivity(i);
            }
        });
    }

    public class ImageAdapter extends BaseAdapter {

        private Context mContext; 
        int width, height;

        public Integer[] mThumbIds = {
                R.drawable.radhe, R.drawable.radhe,
                R.drawable.radhe, R.drawable.radhe,
                R.drawable.radhe, R.drawable.radhe,
                R.drawable.radhe, R.drawable.radhe,
                R.drawable.radhe
        };

        // Constructor
        public ImageAdapter(Context c){
            mContext = c;
        }

        @Override
        public int getCount() {
            return mThumbIds.length;
        }

        @Override
        public Object getItem(int position) {
            return mThumbIds[position];
        }

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

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ImageView imageView = new ImageView(mContext);
            DisplayMetrics displaymetrics = new DisplayMetrics();
            getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
            width = displaymetrics.widthPixels;
            height = displaymetrics.heightPixels;
            imageView.setLayoutParams(new GridView.LayoutParams(width/3, height/3));
            imageView.setScaleType(ScaleType.FIT_XY);
            imageView.setImageResource(mThumbIds[position]);
            return imageView;
        }
    }
}

XML：

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/grid_view"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:numColumns="3"
    android:layout_marginTop="5dp"
    android:layout_marginBottom="5dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:horizontalSpacing="10dp"
    android:verticalSpacing="5dp"
    android:gravity="center"
    android:stretchMode="columnWidth" >  

</GridView>

这是我得到的输出结果。

- John R

---

不要硬编码 ImageView 的宽度和高度。你在这里硬编码了 new GridView.LayoutParams(width/3, height/3)。 - Gopal Gopi

@GopalRao 那么怎么做呢？我需要使用浮点数吗？ - John R

请按照Aashish-Systematix的建议使用new GridView.LayoutParams(GridView.LayoutParams.WRAP_CONTENT,GridView.LayoutParams.WRAP_CONTENT)和android:columnWidth="90dp"。 - Gopal Gopi

使用 GridView 的宽度而不是屏幕宽度。在计算宽度时需要考虑水平间距，不要硬编码高度，将其设置为 WRAP_CONTENT。 - Gopal Gopi

@GopalRao，您能详细解释一下吗？ - John R

Answer 1

请使用下面的代码片段，而不是你之前使用的代码：

<GridView 
    android:id="@+id/gv_Grid" 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:columnWidth="90dp"
    android:numColumns="3" 
    android:verticalSpacing="60dip"
    android:horizontalSpacing="10dip"
    android:stretchMode="columnWidth"
    android:gravity="center" 
    android:layout_below="@+id/rr_grid_titleBar" /> 

谢谢

- Aashish-Systematix

Answer 2

请在getView方法（Grid Adapter）中使用imageView.setPadding(20, 20, 20, 20);。填充会为网格项（图像视图）提供一些空间，使它们看起来分离。

- Amarjit