GridView常见使用

如果是列表(单列多行形式)的使用ListView,如果是多行多列网状形式的优先使用GridView

举个栗子先:

activity_test

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000">

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:numColumns="3"
        android:columnWidth="80dp"
        android:stretchMode="columnWidth" />
</LinearLayout>

item_test

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/item_img"
        android:layout_width="60dp"
        android:layout_height="60dp"
        />

    <TextView
        android:id="@+id/item_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:textColor="#ffffff" />
</LinearLayout>

TestActivity

public class TestActivity extends Activity {
    private GridView gridView;
    private List<Map<String,Object>> dataList;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        gridView = findViewById(R.id.gridView);

        initData();

        String[] from = {"img","text"};
        int[] to = {R.id.item_img,R.id.item_text};
        SimpleAdapter adapter = new SimpleAdapter(this,dataList,R.layout.item_test,from,to);
        gridView.setAdapter(adapter);

		gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                Toast.makeText(TestActivity.this,"item"+i,Toast.LENGTH_SHORT).show();
            }
        });
    }

    private void initData() {
        int[] icons = {R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher,
                        R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher};
        dataList = new ArrayList<Map<String,Object>>();
        for(int i=0;i<icons.length;i++){
            Map<String,Object> map = new HashMap<>();
            map.put("img",icons[i]);
            map.put("text","item"+i);
            dataList.add(map);
        }
    }
}

效果图
在这里插入图片描述
属性介绍

numColumns:列数,可以设置特定列数,也可以设置为“auto_fit”,即列数设置为自动,而能显示多少列则取决于每列多宽,即columnWidth这个属性
如果设置为

      android:numColumns="auto_fit"
      android:columnWidth="80dp"

则效果为:
在这里插入图片描述

如果设置为

        android:numColumns="auto_fit"
        android:columnWidth="150dp"

则效果为
在这里插入图片描述
stretchMode:设置GridView中的条目以什么缩放模式去填充剩余空间

可选值为
columnWidth

  <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:numColumns="3"
        android:columnWidth="80dp"
        android:stretchMode="columnWidth" />

在这里插入图片描述

spacingWidth
在这里插入图片描述
none
在这里插入图片描述
spacingWidthUniform
在这里插入图片描述

举个栗子2

这个栗子效果和第一个栗子是相同的,可以自定义的适配器,还有自定义layout

写一个图片实体类Bean

public class Bean {
    private int imageId;
    private String imageName;

    public Bean(int imageId, String imageName) {
        this.imageId = imageId;
        this.imageName = imageName;
    }

    public int getImageId() {
        return imageId;
    }

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

    public String getImageName() {
        return imageName;
    }

    public void setImageName(String imageName) {
        this.imageName = imageName;
    }
}

TestActivity

public class TestActivity extends Activity {
    private GridView gridView;
    private List<Bean> beans;
    private Bean bean;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        gridView = findViewById(R.id.gridView);

        initData();

        GridViewAdapter adapter = new GridViewAdapter(beans,this);
        gridView.setAdapter(adapter);
        
		gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                Toast.makeText(TestActivity.this,"item"+i,Toast.LENGTH_SHORT).show();
            }
        });
    }

    private void initData() {
        beans = new ArrayList<>();

        int[] icons = {R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher,
                        R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher};

        for(int i=0;i<icons.length;i++){
            bean = new Bean(icons[i],"item"+i);
            beans.add(bean);
        }
    }

    class GridViewAdapter extends BaseAdapter{
        private List<Bean> data;//数据源
        private Context context;//上下文

        public GridViewAdapter(List<Bean> data, Context context) {
            this.data = data;
            this.context = context;
        }

        @Override
        public int getCount() {
            return data.size();
        }

        @Override
        public Object getItem(int i) {
            return data.get(i);
        }

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

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {
            ViewHolder viewHolder = null;
            if(view == null){
                view = LayoutInflater.from(context).inflate(R.layout.item_test,null);
                viewHolder = new ViewHolder();
                viewHolder.img = view.findViewById(R.id.item_img);
                viewHolder.text = view.findViewById(R.id.item_text);
                view.setTag(viewHolder);
            }

            viewHolder = (ViewHolder) view.getTag();
            viewHolder.img.setImageResource(data.get(i).getImageId());
            viewHolder.text.setText(data.get(i).getImageName());
            return view;
        }

        class ViewHolder{
            ImageView img;
            TextView text;
        }
    }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值