android多条目(多图)选择简单示例

1.需求介绍

一.自由多条目点选

二.全选

三.取消全选

四.反选

2.实现思路

明确一点,我们拿到的一个数据集合是已知的,为了实现用户点选操作,需要对集合中的每个数据元素添加是否已选择的状态属性,用户操作后首先更改集合中的数据元素状态,然后更改对应的view状态,最后遍历这个集合,把其中状态为已选的元素添加到新集合返回即可得到用户已选的数据。

3.代码实现

一.主布局

<?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">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#63da85">
        <TextView
            android:id="@+id/tv_select_reverse"
            android:clickable="true"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="10dp"
            android:gravity="center"
            android:text="反选"
            android:textSize="16dp"/>
        <TextView
            android:text="选择条目"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="marquee"
            android:gravity="center"
            android:singleLine="true"
            android:textColor="#ffffff"
            android:textSize="20dp" />

        <TextView
            android:id="@+id/tv_select_all_or_no"
            android:clickable="true"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_marginRight="10dp"
            android:gravity="center"
            android:text="全选"
            android:textSize="16dp"/>

    </RelativeLayout>

    <GridView
        android:id="@+id/gv_select"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_gravity="top"
        android:layout_weight="1"
        android:horizontalSpacing="5dp"
        android:numColumns="4"
        android:padding="1dp"
        android:verticalSpacing="5dp"></GridView>

    <Button
        android:id="@+id/btn_ok"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:text="OK"
        android:textColor="#000"
        android:textSize="16dp" />

</LinearLayout>

二.条目布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:id="@+id/iv_item"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/head"
        android:scaleType="fitXY"
        />
    <CheckBox
        android:id="@+id/cb_item"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="false"
        android:focusable="false"
        android:layout_gravity="right|top"
        />

</FrameLayout>

三.数据元素

package com.yuncai.menjin.multiselectiondemo;

import java.io.Serializable;

/**
 * Function:代表数据元素
 * Created by TianMing.Xiong on 18-9-28.
 */

public class ImgItem implements Serializable {
    private String srcPath ;
    private String thumbnailPath ;
    private boolean isCheck ;

    public ImgItem() {
    }

    public ImgItem(String srcPath, String thumbnailPath, boolean isCheck) {
        this.srcPath = srcPath;
        this.thumbnailPath = thumbnailPath;
        this.isCheck = isCheck;
    }

    public String getSrcPath() {
        return srcPath;
    }

    public void setSrcPath(String srcPath) {
        this.srcPath = srcPath;
    }

    public String getThumbnailPath() {
        return thumbnailPath;
    }

    public void setThumbnailPath(String thumbnailPath) {
        this.thumbnailPath = thumbnailPath;
    }

    public boolean isCheck() {
        return isCheck;
    }

    public void setCheck(boolean check) {
        isCheck = check;
    }
}

四.适配器

package com.yuncai.menjin.multiselectiondemo;

import android.app.Activity;
import android.content.Context;
import android.util.DisplayMetrics;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.ImageView;

import java.util.ArrayList;

/**
 * Function: 多图选择适配器
 * Created by TianMing.Xiong on 18-9-28.
 */

public class MultiSelectAdapter extends BaseAdapter {

    private Context context;
    private ArrayList<ImgItem> imgItems;

    public MultiSelectAdapter(Context context, ArrayList<ImgItem> imgItems) {
        this.context = context;
        this.imgItems = imgItems;
    }

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

    @Override
    public Object getItem(int position) {
        return imgItems.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 = View.inflate(context,R.layout.select_item,null);
            viewHolder = new ViewHolder(convertView);
            // 设置图片显示宽高
            ViewGroup.LayoutParams params = viewHolder.ivItem.getLayoutParams();
            DisplayMetrics dm = new DisplayMetrics();
            ((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(dm);
            params.width = dm.widthPixels / 4;
            params.height = dm.heightPixels / 4;
            viewHolder.ivItem.setLayoutParams(params);
            convertView.setTag(viewHolder);
        }else {
            viewHolder = (ViewHolder) convertView.getTag();
        }

        viewHolder.ivItem.setImageResource(R.drawable.head);
        viewHolder.cbItem.setChecked(imgItems.get(position).isCheck());
        return convertView;
    }
    // 1.处理用户点击选择事件(拿到当前状态并取反)-->改变数据并改变view
    public void onItemSelect(View view, int position) {
        if(imgItems==null){
            return;
        }
        ImgItem imgItem = imgItems.get(position);
        boolean isCheck = !imgItem.isCheck();
        imgItem.setCheck(isCheck);// change data
        ((ViewHolder)view.getTag()).cbItem.setChecked(isCheck);// change view
    }
    // 2.拿到所选条目
    public ArrayList<ImgItem> getSelectItems() {
        if(imgItems==null){
            return null;
        }
        ArrayList<ImgItem> items = new ArrayList<>();
        for (int i = 0; i < imgItems.size(); i++) {
            if(imgItems.get(i).isCheck()){
                items.add(imgItems.get(i));
            }
        }
        return items;
    }
    // 全选
    public void selectAll() {
        if(imgItems==null){
            return;
        }
        for (int i = 0; i < imgItems.size(); i++) {
            imgItems.get(i).setCheck(true);
        }
        notifyDataSetChanged();
    }
    // 取消全选
    public void cancelSelectAll() {
        if(imgItems==null){
            return;
        }
        for (int i = 0; i < imgItems.size(); i++) {
            imgItems.get(i).setCheck(false);
        }
        notifyDataSetChanged();
    }
    // 反选
    public void selectReverse() {
        if(imgItems==null){
            return;
        }
        for (int i = 0; i < imgItems.size(); i++) {
            imgItems.get(i).setCheck(!imgItems.get(i).isCheck());
        }
        notifyDataSetChanged();
    }
    // holder
    class ViewHolder{
        ImageView ivItem;
        CheckBox cbItem;
        public ViewHolder(View convertView) {
            this.ivItem = convertView.findViewById(R.id.iv_item);
            this.cbItem = convertView.findViewById(R.id.cb_item);
        }
    }
}

五.主调类

package com.yuncai.menjin.multiselectiondemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.Window;
import android.widget.AdapterView;
import android.widget.Button;
import android.widget.GridView;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

    private TextView tvSelectAllOrNo;
    private GridView gvSelect;
    private Button btnOk;
    private TextView tvSelectReverse;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        initView();
        initData();
    }

    private void initView() {
        tvSelectAllOrNo = (TextView) findViewById(R.id.tv_select_all_or_no);
        gvSelect = (GridView) findViewById(R.id.gv_select);
        btnOk = (Button) findViewById(R.id.btn_ok);
        tvSelectReverse = (TextView) findViewById(R.id.tv_select_reverse);
    }

    private void initData() {
        // get img data
        ArrayList<ImgItem> imgItems = new ArrayList<>();
        for (int i = 0; i < 50; i++) {
            ImgItem imgItem = new ImgItem("", "", false);
            imgItems.add(imgItem);
        }
        // grid view
        final MultiSelectAdapter multiSelectAdapter = new MultiSelectAdapter(this, imgItems);
        gvSelect.setAdapter(multiSelectAdapter);
        gvSelect.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                multiSelectAdapter.onItemSelect(view, position);
            }
        });
        // select reverse
        tvSelectReverse.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                multiSelectAdapter.selectReverse();
            }
        });
        // select all or no
        final String all = "全选";
        final String cancel_all = "取消全选";
        tvSelectAllOrNo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (all.equals(tvSelectAllOrNo.getText())) {
                    multiSelectAdapter.selectAll();
                    tvSelectAllOrNo.setText(cancel_all);
                } else {
                    multiSelectAdapter.cancelSelectAll();
                    tvSelectAllOrNo.setText(all);
                }
            }
        });
        // select result
        btnOk.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ArrayList<ImgItem> items = multiSelectAdapter.getSelectItems();
                Toast.makeText(MainActivity.this, "选择了" + items.size() + "条!", Toast.LENGTH_SHORT).show();
            }
        });

    }
}

4.效果图

 

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值