Merge pull request #155 from excitedcat/issue/154

syanbo · web-flow · commit cf0a2c441f81 · 2020-04-16T09:45:43.000+08:00
docs(openVideoPicker): add openVideoPicker api to readme. close #154
diff --git a/README.md b/README.md
@@ -314,6 +314,61 @@ SyanImagePicker.openCamera(options, (err, photos) => {
  })
 ```
 
+### 选择视频
+
+```javascript
+SyanImagePicker.openVideoPicker(options, (err, videos) => {
+  if (err) {
+    // 取消选择
+    return;
+  }
+  // 选择成功，处理视频
+  // ...
+})
+```
+
+options 可选配置：
+
+```
+{
+  MaxSecond: 60,
+  MinSecond: 0,
+  recordVideoSecond: 60,
+  videoCount: 1
+}
+```
+
+返回结果：
+
+| type | value | iOS | Android |
+|---|---|---|---|
+| uri | string | ✅ | ✅|
+| fileName | string | ✅ | ✅|
+| size | string | ✅ | ✅|
+| duration | number | ✅ | ✅|
+| width | number | ✅ | ✅|
+| height | number | ✅ | ✅|
+| type | string | ✅ | ✅|
+| mime | string | ✅ | ✅|
+| coverUri | string | ✅ | ❌|
+| favorite | string | ✅ | ❌|
+| mediaType | string | ✅ | ❌|
+
+Android 返回结果：
+
+```javascript
+{
+  "mime": "video/mp4",
+  "type": "video",
+  "height": 1080,
+  "width": 1920,
+  "duration": 30.22,
+  "size": 63876724,
+  "fileName": "VID_20200409_11492864.mp4",
+  "uri": "file:///storage/emulated/0/DCIM/Camera/VID_20200409_11492864.mp4"
+}
+```
+
 ### 删除缓存
 ```javascript
 SYImagePicker.deleteCache();
diff --git a/android/src/main/java/com/syanpicker/RNSyanImagePickerModule.java b/android/src/main/java/com/syanpicker/RNSyanImagePickerModule.java
@@ -2,6 +2,7 @@
 package com.syanpicker;
 
 import android.app.Activity;
+import android.content.Context;
 import android.content.Intent;
 import android.graphics.BitmapFactory;
 import android.text.TextUtils;
@@ -32,6 +33,7 @@
 import java.io.FileNotFoundException;
 import java.io.IOException;
 import java.io.InputStream;
+import java.text.DecimalFormat;
 import java.util.ArrayList;
 import java.util.List;
 
@@ -279,13 +281,15 @@ private void openVideoPicker() {
         int MaxSecond = this.cameraOptions.getInt("MaxSecond");
         int MinSecond = this.cameraOptions.getInt("MinSecond");
         int recordVideoSecond = this.cameraOptions.getInt("recordVideoSecond");
-        int videoCount = this.cameraOptions.getInt("videoCount");
+        int videoCount = this.cameraOptions.getInt("imageCount");
+        boolean isCamera = this.cameraOptions.getBoolean("allowTakeVideo");
+
         Activity currentActivity = getCurrentActivity();
         PictureSelector.create(currentActivity)
                 .openGallery(PictureMimeType.ofVideo())//全部.PictureMimeType.ofAll()、图片.ofImage()、视频.ofVideo()、音频.ofAudio()
                 .selectionMedia(selectList) // 当前已选中的视频 List
                 .openClickSound(false)// 是否开启点击声音 true or false
-                .isCamera(false)// 是否显示拍照按钮 true or false
+                .isCamera(isCamera)// 是否显示拍照按钮 true or false
                 .maxSelectNum(videoCount)// 最大视频选择数量 int
                 .minSelectNum(1)// 最小选择数量 int
                 .imageSpanCount(4)// 每行显示个数 int
@@ -330,12 +334,22 @@ private void onGetVideoResult(Intent data) {
             if (TextUtils.isEmpty(media.getPath())) {
                 continue;
             }
+
+            DecimalFormat df = new DecimalFormat("#.00");
             WritableMap videoMap = new WritableNativeMap();
-            videoMap.putString("size", new File(media.getPath()).length() + "");
-            videoMap.putString("duration", media.getDuration() + "");
+
+            // File Path https://stackoverflow.com/questions/3401579/get-filename-and-path-from-uri-from-mediastore
+            Context ctx = this.reactContext.getApplicationContext();
+            String filePath = Utils.getPathFromURI(ctx, media.getPath());
+
+            videoMap.putString("uri", filePath);
             videoMap.putString("fileName", new File(media.getPath()).getName());
-            videoMap.putString("uri", "file://" + media.getPath());
+            videoMap.putDouble("size", new File(media.getPath()).length());
+            videoMap.putDouble("duration", media.getDuration() / 1000.00);
+            videoMap.putInt("width", media.getWidth());
+            videoMap.putInt("height", media.getHeight());
             videoMap.putString("type", "video");
+            videoMap.putString("mime", media.getMimeType());
             videoList.pushMap(videoMap);
         }
 
diff --git a/android/src/main/java/com/syanpicker/Utils.java b/android/src/main/java/com/syanpicker/Utils.java
@@ -0,0 +1,28 @@
+package com.syanpicker;
+
+import android.content.Context;
+import android.database.Cursor;
+import android.net.Uri;
+import android.provider.MediaStore;
+
+public class Utils {
+    public static String getPathFromURI(Context context, String contentUri) {
+        if (contentUri.indexOf("file://") > -1) {
+            return contentUri;
+        }
+
+        Cursor cursor = null;
+
+        try {
+            String[] proj = {MediaStore.Images.Media.DATA};
+            cursor = context.getContentResolver().query(Uri.parse(contentUri), proj, null, null, null);
+            int column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
+            cursor.moveToFirst();
+            return cursor.getString(column_index);
+        } finally {
+            if (cursor != null) {
+                cursor.close();
+            }
+        }
+    }
+}
diff --git a/index.d.ts b/index.d.ts
@@ -23,8 +23,11 @@ export interface ImagePickerOption {
     videoMaximumDuration: number, // 视频最大拍摄时间，默认是10分钟，单位是秒
     isWeChatStyle: boolean,      // 是否是微信风格选择界面 Android Only
     sortAscendingByModificationDate: boolean // 对照片排序，按修改时间升序，默认是YES。如果设置为NO,最新的照片会显示在最前面，内部的拍照按钮会排在第一个
+    videoCount: number // 视频个数
+    MaxSecond: number // 选择视频最大时长，默认是180秒
+    MinSecond: number // 选择视频最小时长，默认是1秒
   }
-  
+
   interface SelectedPhoto {
     width: number, 	 //图片宽度
     height: number,  	//图片高度
@@ -34,7 +37,7 @@ export interface ImagePickerOption {
     size:number, 	 //图片大小，单位为字节 b
     base64:string	//图片的 base64 编码，如果 enableBase64 设置 false，则不返回该属性
   }
-  
+
   /**
    * 以Callback形式调用
    * 1、相册参数暂时只支持默认参数中罗列的属性；
@@ -54,8 +57,8 @@ export interface ImagePickerOption {
    * @param {Function} callback 成功，或失败回调
    */
   export function showImagePicker (options:Partial<ImagePickerOption>,callback:(err:null|string,photos:Array<SelectedPhoto>)=>void): void;
-  
-  
+
+
   /**
    * 以Promise形式调用
    * 1、相册参数暂时只支持默认参数中罗列的属性；
@@ -83,33 +86,32 @@ export interface ImagePickerOption {
    * @return {Promise} 返回一个Promise对象
    */
   export function asyncShowImagePicker (options:Partial<ImagePickerOption>): Promise<Array<SelectedPhoto>>;
-  
+
   /**
    * 打开相机支持裁剪参数
    * @param options
    * @param callback
    */
   export function openCamera (options:Partial<ImagePickerOption>,callback:(err:null|string,photos:Array<SelectedPhoto>)=>void): void;
-  
-  
+
+
   export function asyncOpenCamera (options:Partial<ImagePickerOption>): Promise<Array<SelectedPhoto>>;
-  
+
   /**
    * 清除缓存
    */
   export function deleteCache (): void;
-  
+
   /**
    * 移除选中的图片
    * @param {Number} index 要移除的图片下标
    */
   export function removePhotoAtIndex (index:number): void;
-  
+
   /**
    * 移除所有选中图片
    */
   export function removeAllPhoto (): void;
-  
+
   export function openVideoPicker (options:Partial<ImagePickerOption>,callback:(err:null|string,photos:Array<SelectedPhoto>)=>void): void;
-  
-  
+
diff --git a/index.js b/index.js
@@ -140,19 +140,21 @@ export default {
     },
 
     openVideoPicker(options, callback) {
+        const imageCount = options.videoCount ? options.videoCount : 1
         const optionObj = {
             ...defaultOptions,
             isCamera: false,
             allowPickingGif: false,
             allowPickingVideo: true,
             allowPickingImage: false,
-            allowPickingMultipleVideo: true,
+            allowTakeVideo: true,
+            allowPickingMultipleVideo: imageCount > 1,
             videoMaximumDuration: 20,
             MaxSecond: 60,
             MinSecond: 0,
             recordVideoSecond: 60,
-            videoCount: 1,
-            ...options
+            ...options,
+            imageCount
         };
         return RNSyanImagePicker.openVideoPicker(optionObj, callback)
     }
diff --git a/ios/RNSyanImagePicker.m b/ios/RNSyanImagePicker.m
@@ -114,6 +114,7 @@ - (void)openTZImagePicker:(NSDictionary *)options callback:(RCTResponseSenderBlo
     BOOL allowPickingVideo = [options sy_boolForKey:@"allowPickingVideo"];
     BOOL allowPickingMultipleVideo = [options sy_boolForKey:@"allowPickingMultipleVideo"];
     BOOL allowPickingImage = [options sy_boolForKey:@"allowPickingImage"];
+    BOOL allowTakeVideo = [options sy_boolForKey:@"allowTakeVideo"];
     BOOL showCropCircle  = [options sy_boolForKey:@"showCropCircle"];
     BOOL isRecordSelected = [options sy_boolForKey:@"isRecordSelected"];
     BOOL allowPickingOriginalPhoto = [options sy_boolForKey:@"allowPickingOriginalPhoto"];
@@ -131,9 +132,9 @@ - (void)openTZImagePicker:(NSDictionary *)options callback:(RCTResponseSenderBlo
     imagePickerVc.allowTakePicture = isCamera; // 允许用户在内部拍照
     imagePickerVc.allowPickingVideo = allowPickingVideo; // 不允许视频
     imagePickerVc.allowPickingImage = allowPickingImage;
-    imagePickerVc.allowTakeVideo = NO;
+    imagePickerVc.allowTakeVideo = allowTakeVideo; // 允许拍摄视频
     imagePickerVc.videoMaximumDuration = videoMaximumDuration;
-    imagePickerVc.allowPickingMultipleVideo = isGif ? YES : allowPickingMultipleVideo;
+    imagePickerVc.allowPickingMultipleVideo = isGif || allowPickingMultipleVideo ? YES : NO;
     imagePickerVc.allowPickingOriginalPhoto = allowPickingOriginalPhoto; // 允许原图
     imagePickerVc.sortAscendingByModificationDate = sortAscendingByModificationDate;
     imagePickerVc.alwaysEnableDoneBtn = YES;
@@ -176,6 +177,7 @@ - (void)openTZImagePicker:(NSDictionary *)options callback:(RCTResponseSenderBlo
     [imagePickerVc setDidFinishPickingVideoHandle:^(UIImage *coverImage, PHAsset *asset) {
         [weakPicker showProgressHUD];
         [[TZImageManager manager] getVideoOutputPathWithAsset:asset presetName:AVAssetExportPresetHighestQuality success:^(NSString *outputPath) {
+            NSLog(@"视频导出成功:%@", outputPath);
             callback(@[[NSNull null], @[[self handleVideoData:outputPath asset:asset coverImage:coverImage quality:quality]]]);
             [weakPicker dismissViewControllerAnimated:YES completion:nil];
             [weakPicker hideProgressHUD];
@@ -518,12 +520,16 @@ - (NSDictionary *)handleVideoData:(NSString *)outputPath asset:(PHAsset *)asset
     video[@"fileName"] = [asset valueForKey:@"filename"];
     NSInteger size = [[NSFileManager defaultManager] attributesOfItemAtPath:outputPath error:nil].fileSize;
     video[@"size"] = @(size);
+    video[@"duration"] = @(asset.duration);
     video[@"width"] = @(asset.pixelWidth);
     video[@"height"] = @(asset.pixelHeight);
+    video[@"type"] = @"video";
+    video[@"mime"] = @"video/mp4";
+    // iOS only
+    video[@"coverUri"] = [self handleCropImage:coverImage phAsset:asset quality:quality][@"uri"];
     video[@"favorite"] = @(asset.favorite);
-    video[@"duration"] = @(asset.duration);
     video[@"mediaType"] = @(asset.mediaType);
-    video[@"coverUri"] = [self handleCropImage:coverImage phAsset:asset quality:quality][@"uri"];
+
     return video;
 }
 
