Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

修复 chooseMessageFile 返回类型错误;增加对 chooseMedia API 的支持。 #5889

Merged
merged 2 commits into from
Apr 3, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions docs/apis/media/image/chooseImage.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ sidebar_label: chooseImage
| count | `number` | 否 | 最多可以选择的图片张数 |
| fail | `(res: CallbackResult) => void` | 否 | 接口调用失败的回调函数 |
| sizeType | ("original" or "compressed")[] | 否 | 所选的图片的尺寸 |
| sourceType | ("album" or "camera")[] | 否 | 选择图片的来源 |
| sourceType | ("album" or "camera" or "user" or "environment")[] | 否 | 选择图片的来源 |
| success | `(result: SuccessCallbackResult) => void` | 否 | 接口调用成功的回调函数 |

### sizeType
Expand All @@ -43,6 +43,8 @@ sidebar_label: chooseImage
| --- | --- |
| album | 从相册选图 |
| camera | 使用相机 |
| user | 使用前置摄像头(仅H5纯浏览器使用) |
| environment | 使用后置摄像头(仅H5纯浏览器) |

### SuccessCallbackResult

Expand Down Expand Up @@ -76,7 +78,7 @@ sidebar_label: chooseImage
Taro.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有,在H5浏览器端支持使用 `user` 和 `environment`分别指定为前后摄像头
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths
Expand Down
94 changes: 94 additions & 0 deletions docs/apis/media/image/chooseMedia.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
---
title: Taro.chooseMedia(option)
sidebar_label: chooseMedia
---

> 最低 Taro 版本: 2.10.0

拍摄或从手机相册中选择图片或视频。

> [参考文档](https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html)

## 类型

```tsx
(option: Option) => Promise<SuccessCallbackResult>
```

## 参数

### Option

| 参数 | 类型 | 必填 | 说明 |
| --- | --- | :---: | --- |
| count | `number` | 否 | 最多可以选择的文件个数 |
| mediaType | ("video" or "image")[] | 否 | 文件类型 |
| sourceType | ("album" or "camera")[] | 否 | 图片和视频选择的来源 |
| maxDuration | `number` | 否 | 拍摄视频最长拍摄时间,单位秒。时间范围为 3s 至 30s 之间 |
| sizeType | ("original" or "compressed")[] | 否 | 仅对 mediaType 为 image 时有效,是否压缩所选文件 |
| camera | `string` | 否 | 仅在 sourceType 为 camera 时生效,使用前置或后置摄像头 |
| fail | `(res: CallbackResult) => void` | 否 | 接口调用失败的回调函数 |
| success | `(result: SuccessCallbackResult) => void` | 否 | 接口调用成功的回调函数 |

### SuccessCallbackResult

| 参数 | 类型 | 说明 |
| --- | --- | --- |
| tempFiles | `ChooseMedia[]` | 本地临时文件列表 |
| type | `string` | 文件类型,有效值有 image 、video |

### ChooseMedia

本地临时文件列表

| 参数 | 类型 | 说明 |
| --- | --- | --- |
| tempFilePath | `string` | 本地临时文件路径 (本地路径) |
| size | `number` | 本地临时文件大小,单位 B |
| duration | `number` | 视频的时间长度 |
| height | `number` | 视频的高度 |
| width | `number` | 视频的宽度 |
| thumbTempFilePath | `string` | 视频缩略图临时文件路径 |

### mediaType

| 参数 | 说明 |
| --- | --- |
| video | 只能拍摄视频或从相册选择视频 |
| image | 只能拍摄图片或从相册选择图片 |

### sourceType

| 参数 | 说明 |
| --- | --- |
| album | 从相册选择 |
| camera | 使用相机拍摄 |

### camera

| 参数 | 说明 |
| --- | --- |
| back | 使用后置摄像头 |
| front | 使用前置摄像头 |

## 示例代码

```tsx
wx.chooseMedia({
count: 9,
mediaType: ['image','video'],
sourceType: ['album', 'camera'],
maxDuration: 30,
camera: 'back',
success(res) {
console.log(res.tempFiles)
console.log(res.type)
}
})
```

## API 支持度

| API | 微信小程序 | H5 | React Native |
| :---: | :---: | :---: | :---: |
| Taro.chooseMedia | ✔️ | | |
1 change: 1 addition & 0 deletions packages/taro/src/native-apis.js
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ const otherApis = {
// 媒体
chooseImage: true,
chooseMessageFile: true,
chooseMedia: true,
previewImage: true,
getImageInfo: true,
compressImage: true,
Expand Down
82 changes: 81 additions & 1 deletion packages/taro/types/api/media/image.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -302,5 +302,85 @@ declare namespace Taro {
* ```
* @see https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseMessageFile.html
*/
function chooseMessageFile(option: chooseMessageFile.Option): Promise<compressImage.SuccessCallbackResult>
function chooseMessageFile(option: chooseMessageFile.Option): Promise<chooseMessageFile.SuccessCallbackResult>

namespace chooseMedia {
interface Option {
/** 最多可以选择的文件个数 */
count?: number
/** 文件类型 */
mediaType?: Array<keyof mediaType>
/** 图片和视频选择的来源 */
sourceType?: Array<keyof sourceType>
/** 拍摄视频最长拍摄时间,单位秒。时间范围为 3s 至 30s 之间 */
maxDuration?: number
/** 仅对 mediaType 为 image 时有效,是否压缩所选文件 */
sizeType?: Array<'original' | 'compressed'>
/** 仅在 sourceType 为 camera 时生效,使用前置或后置摄像头 */
camera?: string
/** 接口调用失败的回调函数 */
fail?: (res: General.CallbackResult) => void
/** 接口调用成功的回调函数 */
success?: (result: SuccessCallbackResult) => void
}
interface SuccessCallbackResult extends General.CallbackResult {
/** 本地临时文件列表 */
tempFiles: ChooseMedia[]
/** 文件类型,有效值有 image 、video */
type: string
}
/** 本地临时文件列表 */
interface ChooseMedia {
/** 本地临时文件路径 (本地路径) */
tempFilePath: string
/** 本地临时文件大小,单位 B */
size: number
/** 视频的时间长度 */
duration: number
/** 视频的高度 */
height: number
/** 视频的宽度 */
width: number
/** 视频缩略图临时文件路径 */
thumbTempFilePath: string
}
interface mediaType {
/** 只能拍摄视频或从相册选择视频 */
video
/** 只能拍摄图片或从相册选择图片 */
image
}
interface sourceType {
/** 从相册选择 */
album
/** 使用相机拍摄 */
camera
}
interface camera {
/** 使用后置摄像头 */
back
/** 使用前置摄像头 */
front
}
}
/** 拍摄或从手机相册中选择图片或视频。
* @supported weapp
* @since 2.10.0
* @example
* ```tsx
* wx.chooseMedia({
* count: 9,
* mediaType: ['image','video'],
* sourceType: ['album', 'camera'],
* maxDuration: 30,
* camera: 'back',
* success(res) {
* console.log(res.tempFiles)
* console.log(res.type)
* }
* })
* ```
* @see https://developers.weixin.qq.com/miniprogram/dev/api/media/video/wx.chooseMedia.html
*/
function chooseMedia(option: chooseMedia.Option): Promise<chooseMedia.SuccessCallbackResult>
}