Android GridView用法介绍

2022-08-01 18:44:34

　　GridView（网格视图）是按照行和列的方式来显示内容的，一般用于显示图片等内容，比如实现九宫格图；

第一个例子：

实现代码为：

MainActivity.java

package com.xiaozhang.gridview2;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        GridView gridView = (GridView) findViewById(R.id.GridView1);

        // 为GridView设置适配器
        gridView.setAdapter(new MyAdapter(this));

        // 注册监听事件
        gridView.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v,
                    int position, long id) {
                Toast.makeText(MainActivity.this, "pic" + (position + 1),
                        Toast.LENGTH_SHORT).show();
            }
        });
    }
}

// 自定义适配器
class MyAdapter extends BaseAdapter {
    // 上下文对象
    private Context context;
    // 图片数组
    private Integer[] imgs = { R.drawable.pic2, R.drawable.pic1,
            R.drawable.pic2, R.drawable.pic3, R.drawable.pic4, R.drawable.pic5,
            R.drawable.pic6, R.drawable.pic7, R.drawable.pic8, R.drawable.pic2,
            R.drawable.pic1, R.drawable.pic2 };

    MyAdapter(Context context) {
        this.context = context;
    }

    public int getCount() {
        return imgs.length;
    }

    public Object getItem(int item) {
        return item;
    }

    public long getItemId(int id) {
        return id;
    }

    // 创建View方法
    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView;
        if (convertView == null) {
            imageView = new ImageView(context);
            imageView.setLayoutParams(new GridView.LayoutParams(128, 128)); // 设置ImageView对象布局
            imageView.setAdjustViewBounds(false); // 设置边界对齐
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); // 设置刻度的类型
            imageView.setPadding(4, 4, 4, 4); // 设置间距
        } else {
            imageView = (ImageView) convertView;
        }
        imageView.setImageResource(imgs[position]); // 为ImageView设置图片资源
        return imageView;
    }
}

activity_main.xml

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

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#CC66FF"
        android:gravity="center"
        android:text="网格视图"
        android:textSize="30sp" />

    <!--
    android:columnWidth:设置列的宽度
    android:horizontalSpacing：设置列与列之间的间距
    android:numColumns：设置列数
    android:stretchMode：缩放模式
    android:verticalSpacing:行与行之间的间距
    -->

    <GridView
        android:id="@+id/GridView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:columnWidth="30dp"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dp" />

</LinearLayout>

第二个例子：

MainActivity.java

package com.xiaozhang.gridview2;

import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;

public class MainActivity extends Activity {
    private GridView gridView;

    private String[] titles = new String[] { "图片1", "图片2", "图片3", "图片4", "图片5",
            "图片6", "图片7", "图片8", "图片9" };
    // 图片数组
    private int[] images = new int[] { R.drawable.pic1, R.drawable.pic2,
            R.drawable.pic3, R.drawable.pic4, R.drawable.pic5, R.drawable.pic6,
            R.drawable.pic7, R.drawable.pic8, R.drawable.pic8 };

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        gridView = (GridView) findViewById(R.id.gridview);
        PictureAdapter adapter = new PictureAdapter(titles, images, this);
        gridView.setAdapter(adapter);

        gridView.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v,
                    int position, long id) {
                Toast.makeText(MainActivity.this, "图片：" + (position + 1),
                        Toast.LENGTH_SHORT).show();
            }
        });
    }
}

// 自定义适配器
class PictureAdapter extends BaseAdapter {
    private LayoutInflater inflater;
    private List<Picture> pictures;

    public PictureAdapter(String[] titles, int[] images, Context context) {
        super();
        pictures = new ArrayList<Picture>();
        inflater = LayoutInflater.from(context);
        for (int i = 0; i < images.length; i++) {
            Picture picture = new Picture(titles[i], images[i]);
            pictures.add(picture);
        }
    }

    @Override
    public int getCount() {
        if (null != pictures) {
            return pictures.size();
        } else {
            return 0;
        }
    }

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

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

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder viewHolder;
        if (convertView == null) {
            convertView = inflater.inflate(R.layout.picture, null);
            viewHolder = new ViewHolder();
            viewHolder.title = (TextView) convertView.findViewById(R.id.title);
            viewHolder.image = (ImageView) convertView.findViewById(R.id.image);
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
        }
        viewHolder.title.setText(pictures.get(position).getTitle());
        viewHolder.image.setImageResource(pictures.get(position).getImageId());
        return convertView;
    }

}

class ViewHolder {
    public TextView title;
    public ImageView image;
}

class Picture {
    private String title;
    private int imageId;

    public Picture() {
        super();
    }

    public Picture(String title, int imageId) {
        super();
        this.title = title;
        this.imageId = imageId;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public int getImageId() {
        return imageId;
    }

    public void setImageId(int imageId) {
        this.imageId = imageId;
    }
}

GridView的布局文件：activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gridview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnWidth="90dp"
    android:gravity="center"
    android:horizontalSpacing="10dp"
    android:numColumns="auto_fit"
    android:stretchMode="columnWidth"
    android:verticalSpacing="10dp" />

GridView里显示的内容：picture.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/root"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/image"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_gravity="center"
        android:padding="4dp"
        android:scaleType="fitXY" />

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center_horizontal" />

</LinearLayout>

码农公寓

相关文章