Android基础：GridView

最新推荐文章于 2024-01-16 08:39:36 发布

火鸟菲戈

最新推荐文章于 2024-01-16 08:39:36 发布

阅读量545

点赞数

分类专栏： Android_UI 文章标签： gridview

本文链接：https://blog.csdn.net/ss1168805219/article/details/54137767

版权

Android_UI 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

GridView简单使用

简介

GridView是网格，同ListView一样，也有scrollbar。

效果图

这里写图片描述

xml属性

属性	说明
android:columnWidth=”60dp”	列宽
android:scrollbars=”vertical”	scrollbar
android:numColumns=”auto_fit”	列数
android:horizontalSpacing=”5dp”	网格水平间距
android:verticalSpacing=”10dp”	网格竖直间距
android:gravity=”end”	内容排放
android:stretchMode=”spacingWidth”	设置拉伸模式
以下是可选值：	–
none	不拉伸
spacingWidth	拉伸元素间的间隔空隙
columnWidth	仅仅拉伸表格元素自身
spacingWidthUniform	既拉元素间距又拉伸他们之间的间隔空袭

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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:padding="5dp"
    tools:context="com.cqc.gridviewdemo01.MainActivity">

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:columnWidth="60dp"
        android:gravity="end"
        android:scrollbars="vertical"
        android:scrollbarSize="50dp"
        android:horizontalSpacing="5dp"
        android:numColumns="auto_fit"
        android:stretchMode="spacingWidth"
        android:verticalSpacing="10dp"
        />


</LinearLayout>

方法

xml属性都有对应的代码设置方式，一般是setxx(...),或者这些值是通过getxx(...)

方法	说明
setAdapter (ListAdapter adapter)	设置适配器
setSelection (int position)	默认选中第几个
setOnItemClickListener (AdapterView.OnItemClickListener listener)	设置监听

GridView的adapter继承自BaseAdapter

adapter

package com.cqc.gridviewdemo01;

import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

/**
 * Created by ${cqc} on 2017/1/5.
 */

public class MyAdapter extends BaseAdapter {

    private String[] array;
    private int position;

    public void setPosition(int position) {
        this.position = position;
    }

    public MyAdapter(String[] array) {
        this.array = array;
    }

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

    @Override
    public Object getItem(int i) {
        return array[i];
    }

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

    @Override
    public View getView(int i, View convertView, ViewGroup viewGroup) {
        final ViewHolder holder;
        if (convertView == null) {
            convertView = View.inflate(viewGroup.getContext(), R.layout.item, null);
            holder = new ViewHolder(convertView);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }
        holder.tv.setText(array[i]);
        return convertView;
    }

    public class ViewHolder {
        TextView tv;

        public ViewHolder(View itemView) {
            tv = (TextView) itemView.findViewById(R.id.tv);
        }
    }
}

使用

provinces = getResources().getStringArray(R.array.province);

gridView = (GridView) findViewById(R.id.gridView);
adapter = new MyAdapter(provinces);
gridView.setAdapter(adapter);

gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int i, long l) {
        view.setSelected(true);
    }
});

源码

https://git.oschina.net/AndroidUI/GridViewDemo01
http://git.oschina.net/beifang2008/gridview03

图片选择后的显示

多图选择后，用GridView显示，当点击删除按钮后，删除该图片；当点击+按钮时，重新选择图片。
如果对多选中9张图片，有2种类型，一种是当数量达到9时不显示+，另一种是显示+
第一种：

@Override
public int getCount() {
    if (pathList.size() == limitCount) {
        return limitCount;
    }
    return pathList.size() + 1;
}

第二种:

@Override
public int getCount() {
    return pathList.size() + 1;
}

第一种：

由于有+，所以adapter中getCount()返回pathList.size() + 1
这里写图片描述

public class MainActivity extends AppCompatActivity {

    private GridView gridView;
    private List<String> pathList;
    private MyAdapter adapter;
    private int limitCount = 3;//最多选择3张

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findViewById(R.id.btn1).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                MultiImageSelector.create().count(3).start(MainActivity.this, 100);
            }
        });

        gridView = (GridView) findViewById(R.id.gridView);
        gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                if (position < pathList.size()) {
                    pathList.remove(position);
                    adapter.notifyDataSetChanged();
                } else {
                    MultiImageSelector.create().count(limitCount).start(MainActivity.this, 100);
                }
            }
        });

    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == 100) {
            if (resultCode == RESULT_OK) {
                pathList = data.getStringArrayListExtra(MultiImageSelectorActivity.EXTRA_RESULT);
                if (pathList.size() <= limitCount + 1) {
                    adapter = new MyAdapter();
                    gridView.setAdapter(adapter);
                } else {
                    Toast.makeText(MainActivity.this, "最多选择" + limitCount + "个", Toast.LENGTH_SHORT).show();
                }
            }
        }
    }

    public class MyAdapter extends BaseAdapter {

        @Override
        public int getCount() {
            return pathList.size() + 1;
        }

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

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

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ViewHolder holder;
            if (convertView == null) {
                convertView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item, parent, false);
                holder = new ViewHolder(convertView);
                convertView.setTag(holder);
            } else {
                holder = (ViewHolder) convertView.getTag();
            }

            if (position == pathList.size()) {
                Glide.with(parent.getContext()).load(R.mipmap.add).into(holder.iv);
                holder.iv_delete.setVisibility(View.GONE);
            } else {
                Glide.with(parent.getContext()).load("file://" + pathList.get(position)).into(holder.iv);
            }
            return convertView;
        }
    }

    public static class ViewHolder {

        ImageView iv;
        ImageView iv_delete;

        public ViewHolder(View itemView) {
            super();
            iv = (ImageView) itemView.findViewById(R.id.iv);
            iv_delete = (ImageView) itemView.findViewById(R.id.iv_delete);
        }
    }
}

gridview分3列显示，把屏幕的宽度/3设置imageview的宽和高，或者convertview的宽和高。

获取宽

int mGridWidth;

public MyAdapter() {
    WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
    int width = 0;
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) {
        Point size = new Point();
        wm.getDefaultDisplay().getSize(size);
        width = size.x;
    } else {
        width = wm.getDefaultDisplay().getWidth();
    }
    mGridWidth = width / 3;
}

当设为imageview的宽和高时,item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="100dp"
    android:layout_height="100dp">

    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"/>

    <ImageView
        android:id="@+id/iv_delete"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignParentRight="true"
        android:background="@mipmap/delete"/>
</RelativeLayout>

设置ImageView的宽高

ViewGroup.LayoutParams params = holder.iv.getLayoutParams();
params.width = mGridWidth;
params.height = mGridWidth;
holder.iv.setLayoutParams(params);

当然也可以设置convertview的宽高

ViewGroup.LayoutParams params = convertView.getLayoutParams();
params.width = mGridWidth;
params.height = mGridWidth;
convertView.setLayoutParams(params);

第二种

item

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:id="@+id/root_view"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/iv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"/>

    <ImageView
        android:id="@+id/iv_delete"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_alignParentRight="true"
        android:background="@mipmap/delete"/>
</RelativeLayout>

adapter = new MyAdapter();
gridView.setAdapter(adapter);

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    if (requestCode == 100) {
        if (resultCode == RESULT_OK) {
            pathList.clear();
            pathList.addAll(data.getStringArrayListExtra(MultiImageSelectorActivity.EXTRA_RESULT));
            adapter.notifyDataSetChanged();
        }
    }
}

public class MyAdapter extends BaseAdapter {
    int mItemWidth;

    public MyAdapter() {
        WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
        int width = 0;
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) {
            Point size = new Point();
            wm.getDefaultDisplay().getSize(size);
            width = size.x;
        } else {//getWidth()在API>=13后 过时了，
            width = wm.getDefaultDisplay().getWidth();
        }
        mItemWidth = width / 3;
    }

    @Override
    public int getCount() {
        if (pathList.size() == limitCount) {
            return limitCount;
        }
        return pathList.size() + 1;
    }

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

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

    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = LayoutInflater.from(parent.getContext()).inflate(R.layout.item2, parent, false);
            holder = new ViewHolder(convertView);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        ViewGroup.LayoutParams params = convertView.getLayoutParams();
        params.width = mItemWidth;
        params.height = mItemWidth;
        convertView.setLayoutParams(params);

        if (position == pathList.size()) {
            Glide.with(parent.getContext()).load(R.mipmap.add).into(holder.iv);
            holder.iv_delete.setVisibility(View.GONE);
            holder.iv.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    MultiImageSelector.create().count(9).start(MainActivity2.this, 100);
                }
            });
        } else {
            Glide.with(parent.getContext()).load("file://" + pathList.get(position)).into(holder.iv);
            holder.iv_delete.setVisibility(View.VISIBLE);
            holder.iv_delete.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    pathList.remove(position);
                    notifyDataSetChanged();
                }
            });
        }
        return convertView;
    }
}

public class ViewHolder {

    ImageView iv;
    ImageView iv_delete;

    public ViewHolder(View itemView) {
        super();
        iv = (ImageView) itemView.findViewById(R.id.iv);
        iv_delete = (ImageView) itemView.findViewById(R.id.iv_delete);
    }
}

demo: https://git.oschina.net/beifang2008/gridview03

GridViewWithHeaderAndFooter

可以像ListView一样添加头尾布局，而且在setOnItemClickListener(...)不需在list(position-headerCount-footerCount),直接使用position。

这里写图片描述

Gradle

compile 'in.srain.cube:grid-view-with-header-footer:1.0.12'

使用示例

注意addHeaderView()+addFooterView()必须在setAdapter（）前

gridVivew = (GridViewWithHeaderAndFooter) findViewById(R.id.gridView);


View headerView1 = LayoutInflater.from(context).inflate(R.layout.header_1, gridVivew, false);
View headerView2 = LayoutInflater.from(context).inflate(R.layout.header_2, gridVivew, false);
View footerView1 = LayoutInflater.from(context).inflate(R.layout.footer_1, gridVivew, false);
View footerView2 = LayoutInflater.from(context).inflate(R.layout.footer_2, gridVivew, false);

//addHeaderView()+addFooterView()必须在setAdapter（）前
gridVivew.addHeaderView(headerView1);
gridVivew.addHeaderView(headerView2);
gridVivew.addFooterView(footerView1);
gridVivew.addFooterView(footerView2);

MyGridViewAdapter adapter = new MyGridViewAdapter();
gridVivew.setAdapter(adapter);
gridVivew.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        Toast.makeText(context, provinces[position] + position, Toast.LENGTH_SHORT).show();
    }
});

Demo: https://git.oschina.net/libraryDemo/GridViewWithHeaderAndFooter01

火鸟菲戈

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Android基础：GridView

GridView简单使用简介GridView是网格，同ListView一样，也有scrollbar。效果图xml属性属性说明 android:columnWidth=”60dp” 列宽 android:scrollbars=”vertical” scrollbar android:numColumns=”auto_fit” 列数 android:horizont
复制链接

扫一扫

专栏目录