如何使用ContentProvider打造自己的本地圖片庫

效果如圖
這裏寫圖片描述

圖庫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”,實現上下的間隔。
到這裏,基本的圖庫功能就可以實現了,但是還有一些功能沒做,例如上面提到的分組展示、圖片多選,以後有時間的話就把他補上。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章