RecyclerView+CheckBox 实现横向的图片选择

废话不多说先来看看实现的效果图是不是你项目中想要的！！



效果图有点简陋，但是功能还是可以的，只要根据项目的需求加上UIMM的图片就可以完美了。。

1、CheckBox的布局文件主要有选中和没选中的状态：

选中状态：check_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- 边框 -->
<stroke
android:width="2dp"
android:color="#eaf45e" />
<!-- 圆角 -->
<corners android:radius="8dp" />
<!-- 边距 -->
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
</shape>

未选中状态：check_un_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 边框 -->
<stroke
android:width="2dp"
android:color="#fff" />
<!-- 圆角 -->
<corners android:radius="8dp" />
<!-- 边距 -->
<padding
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp" />
</shape>

check_box.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/check_selector" android:state_checked="true"/>
<item android:drawable="@drawable/check_un_selector" android:state_checked="false"/>
<item android:drawable="@drawable/check_un_selector"/>
</selector>

2、checkBox的布局文件完了，我们就开始进入主要的代码：

activity_main.xml

<android.support.v7.widget.RecyclerView
android:id="@+id/id_recyclerview_horizontal"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_centerVertical="true"
android:scrollbars="none"
/>

public class MainActivity extends AppCompatActivity {

private RecyclerView mRecyclerView;
private GalleryAdapter mAdapter;
private List<String> mDatas = new ArrayList<>();

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initDatas();
//得到控件
mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerview_horizontal);
//设置布局管理器
LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
//设置横向
linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
mRecyclerView.setLayoutManager(linearLayoutManager);
//设置适配器
mAdapter = new GalleryAdapter(this, mDatas);
mRecyclerView.setAdapter(mAdapter);
}

//添加数据
private void initDatas()
{
for (int i = 0; i < 50; i++) {
mDatas.add(""+i);
}
}
}

3、下面是主要的代码了，在适配器中定义一个Map变量来存放选中的状态就可以了。是不是很方便（ps:码农都知道）

public class GalleryAdapter extends RecyclerView.Adapter<GalleryAdapter.ViewHolder> {

private LayoutInflater mInflater;
private List<String> mDatas;
4000

// 存储勾选框状态的map集合
private Map<Integer, Boolean> map = new HashMap<>();

public GalleryAdapter(Context context, List<String> datats) {
mInflater = LayoutInflater.from(context);
mDatas = datats;
initMap();
}

//初始化map集合,默认为不选中
private void initMap() {
for (int i = 0; i < mDatas.size(); i++) {
map.put(i, false);
}
}

public class ViewHolder extends RecyclerView.ViewHolder {
public ViewHolder(View arg0) {
super(arg0);
}
ImageView mImg;
CheckBox checkBox;
}

@Override
public int getItemCount() {
return mDatas.size();
}

/**
* 创建ViewHolder
*/
@Override
public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
View view = mInflater.inflate(R.layout.activity_recycler_item,
viewGroup, false);
ViewHolder viewHolder = new ViewHolder(view);

viewHolder.mImg = (ImageView) view
.findViewById(R.id.id_index_gallery_item_image);
viewHolder.checkBox = (CheckBox) view
.findViewById(R.id.id_index_gallery_item_text);
return viewHolder;
}

/**
* 设置值
*/
@Override
public void onBindViewHolder(final ViewHolder viewHolder, final int position) {
//设置checkBox改变监听
viewHolder.checkBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {

@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
//用map集合保存
map.put(position, isChecked);
}
});
// 设置CheckBox的状态--在有加载更多时加上
if (map.get(position) == null) {
map.put(position, false);
}
viewHolder.checkBox.setChecked(map.get(position));
}
}

上面是用RecyclerView实现的一个简单功能，代码还有可以优化的地方，欢迎大家留言评价，相互学习。

PS: 学海无涯苦作舟