使用 Vision 裁剪图像重点区域的 react-native 库 | Cropping Images Using Saliency
npm install react-native-saliency-crop使用 Vision 裁剪图像重点区域的 react-native 库 | Cropping Images Using Saliency

原图、基于注意力、基于对象
识别结果示例,confidence(置信度,[0 - 1]区间内的小数)的值越大可信度越高。基于注意力模式下最多返回 1 个区域,基于对象模式下最多返回 3 个区域。
``js`
[
{
confidence: 0.848;
path: "file:///private/mobile/Application/tmp/25D8F7E7-9A52-4E1C-A0D2-3CE07CF7E452.jpg",
boundingBox: {
"height": 1841.765625,
"width": 2071.6171875,
"x": 825.3984375,
"y": 1128.09375
}
}
]
目前仅支持 iOS 13.0+
$ npm install react-native-saliency-crop --save
or
$ yarn add react-native-saliency-crop
`sh`RN >= 0.60
cd ios && pod installRN < 0.60
react-native link react-native-saliency-crop
`js
import * as SaliencyCrop from 'react-native-saliency-crop';
SaliencyCrop.request(path) // 绝对本地路径
.then((result) => {
// success
})
.catch((error) => {
// error
});
`
`js
import * as SaliencyCrop from 'react-native-saliency-crop';
import RNFS from 'react-native-fs';
const path = ${RNFS.TemporaryDirectoryPath}/IMG_1234.jpg;
// https://github.com/itinance/react-native-fs
RNFS.downloadFile({
fromUrl: 'https://s4.ax1x.com/2022/01/15/7JJaDI.png',
toFile: path,
}).promise.then((res) => {
SaliencyCrop.request(path, {
saliencyType: SaliencyCrop.SaliencyType.ObjectnessBased,
saveFormat: SaliencyCrop.ImageFormat.JPEG,
quality: 0.8,
})
.then((result) => {
// success
})
.catch((error) => {
// error
});
});
`
| 参数 | 类型 | 描述 |
| ------------------ | ------ | ---------------------------------------------------------------------------------------------------------------------- |
| path | string | 图像文件的本地绝对路径. 可使用 react-native-fs constants 获取 |
| options (可选) | object | 可选项,见下 Options |
| 参数 | 类型 | 描述 | 默认值 |
| ------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------ | ----------------------------- |
| saliencyType (可选) | number | 图像重点区域类型,支持两种类型:基于注意力、基于对象 | SaliencyType.AttentionBased |ImageFormat.JPEG
| saveFormat (可选) | number | 指定保存图像结果的类型 | |saveFormat
| quality (可选) | number | 结果图像的压缩级别,仅 为 jpeg 时有效 [0.0 - 1.0] |true
| preferBackgroundProcessing (可选) | boolean | 如果设置为 ,则此属性会减少请求的内存占用、处理占用和 CPU/GPU 争用,但可能会花费更长的执行时间。 | false |false
| usesCPUOnly (可选) | boolean | 仅在 CPU 上执行。设置 表示可以自由地利用 GPU 来加速其处理。 | false |Orientation.Up
| orientation (可选) | number | 图像的方向 | |
| 名称 | 类型 | 描述 |
| --------------- | ------ | ------------------------------------------------------------------------- |
| confidence | number | 置信度,[0 - 1] |
| path | string | 裁剪后图像的路径 |
| boundingBox | object | 重点区域边界框 { x: number; y: number; width: number; height: number; } |
- Orientation.AttentionBased: 1 - 基于注意力Orientation.ObjectnessBased
- : 2 - 基于对象
- ImageFormat.JPEG: 1 - jpg 格式ImageFormat.PNG
- : 2 - png 格式
- Orientation.Up: 1 - 默认方向Orientation.UpMirrored
- : 2 - 水平翻转Orientation.Down
- : 3 - 旋转 180°Orientation.DownMirrored
- : 4 - 垂直翻转Orientation.Left
- : 5 - 水平翻转并逆时针旋转 90°Orientation.LeftMirrored
- : 6 - 顺时针旋转 90°Orientation.Right
- : 7 - 水平翻转并顺时针旋转 90°Orientation.RightMirrored
- : 8 - 顺时针旋转 90°
1. 检查您的最低 iOS 版本。react-native-saliency-image 要求最低 iOS 版本为 11.0(目前仅支持 iOS 13.0+ 使用)。
- 打开你的 Podfile
- 确保 platform :ios 设置为 11.0 或更高iOS Deployment Target` 设置为 11.0 或更高
- 确保
2. 确保您在项目中创建了 Swift 桥接头。
- 使用 Xcode 打开你的项目(xxx.xcworkspace)
- 按照以下步骤创建 Swift 文件 File > New > File (⌘+N)
- 选择 Swift File 并点击 Next
- 输入文件名 BridgingFile.swift,然后点击创建,提示时点击 Create Bridging Header
- [ ] 支持网络图像
MIT