細(xì)數(shù)圖片上傳功能用到的知識點(圖片選取&拍照篇)

我們之前講到了上傳圖片裁剪的相關(guān)知識點。今天就來說一說我們被裁剪的那些圖片如何獲取。
附上期鏈接細(xì)數(shù)圖片上傳功能用到的知識點-裁剪篇

先來說我們的需求。在用戶觸發(fā)選取圖片之后讓用戶選擇是拍照還是從圖庫選取。從圖庫選取圖片,我們其實可以直接調(diào)用系統(tǒng)圖庫。但是調(diào)用系統(tǒng)圖庫存在著操作不順暢的問題,如果系統(tǒng)中存在多個能夠處理MediaStore.ACTION_IMAGE_CAPTURE的工具會彈窗選擇框讓用戶選擇,這樣大大的降低了用戶操作的連貫性。所以大多數(shù)app都是由自己來實現(xiàn)圖庫功能的。

所以這里會用到如下的知識點

  • 彈窗讓用戶選擇拍照還是從圖庫選擇
  • 調(diào)取相機,獲取相機返回的圖片
  • 制作我們自己的圖庫

下面我就會對上面每個模塊進行詳盡的介紹

彈窗

這樣的效果

彈窗

這個東西是基于popupWindow實現(xiàn)的,比較簡單就不多說了。

//彈窗的布局
 View view = LayoutInflater.from(activity).inflate(R.layout.write_popwindow_layout, null);
        popupWindow = new PopupWindow(view, LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT, true);
//自下而上的動畫
        popupWindow.setAnimationStyle(R.style.popwindow_anim_style_bottom);
        popupWindow.setOutsideTouchable(true);
        popupWindow.setFocusable(true);
        popupWindow.setOutsideTouchable(true);
        popupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
            @Override
            public void onDismiss() {
//屏幕亮度恢復(fù)
                ScreenData.UpScreenColor(activity);
            }
        });
        view.setFocusable(true);
        view.setFocusableInTouchMode(true);
        view.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                popupWindow.dismiss();
//屏幕亮度恢復(fù)
                ScreenData.UpScreenColor(activity);
                return true;
            }
        });

這里我們需要注意的是權(quán)限問題,由于Android6.0之后權(quán)限制度的改變。無論是訪問相機,還是獲取用戶存儲的圖片都需要去動態(tài)的申請權(quán)限

我的處理是,再點擊拍照 或者圖庫的時候申請權(quán)限,權(quán)限的申請結(jié)果會在activityonRequestPermissionsResult()方法中回調(diào)。我們需要在里面處理下一步的邏輯,如果用戶不給于權(quán)限則關(guān)閉彈窗即可。

  if (ContextCompat.checkSelfPermission(activity,
                        Manifest.permission.CAMERA)
                        != PackageManager.PERMISSION_GRANTED || ContextCompat.checkSelfPermission(activity,
                        Manifest.permission.READ_EXTERNAL_STORAGE)
                        != PackageManager.PERMISSION_GRANTED) {
                    ActivityCompat.requestPermissions(activity,
                            new String[]{"android.permission.READ_EXTERNAL_STORAGE", "android.permission.CAMERA"},
                            12546);
                } else {
//如果已經(jīng)擁有權(quán)限則直接操作
                    ScreenData.UpScreenColor(activity);
                    popupWindow.dismiss();

                  //調(diào)取相機或者打開圖庫
                    getImageFromCamera();
                }

調(diào)取相機

調(diào)取相機功能其實我們只需傳遞一個ActionViewandroid.media.action.IMAGE_CAPTURE的Intent即可。之后我們就可以從data里獲取圖片的uri。真么簡單,難道沒有坑嗎?


很明顯是有的,其實通過這種方式你最后獲取的圖片只是一張縮略圖而已。查閱官方文檔我們得到了以下方法。

//給相機傳遞這樣一個uri,相機會把圖片存儲到這個uri對應(yīng)得文件
 intent.putExtra(MediaStore.EXTRA_OUTPUT, photoUri);

以及為這樣就出坑了嗎?


在部分手機上,使用這種方式無法讓相機存儲照片到這個uri對應(yīng)的文件。如果我們創(chuàng)建文件,然后使用Uri.fromFile的方式來獲取uri的話,我們還需要先將這個uri對應(yīng)我們的file文件存入系統(tǒng)的數(shù)據(jù)庫中。

  ContentValues values = new ContentValues();
            values.put(MediaStore.Images.Media.DATA, file.getAbsolutePath());
            values.put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg");
            photoUri = activity.getContentResolver().insert(
                    MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values);

跳出這個坑,我們就可以在onActivityResult中等待相機的回掉了。拍照的圖片已經(jīng)被存入我們的文件中了。你以為這樣就結(jié)束了嗎?

部分手機(三星)拍出的照片有時候會是顛倒的,我們?nèi)匀恍枰獑为氝M行處理。讀取照片信息中的角度,然后會進行旋轉(zhuǎn)。

//讀取圖片的旋轉(zhuǎn)信息
 public static int readPictureDegree(String path) {
        int degree = 0;
        try {
            ExifInterface exifInterface = new ExifInterface(path);
            int orientation = exifInterface.getAttributeInt(ExifInterface.TAG_ORIENTATION, ExifInterface.ORIENTATION_NORMAL);
            switch (orientation) {
                case ExifInterface.ORIENTATION_ROTATE_90:
                    degree = 90;
                    break;
                case ExifInterface.ORIENTATION_ROTATE_180:
                    degree = 180;
                    break;
                case ExifInterface.ORIENTATION_ROTATE_270:
                    degree = 270;
                    break;
            }
        } catch (IOException e) {
            e.printStackTrace();
        }
        return degree;
    }
//旋轉(zhuǎn)圖片
  public static Bitmap toturn(Bitmap img,int degree) {
        try {
            Matrix matrix = new Matrix();
            matrix.postRotate(degree); /*翻轉(zhuǎn)90度*/
            int width = img.getWidth();
            int height = img.getHeight();
            img = Bitmap.createBitmap(img, 0, 0, width, height, matrix, true);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return img;
    }

制作我們自己的圖庫

先來看看我們圖庫的效果。

圖片列表
選擇相冊列表

首先我們是一個支持選擇多張的圖庫,選擇后會在左上角進行標(biāo)識這是選中的第幾張。另外我們的相冊支持相冊的選擇,方便用戶的尋找圖片。

圖片列表的實現(xiàn)用gridview 或者recycleView 都可以,但是要注意顯示圖片的處理,提升流暢度。我們主要來說一說這些數(shù)據(jù)都是如何查出來的。

默認(rèn)進入,我們顯示的是按時間倒序排列的所有圖片。要查詢這些數(shù)據(jù)就要用到我們的ContentResolver


    /**
     * 獲取全部圖片
     *
     * @param cr
     * @return
     */
    public static List<Uri> GetAllPic(ContentResolver cr) {
        List<Uri> uriList = new ArrayList<>();
        String[] projection = {MediaStore.Images.Media.DATA, MediaStore.Images.Media.DATE_MODIFIED};

//查詢條件是DATE_MODIFIED 的倒序
        Cursor cursor = cr.query(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, projection, null, null, MediaStore.Images.Media.DATE_MODIFIED + " desc");
        if (cursor == null) {
            return null;
        }
//遍歷游標(biāo)存入列表
        while (cursor.moveToNext()) {
            String image_path = cursor.getString(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
            File file = new File(image_path);
            if (file.exists() && file.length() != 0)
                uriList.add(Uri.fromFile(file));
        }
        cursor.close();
        return uriList;
    }

而相冊列表我沒有找到單獨的獲取放大,用下面這種方式也可以實現(xiàn),讀取每張圖片的時候,其實能夠拿到圖片所在的相冊。根據(jù)id除去重復(fù)的即可。
我們只需要修改上面代碼中的projection數(shù)組中的內(nèi)容增加即可。統(tǒng)計縮略圖什么都很好實現(xiàn)。一遍遍歷就可以拿到所有想要的數(shù)據(jù)。

//獲取所在相冊和相冊id
  String[] projection = {MediaStore.Images.Media.DATA,,MediaStore.Images.Media.DATE_MODIFIED, MediaStore.Images.Media.BUCKET_DISPLAY_NAME, MediaStore.Images.Media..BUCKET_ID};

點擊相冊后根據(jù)相冊來查詢對應(yīng)的圖片集合

  /**
     * 根據(jù)相冊id獲取圖片
     *
     * @param cr
     * @param parentName
     * @return limit 限制數(shù)量
     */
    public static List<Uri> GetAllPicByParentName(ContentResolver cr, String parentId, int limit) {
        List<Uri> uriList = new ArrayList<>();
        String[] projection = {MediaStore.Images.Media.DATA, MediaStore.Images.Media.DATE_MODIFIED};
        Cursor cursor = null;
        if (limit!=-1) {
  //限制只取第一個 ,方便獲取縮略圖
            cursor = cr.query(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, projection, MediaStore.Images.Media.BUCKET_ID+ "=?", new String[]{parentId}, MediaStore.Images.Media.DATE_MODIFIED + " desc" + " limit 0,"+limit);
        } else {
            cursor = cr.query(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, projection, MediaStore.Images.Media.BUCKET_ID+ "=?", new String[]{parentId}, MediaStore.Images.Media.DATE_MODIFIED + " desc");
        }
        if (cursor == null) {
            return null;
        }
        while (cursor.moveToNext()) {
            String image_path = cursor.getString(cursor.getColumnIndex(MediaStore.Images.Media.DATA));
            File file = new File(image_path);
            if (file.exists())
                uriList.add(Uri.fromFile(file));
        }
        cursor.close();
        return uriList;
    }

回傳

圖片選取完成后我們只需要將圖片對應(yīng)的uri回傳給上個頁面即可。回傳多張圖片有很多方式。不可以傳遞bitmap,其數(shù)據(jù)過大。 一張圖片可以通過intent.setData()傳遞uri 。但uri也沒有實現(xiàn)Serializable接口。不能回傳列表。但是我們可以獲取其對應(yīng)的文件,然后回傳文件地址列表即可。

圖片選取這里的坑也是比較多的,大家在切實嘗試過后才能明白。尤其是照片部分,網(wǎng)上的教程很雜亂,誤導(dǎo)也比較多。讓我繞了很多圈子


細(xì)數(shù)圖片上傳功能用到的知識點(圖片選取&拍照篇)
細(xì)數(shù)圖片上傳功能用到的知識點(裁剪篇)
細(xì)數(shù)圖片上傳功能用到的知識點(圖片壓縮篇)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容