GrideView 经常被用到,这里做一个用选择图片的功能。
废话不多说,上图:
1. GrideView 在activity或者fragment中的布局布局
<GridView
android:id="@+id/gvPhotos"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:columnWidth="90dp"
android:horizontalSpacing="8dp"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="8dp" />```
2. GrideView 的item的布局
这里有个控件叫做 GrideViewItemLayout ,是专门为GrideView做的,用于item显示为正方形的。源码在最后
<?xml version="1.0" encoding="utf-8"?>
<com.mg.axe.puzzlegame.GrideViewItemLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/ivPic"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true" />
<RelativeLayout
android:id="@+id/rlSelected"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#AB000000">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_centerInParent="true"
android:src="@mipmap/checked_blue" />
</RelativeLayout>
</com.mg.axe.puzzlegame.GrideViewItemLayout>
3. 上代码
- javabean
/**
* iten的javabean
*/
public class PhotoBean {
public int resId; // 图片id
public boolean checked; // 图片是否被选中
public PhotoBean() {
}
public PhotoBean(int resId, boolean checked) {
this.resId = resId;
this.checked = checked;
}
public int getResId() {
return resId;
}
public void setResId(int resId) {
this.resId = resId;
}
public boolean isChecked() {
return checked;
}
public void setChecked(boolean checked) {
this.checked = checked;
}
}
2. activity或者fragment中的代码
// 定义控件
private GridView gvPhotos;
private ImageAdapter mImageAdapter;
private ArrayList<PhotoBean> mPicList = new ArrayList<>();
// 初始化数据, 这里多放一些图片
mPicList.add(new PhotoBean(R.mipmap.num_3_3, false));
...
// 查找控件
gvPhotos = (GridView) findViewById(R.id.gvPhotos);
gvPhotos.setAdapter(mImageAdapter = new ImageAdapter(ChosePhotoActivity.this));
gvPhotos.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
playSound();
boolean checked = mPicList.get(position).isChecked();
if (checked) {
mPicList.get(position).setChecked(false);
} else {
for (int i = 0; i < mPicList.size(); i++) {
mPicList.get(i).setChecked(false);
}
mPicList.get(position).setChecked(true);
}
mImageAdapter.notifyDataSetChanged();
}
});
/**
* 数据适配器, 这里以内容类的形式使用,如果单独写成类,记得将ViewHolder以静态内部类的实行加载进去
*/
private class ImageAdapter extends BaseAdapter {
private Context mContext;
public ImageAdapter(Context context) {
this.mContext = context;
}
@Override
public int getCount() {
return mPicList.size();
}
@Override
public Object getItem(int position) {
return mPicList.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if (convertView == null) {
convertView = LayoutInflater.from(mContext).inflate(R.layout.gride_view_item_layout, parent, false);
holder = new ViewHolder();
holder.ivPic = convertView.findViewById(R.id.ivPic);
holder.rlSelected = convertView.findViewById(R.id.rlSelected);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
boolean checked = mPicList.get(position).isChecked();
if (checked) {
holder.rlSelected.setVisibility(View.VISIBLE);
} else {
holder.rlSelected.setVisibility(View.GONE);
}
holder.ivPic.setImageDrawable(getResources().getDrawable(mPicList.get(position).getResId()));
return convertView;
}
}
static class ViewHolder {
private ImageView ivPic;
private RelativeLayout rlSelected;
}
3. GrideViewItemLayout 源码
import android.content.Context;
import android.util.AttributeSet;
import android.widget.RelativeLayout;
/**
* 控制item显示成正方形
*/
public class GrideViewItemLayout extends RelativeLayout {
public GrideViewItemLayout(Context context) {
super(context);
}
public GrideViewItemLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public GrideViewItemLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(getDefaultSize(0, widthMeasureSpec), getDefaultSize(0, heightMeasureSpec));
int childWidhtSize = getMeasuredWidth();
heightMeasureSpec = widthMeasureSpec = MeasureSpec.makeMeasureSpec(childWidhtSize, MeasureSpec.EXACTLY);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}