效果如圖
圖庫xml界面代碼
<?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">
<android.support.v7.widget.RecyclerView
android:id="@+id/re_photo_wall"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="6dp"
android:paddingLeft="6dp"/>
</LinearLayout>
其中用recyclerView 來加載圖片設置與上方間隔6dp
paddingLeft的功能下面會講到
PhotoWallActivity代碼
public class PhotoWallActivity extends AppCompatActivity {
private HashMap<String, List<ImageBean>> mGruopMap = new HashMap<String, List<ImageBean>>();
private List<ImageBean> imgs = new ArrayList<>();
private final static int SCAN_OK = 1;
private ProgressDialog mProgressDialog;
private RecyclerView rePhotoWall;
private PhotoWallAdapter adapter;
private Handler mHandler = new Handler() {
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
switch (msg.what) {
case SCAN_OK:
//掃描完畢,關閉進度dialog
mProgressDialog.dismiss();
adapter.notifyDataSetChanged();
break;
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_photo_wall);
initView();
}
private void initView() {
rePhotoWall = (RecyclerView) findViewById(R.id.re_photo_wall);
//設置recyclerView 爲網格佈局,3列
rePhotoWall.setLayoutManager(new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL));
adapter = new PhotoWallAdapter(PhotoWallActivity.this, imgs);
rePhotoWall.setAdapter(adapter);
if (imgs.size() == 0) {
getImages();
}
}
/**
* 利用ContentProvider掃描手機中的圖片,此方法在運行在子線程中
*/
private void getImages() {
//顯示進度dialog
mProgressDialog = ProgressDialog.show(this, null, "正在加載...");
//開啓線程掃描
new Thread(new Runnable() {
@Override
public void run() {
Uri mImageUri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;
ContentResolver mContentResolver = PhotoWallActivity.this.getContentResolver();
//只查詢jpeg和png的圖片
Cursor mCursor = mContentResolver.query(mImageUri, null,
MediaStore.Images.Media.MIME_TYPE + "=? or "
+ MediaStore.Images.Media.MIME_TYPE + "=?",
new String[]{"image/jpeg", "image/png"}, MediaStore.Images.Media.DATE_MODIFIED);
if (mCursor == null) {
return;
}
while (mCursor.moveToNext()) {
//獲取圖片的路徑
String path = mCursor.getString(mCursor
.getColumnIndex(MediaStore.Images.Media.DATA));
ImageBean bean = new ImageBean(path, false);
imgs.add(bean);
//獲取該圖片的父路徑名
String parentName = new File(path).getParentFile().getName();
//根據父路徑名將圖片放入到mGruopMap中
if (!mGruopMap.containsKey(parentName)) {
List<ImageBean> childList = new ArrayList<ImageBean>();
ImageBean imageBean = new ImageBean(path, false);
childList.add(imageBean);
mGruopMap.put(parentName, childList);
} else {
mGruopMap.get(parentName).add(new ImageBean(path, false));
}
}
//添加全部圖片的集合
mGruopMap.put("全部圖片", imgs);
//通知Handler掃描圖片完成
mHandler.sendEmptyMessage(SCAN_OK);
mCursor.close();
}
}).start();
}
/**
* 組裝分組界面的數據源,因爲我們掃描手機的時候將圖片信息放在HashMap中
* 所以需要遍歷HashMap將數據組裝成List
* 用於展示圖庫分組列表
* @param mGruopMap
* @return
*/
private List<ImageGroupBean> subGroupOfImage(HashMap<String, List<ImageBean>> mGruopMap) {
if (mGruopMap.size() == 0) {
return null;
}
//遍歷
List<ImageGroupBean> list = new ArrayList<ImageGroupBean>();
Iterator<Map.Entry<String, List<ImageBean>>> it = mGruopMap.entrySet().iterator();
while (it.hasNext()) {
Map.Entry<String, List<ImageBean>> entry = it.next();
ImageGroupBean mImageBean = new ImageGroupBean();
//根據key獲取其中圖片list
String key = entry.getKey();
List<ImageBean> value = entry.getValue();
mImageBean.setFolderName(key);//獲取該組文件夾名稱
mImageBean.setImageCounts(value.size());//獲取該組圖片數量
mImageBean.setTopImagePath(value.get(0).getImgPath());//獲取該組的第一張圖片
//將全部圖片放在第一位置
if (mImageBean.getFolderName().equals("全部圖片")){
list.add(0,mImageBean);
}else {
list.add(mImageBean);
}
}
return list;
}
}
在PhotoWallActivity我獲取了本地所有圖片,並對圖片按存儲路徑進行了分組存放到HashMap中。
其中subGroupOfImage方法,將HashMap中每組的第一張圖片、圖片數量、以及父文件名存放到list中,提供後面選擇分組展示使用(目前沒做,但數據都有了)。
ImageBean與ImageGroupBean 代碼
public class ImageBean {
private String imgPath;
private boolean isChoosed;
public ImageBean(String imgPath, boolean isChoosed) {
this.imgPath = imgPath;
this.isChoosed = isChoosed;
}
public String getImgPath() {
return imgPath;
}
public void setImgPath(String imgPath) {
this.imgPath = imgPath;
}
public boolean isChoosed() {
return isChoosed;
}
public void setChoosed(boolean choosed) {
isChoosed = choosed;
}
}
public class ImageGroupBean {
/**
* 文件夾的第一張圖片路徑
*/
private String topImagePath;
/**
* 文件夾名
*/
private String folderName;
/**
* 文件夾中的圖片數
*/
private int imageCounts;
public String getTopImagePath() {
return topImagePath;
}
public void setTopImagePath(String topImagePath) {
this.topImagePath = topImagePath;
}
public String getFolderName() {
return folderName;
}
public void setFolderName(String folderName) {
this.folderName = folderName;
}
public int getImageCounts() {
return imageCounts;
}
public void setImageCounts(int imageCounts) {
this.imageCounts = imageCounts;
}
}
PhotoWallAdapter的代碼:
public class PhotoWallAdapter extends RecyclerView.Adapter<PhotoWallAdapter.PhotoWallViewHolder> {
private Context context;
private List<ImageBean> imgs;
public PhotoWallAdapter(Context context, List<ImageBean> imgs) {
this.context = context;
this.imgs = imgs;
}
@Override
public PhotoWallViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(context).inflate(R.layout.view_photo_item, parent, false);
return new PhotoWallViewHolder(view);
}
@Override
public void onBindViewHolder(PhotoWallViewHolder holder, int position) {
//圖片每行3個,則有4個間隔,每個6dp,就爲24dp(前面的paddingLeft 6dp爲第一個左邊的間距),這樣得出每個圖片的寬度
holder.ivPhoto.setLayoutParams(new FrameLayout.LayoutParams((ScreenUtils.getScreenWidth(context) - SizeUtils.dp2px(context, 24)) / 3,
(ScreenUtils.getScreenWidth(context) - SizeUtils.dp2px(context, 24)) / 3));
//glide加載
Glide.with(context)
.load(imgs.get(position).getImgPath())
.centerCrop()
.crossFade()
.diskCacheStrategy(DiskCacheStrategy.RESULT)
.placeholder(R.drawable.default_img)
.into(holder.ivPhoto);
}
@Override
public int getItemCount() {
return imgs.size();
}
static class PhotoWallViewHolder extends RecyclerView.ViewHolder {
ImageView ivPhoto;
ImageView ivChoose;
public PhotoWallViewHolder(View itemView) {
super(itemView);
ivChoose = (ImageView) itemView.findViewById(R.id.iv_choose);
ivPhoto = (ImageView) itemView.findViewById(R.id.iv_photo);
}
}
}
規定每張圖片的寬高,然後用glide加載。
view_photo_item.xml界面:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="6dp"
android:orientation="vertical">
<ImageView
android:id="@+id/iv_photo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
<ImageView
android:id="@+id/iv_choose"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="right|top"
android:layout_margin="2dp"
android:src="@mipmap/un_choose" />
</FrameLayout>
在父佈局中設置android:layout_marginBottom=”6dp”,實現上下的間隔。
到這裏,基本的圖庫功能就可以實現了,但是還有一些功能沒做,例如上面提到的分組展示、圖片多選,以後有時間的話就把他補上。