欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Android widght之GridView

程序员文章站 2022-05-30 13:29:47
...

简介

总体而言与ListView差别并不大,不过GridView是表格,而ListView是列表,与ListView共同继承 android.widget.AbsListView。

ListView

简单介绍一下GridView的特有属性
属性名称 相应方法 简介
android:columnWidth setColumnWidth(int) 指定每个item的固定宽度
android:gravity setGravity(int) 指定每个item的显示位置
android:horizontalSpacing setHorizontalSpacing(int) 定义item之间的默认水平间隔
android:verticalSpacing setVerticalSpacing(int) 定义item之间默认的垂直间距
android:numColumns setNumColumns(int) 定义显示列的个数
android:stretchMode setStretchMode(int) 缩放模式

使用

页面布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.toommi.activity.myandroidtest.TestGridActivity">

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:numColumns="4"
        android:verticalSpacing="10dp"></GridView>

</RelativeLayout>

item布局:
<?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:gravity="center"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/iv_img"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/tv_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="6dp"
        android:text="icon"
        android:textColor="#000"
        android:textSize="18sp" />

</LinearLayout>

建立与item布局对应的实体(model):
public class ImageTextInfo implements Parcelable {
    private int imgResources;
    private String imgName;

    public ImageTextInfo() {
    }

    public ImageTextInfo(int imgResources, String imgName) {
        this.imgResources = imgResources;
        this.imgName = imgName;
    }

    public int getImgResources() {
        return imgResources;
    }

    public void setImgResources(int imgResources) {
        this.imgResources = imgResources;
    }

    public String getImgName() {
        return imgName;
    }

    public void setImgName(String imgName) {
        this.imgName = imgName;
    }

    @Override
    public int describeContents() {
        return 0;
    }

    @Override
    public void writeToParcel(Parcel dest, int flags) {
        dest.writeInt(this.imgResources);
        dest.writeString(this.imgName);
    }

    protected ImageTextInfo(Parcel in) {
        this.imgResources = in.readInt();
        this.imgName = in.readString();
    }

    public static final Parcelable.Creator<ImageTextInfo> CREATOR = new Parcelable.Creator<ImageTextInfo>() {
        @Override
        public ImageTextInfo createFromParcel(Parcel source) {
            return new ImageTextInfo(source);
        }

        @Override
        public ImageTextInfo[] newArray(int size) {
            return new ImageTextInfo[size];
        }
    };
}

适配器(与ListView的适配没什么差别,还是贴一下):
public class TestGridAdapter extends BaseAdapter {
    private Context context;
    private List<ImageTextInfo> list;

    public TestGridAdapter(Context context, List<ImageTextInfo> list) {
        this.context = context;
        this.list = list;
    }

    @Override
    public int getCount() {
        return list == null ? 0 : list.size();
    }

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

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

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder = null;
        if (null == convertView) {
            holder = new ViewHolder();
            convertView = LayoutInflater.from(context).inflate(R.layout.item_grid_img_txt, null);
            holder.img = (ImageView) convertView.findViewById(R.id.iv_img);
            holder.name = (TextView) convertView.findViewById(R.id.tv_name);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }
        ImageTextInfo info = list.get(position);
        holder.img.setImageResource(info.getImgResources());
        holder.name.setText(info.getImgName());
        return convertView;
    }

    class ViewHolder {
        ImageView img;
        TextView name;
    }
}

使用测试:
GridView gridView = (GridView) findViewById(R.id.gridView);
List<ImageTextInfo> list = new ArrayList<>();

for (int i = 0; i < 50; i++) {
    list.add(new ImageTextInfo(R.mipmap.ic_launcher, "o~o" + i));
}

TestGridAdapter adapter = new TestGridAdapter(this, list);
gridView.setAdapter(adapter);

效果图:

Android widght之GridView


拓展

有的人就会想了,为什么没有横向的?

那么我们更改一下 界面布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.toommi.activity.myandroidtest.TestGridActivity">

    <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <GridView
                android:id="@+id/gridView"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center"
                android:numColumns="auto_fit"
                android:stretchMode="spacingWidthUniform" />
        </LinearLayout>

    </HorizontalScrollView>

</RelativeLayout>

接下来我们再更改一下测试代码:
GridView gridView = (GridView) findViewById(R.id.gridView);
List<ImageTextInfo> list = new ArrayList<>();
for (int i = 0; i < 50; i++) {
    list.add(new ImageTextInfo(R.mipmap.ic_launcher, "o~o" + i));
}

TestGridAdapter adapter = new TestGridAdapter(this, list);


int size = list.size();
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
float density = dm.density;
int allWidth = (int) (110 * size * density);
int itemWidth = (int) (100 * density);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
        allWidth, LinearLayout.LayoutParams.MATCH_PARENT);
gridView.setLayoutParams(params);// 设置GirdView布局参数
gridView.setColumnWidth(itemWidth);// 列表项宽
gridView.setHorizontalSpacing(10);// 列表项水平间距
gridView.setStretchMode(GridView.NO_STRETCH);
gridView.setNumColumns(size);//总长度

gridView.setAdapter(adapter);
根据个人需求可以适当的调整代码!

效果图:

Android widght之GridView


横向布局

http://blog.csdn.net/sunshine_mood/article/details/49792199


知识贵在分享!