forked from floraachy/ImageKnife
1.ArkTs整改5 更改ImageKnife->crop文件夹
Signed-off-by: zhoulisheng1 <zhoulisheng1@huawei.com>
This commit is contained in:
zhoulisheng1
parent
e7d70fea9d
commit
f122a19f40
|
|
@ -48,7 +48,7 @@ export * from './src/main/ets/components/imageknife/compress/provider/RecoursePr
|
|||
export * from './src/main/ets/components/imageknife/crop/Crop'
|
||||
export * from './src/main/ets/components/imageknife/crop/CropImage'
|
||||
export * from './src/main/ets/components/imageknife/crop/CropOptions'
|
||||
export {default as PixelMapCrop} from './src/main/ets/components/imageknife/crop/PixelMapCrop'
|
||||
export * from './src/main/ets/components/imageknife/crop/PixelMapCrop'
|
||||
export * from './src/main/ets/components/imageknife/crop/CropCallback'
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -15,37 +15,39 @@
|
|||
|
||||
import { CropCallback } from './CropCallback'
|
||||
import image from "@ohos.multimedia.image"
|
||||
|
||||
import { BusinessError } from '@ohos.base'
|
||||
export namespace Crop {
|
||||
|
||||
export function crop(buf: ArrayBuffer, x: number, y: number, cropWidth: number, cropHeight: number, func?: CropCallback<PixelMap>, colorRatio?: number) {
|
||||
export interface CropSize{
|
||||
width:number,
|
||||
height:number
|
||||
}
|
||||
|
||||
export function crop(buf: ArrayBuffer, x: number, y: number, cropWidth: number, cropHeight: number, func?: CropCallback<PixelMap|null>, colorRatio?: number) {
|
||||
if (!buf || buf.byteLength <= 0) {
|
||||
console.log("Crop buf is empty");
|
||||
if (func) {
|
||||
func("Crop buf is empty", null);
|
||||
func.cropCallback("Crop buf is empty", null);
|
||||
}
|
||||
return;
|
||||
}
|
||||
var imageSource = image.createImageSource(buf as any);
|
||||
getPixelMapSize(imageSource, (error, size: {
|
||||
width: number,
|
||||
height: number
|
||||
}) => {
|
||||
let imageSource:image.ImageSource = image.createImageSource(buf);
|
||||
let crop:CropCallback<CropSize|null> = { cropCallback: (error:BusinessError|string, size: CropSize|null) => {
|
||||
if (!size) {
|
||||
func(error, null)
|
||||
func?.cropCallback(error, null)
|
||||
return;
|
||||
}
|
||||
var pixelMapWidth = size.width;
|
||||
var pixelMapHeight = size.height;
|
||||
let pixelMapWidth = size.width;
|
||||
let pixelMapHeight = size.height;
|
||||
if (x < 0 || x > pixelMapWidth) {
|
||||
func("Crop error x must be less than pixelMapWidth ", null)
|
||||
func?.cropCallback("Crop error x must be less than pixelMapWidth ", null)
|
||||
return;
|
||||
}
|
||||
if (y < 0 || y > pixelMapHeight) {
|
||||
func("Crop error x must be less than pixelMapHeight ", null)
|
||||
func?.cropCallback("Crop error x must be less than pixelMapHeight ", null)
|
||||
return;
|
||||
}
|
||||
var options = {
|
||||
let options: image.DecodingOptions = {
|
||||
editable: true,
|
||||
rotate: 0,
|
||||
desiredSize: {
|
||||
|
|
@ -58,58 +60,57 @@ export namespace Crop {
|
|||
},
|
||||
}
|
||||
imageSource.createPixelMap(options)
|
||||
.then((data) => {
|
||||
.then((data:PixelMap) => {
|
||||
if (colorRatio && colorRatio <= 1) {
|
||||
colorRatioPixelMap(data, pixelMapWidth, pixelMapHeight, colorRatio, func);
|
||||
} else {
|
||||
func("", data);
|
||||
func?.cropCallback("", data);
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
func(e, null);
|
||||
.catch((e:BusinessError) => {
|
||||
func?.cropCallback(e, null);
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
getPixelMapSize(imageSource, crop)
|
||||
}
|
||||
|
||||
var colorRatioPixelMap = async (data: any, width: number, height: number, colorRatio: number, func?: CropCallback<PixelMap>)=> {
|
||||
let colorRatioPixelMap = async (data: PixelMap, width: number, height: number, colorRatio: number, func?: CropCallback<PixelMap|null>)=> {
|
||||
if (!data) {
|
||||
func("colorRatio pixelMap is null", null);
|
||||
func?.cropCallback("colorRatio pixelMap is null", null);
|
||||
return;
|
||||
}
|
||||
if (colorRatio > 1) {
|
||||
throw new Error("the colorRatio must be <= 1");
|
||||
}
|
||||
var buffer = new ArrayBuffer(width * height * 5);
|
||||
var bytes = new Uint8Array(buffer);
|
||||
var buffer1B = new ArrayBuffer(width * height * 5);
|
||||
var bytes1B = new Uint8Array(buffer1B);
|
||||
let buffer = new ArrayBuffer(width * height * 5);
|
||||
let bytes = new Uint8Array(buffer);
|
||||
let buffer1B = new ArrayBuffer(width * height * 5);
|
||||
let bytes1B = new Uint8Array(buffer1B);
|
||||
|
||||
let readPromise = data.readPixelsToBuffer(buffer)
|
||||
let readPromise:Promise<void> = data.readPixelsToBuffer(buffer)
|
||||
await readPromise;
|
||||
for (let i = 0;i < bytes.length; i++) {
|
||||
bytes1B[i] = bytes[i] * colorRatio;
|
||||
}
|
||||
let writePromise = data.writeBufferToPixels(buffer1B)
|
||||
let writePromise:Promise<void> = data.writeBufferToPixels(buffer1B)
|
||||
await writePromise;
|
||||
func("", data);
|
||||
func?.cropCallback("", data);
|
||||
}
|
||||
|
||||
|
||||
var getPixelMapSize = (imageSource: any, func: CropCallback<{
|
||||
width: number,
|
||||
height: number
|
||||
}>)=> {
|
||||
let getPixelMapSize = (imageSource: image.ImageSource, func: CropCallback<CropSize|null>)=> {
|
||||
if (!imageSource) {
|
||||
return;
|
||||
}
|
||||
imageSource.getImageInfo((err, value) => {
|
||||
if (err) {
|
||||
func(err, null)
|
||||
func.cropCallback(err, null)
|
||||
return;
|
||||
}
|
||||
var pWidth = value.size.width;
|
||||
var pHeight = value.size.height;
|
||||
func('', { width: pWidth, height: pHeight });
|
||||
let pWidth = value.size.width;
|
||||
let pHeight = value.size.height;
|
||||
func.cropCallback('', { width: pWidth, height: pHeight });
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
import { BusinessError } from '@ohos.base'
|
||||
export interface CropCallback<T> {
|
||||
(err, data: T)
|
||||
cropCallback:(err:BusinessError|string, data: T)=>void
|
||||
}
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import {CropOptions} from "../crop/CropOptions";
|
||||
import {CropOptions,Size} from "../crop/CropOptions";
|
||||
|
||||
@Component
|
||||
export struct CropImage {
|
||||
|
|
@ -35,10 +35,15 @@ export struct CropImage {
|
|||
})
|
||||
.scale({ x: this._scale, y: this._scale, z: 1.0 })
|
||||
.gesture(GestureGroup(GestureMode.Parallel,
|
||||
RotationGesture({ fingers: 1 }).onActionUpdate(event => {
|
||||
this._rotate = event.angle;
|
||||
}), PinchGesture({ fingers: 2 }).onActionUpdate(event => {
|
||||
this._scale = event.scale;
|
||||
RotationGesture({ fingers: 1 }).onActionUpdate((event?: GestureEvent) => {
|
||||
if(event != undefined) {
|
||||
this._rotate = event.angle;
|
||||
}
|
||||
}), PinchGesture({ fingers: 2 }).onActionUpdate((event?: GestureEvent) => {
|
||||
if(event != undefined) {
|
||||
this._scale = event.scale;
|
||||
}
|
||||
|
||||
})
|
||||
).onCancel(() => {
|
||||
console.log("CropImage gesture cancel");
|
||||
|
|
|
|||
|
|
@ -12,11 +12,12 @@
|
|||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
export interface Size{
|
||||
width: number,
|
||||
height: number;
|
||||
}
|
||||
|
||||
export class CropOptions {
|
||||
export interface CropOptions {
|
||||
src: string | PixelMap | Resource;
|
||||
size: {
|
||||
width: number,
|
||||
height: number;
|
||||
}
|
||||
size: Size
|
||||
}
|
||||
|
|
@ -15,11 +15,11 @@
|
|||
import image from "@ohos.multimedia.image"
|
||||
import { Crop } from './Crop'
|
||||
import { CropCallback } from './CropCallback'
|
||||
|
||||
import { BusinessError } from '@ohos.base'
|
||||
@Component
|
||||
struct PixelMapCrop {
|
||||
@Watch('watchOptions') @Link options: PixelMapCrop.Options;
|
||||
@Watch('watchCropTap') @Prop cropTap: boolean;
|
||||
@Watch('watchOptions') @Link options: Options;
|
||||
@Watch('watchCropTap') @Prop cropTap: boolean = false;
|
||||
@State bWidth: number = 0;
|
||||
@State bHeight: number = 0;
|
||||
@State cWidth: number = 0;
|
||||
|
|
@ -305,59 +305,60 @@ struct PixelMapCrop {
|
|||
// .backgroundColor('#33000000')
|
||||
.onReady(() => {
|
||||
})
|
||||
.onTouch((event: TouchEvent) => {
|
||||
if (event.type === TouchType.Down) {
|
||||
// 手指按下
|
||||
this.downX = event.touches[0].x;
|
||||
this.downY = event.touches[0].y;
|
||||
.onTouch((event?: TouchEvent) => {
|
||||
if(event != undefined) {
|
||||
if (event.type === TouchType.Down) {
|
||||
// 手指按下
|
||||
this.downX = event.touches[0].x;
|
||||
this.downY = event.touches[0].y;
|
||||
|
||||
this.lastMoveX = event.touches[0].x;
|
||||
this.lastMoveY = event.touches[0].y;
|
||||
this.lastMoveX = event.touches[0].x;
|
||||
this.lastMoveY = event.touches[0].y;
|
||||
|
||||
this.belongRegion()
|
||||
this.belongRegion()
|
||||
|
||||
}
|
||||
if (event.type === TouchType.Up) {
|
||||
// 手指放开
|
||||
this.downX = 0;
|
||||
this.downY = 0;
|
||||
|
||||
this.moveX = 0;
|
||||
this.moveY = 0;
|
||||
|
||||
this.resetTouch();
|
||||
|
||||
}
|
||||
if (event.type === TouchType.Move) {
|
||||
// 手指移动
|
||||
this.moveX = event.touches[0].x;
|
||||
this.moveY = event.touches[0].y;
|
||||
// 每次移动的delta数据
|
||||
let dx = this.moveX - this.lastMoveX;
|
||||
let dy = this.moveY - this.lastMoveY;
|
||||
|
||||
console.log('PMC this.isTopLeftAreaTouch =' + this.isTopLeftAreaTouch + ' this.isTopRightAreaTouch =' + this.isTopRightAreaTouch
|
||||
+ ' this.isBottomLeftAreaTouch=' + this.isBottomLeftAreaTouch + ' isBottomRightAreaTouch' + this.isBottomRightAreaTouch
|
||||
+ ' dx =' + dx + ' dy =' + dy)
|
||||
|
||||
this.touchLeftTopArea(dx, dy)
|
||||
this.touchRightTopArea(dx, dy)
|
||||
this.touchLeftBottomArea(dx, dy)
|
||||
this.touchRightBottomArea(dx, dy)
|
||||
|
||||
|
||||
this.touchTopLineArea(dx, dy)
|
||||
this.touchLeftLineArea(dx, dy)
|
||||
this.touchRightLineArea(dx, dy)
|
||||
this.touchBottomLineArea(dx, dy)
|
||||
|
||||
this.touchMoveCropBox(dx, dy);
|
||||
|
||||
this.lastMoveX = event.touches[0].x
|
||||
this.lastMoveY = event.touches[0].y
|
||||
|
||||
}
|
||||
}
|
||||
if (event.type === TouchType.Up) {
|
||||
// 手指放开
|
||||
this.downX = 0;
|
||||
this.downY = 0;
|
||||
|
||||
this.moveX = 0;
|
||||
this.moveY = 0;
|
||||
|
||||
this.resetTouch();
|
||||
|
||||
}
|
||||
if (event.type === TouchType.Move) {
|
||||
// 手指移动
|
||||
this.moveX = event.touches[0].x;
|
||||
this.moveY = event.touches[0].y;
|
||||
// 每次移动的delta数据
|
||||
let dx = this.moveX - this.lastMoveX;
|
||||
let dy = this.moveY - this.lastMoveY;
|
||||
|
||||
console.log('PMC this.isTopLeftAreaTouch =' + this.isTopLeftAreaTouch + ' this.isTopRightAreaTouch =' + this.isTopRightAreaTouch
|
||||
+ ' this.isBottomLeftAreaTouch=' + this.isBottomLeftAreaTouch + ' isBottomRightAreaTouch' + this.isBottomRightAreaTouch
|
||||
+ ' dx =' + dx + ' dy =' + dy)
|
||||
|
||||
this.touchLeftTopArea(dx, dy)
|
||||
this.touchRightTopArea(dx, dy)
|
||||
this.touchLeftBottomArea(dx, dy)
|
||||
this.touchRightBottomArea(dx, dy)
|
||||
|
||||
|
||||
this.touchTopLineArea(dx, dy)
|
||||
this.touchLeftLineArea(dx, dy)
|
||||
this.touchRightLineArea(dx, dy)
|
||||
this.touchBottomLineArea(dx, dy)
|
||||
|
||||
this.touchMoveCropBox(dx, dy);
|
||||
|
||||
this.lastMoveX = event.touches[0].x
|
||||
this.lastMoveY = event.touches[0].y
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
|
|
@ -785,46 +786,46 @@ struct PixelMapCrop {
|
|||
}
|
||||
}
|
||||
|
||||
namespace PixelMapCrop {
|
||||
|
||||
|
||||
export class Options {
|
||||
width: number;
|
||||
height: number;
|
||||
pixelMap: PixelMap;
|
||||
export class Options {
|
||||
width: number = 0;
|
||||
height: number = 0;
|
||||
pixelMap?: PixelMap = undefined;
|
||||
|
||||
// 是否需要绘制线
|
||||
hasGuideLine: boolean;
|
||||
pixelBuffer: ArrayBuffer;
|
||||
hasGuideLine: boolean = false;
|
||||
pixelBuffer: ArrayBuffer = new ArrayBuffer(0);
|
||||
// 展示pixel宽度
|
||||
pixelWidth: number;
|
||||
pixelWidth: number = 0;
|
||||
// 展示pixel高度
|
||||
pixelHeight: number;
|
||||
pixelHeight: number = 0;
|
||||
// 缩放scale:center-inside类型缩放的比例
|
||||
pixelScale: number;
|
||||
pixelScale: number = 1;
|
||||
|
||||
// 用户裁剪后的回调
|
||||
cropFunction: Function;
|
||||
cropFunction: (error:BusinessError, pixelmap:PixelMap, sx:number, sy:number) => void = (error:BusinessError, pixelmap:PixelMap, sx:number, sy:number)=>{};
|
||||
|
||||
// 本地裁剪框 回调
|
||||
cropAction: Function;
|
||||
cropAction: (topLeftPoint:number[], bottomRightPoint:number[], scaleInside:number) =>void = (topLeftPoint:number[], bottomRightPoint:number[], scaleInside:number)=>{};
|
||||
|
||||
constructor() {
|
||||
|
||||
}
|
||||
|
||||
// 裁剪动作
|
||||
setCropFunction(crop: (error, pixelmap, sx, sy) => void) {
|
||||
setCropFunction(crop: (error:BusinessError, pixelmap:PixelMap, sx:number, sy:number) => void) {
|
||||
this.cropFunction = crop;
|
||||
|
||||
this.cropAction = (topLeftPoint, bottomRightPoint, scaleInside) => {
|
||||
let dx = vp2px(1) * topLeftPoint[0] * 1.0 / scaleInside;
|
||||
let dy = vp2px(1) * topLeftPoint[1] * 1.0 / scaleInside;
|
||||
let sx = vp2px(1) * (bottomRightPoint[0] - topLeftPoint[0]) * 1.0 / scaleInside;
|
||||
let sy = vp2px(1) * (bottomRightPoint[1] - topLeftPoint[1]) * 1.0 / scaleInside;
|
||||
Crop.crop(this.pixelBuffer, dx, dy, sx, sy, (error, pixelmap) => {
|
||||
this.cropFunction(error, pixelmap, sx, sy)
|
||||
this.cropAction = (topLeftPoint:number[], bottomRightPoint:number[], scaleInside:number) => {
|
||||
let dx:number = vp2px(1) * topLeftPoint[0] * 1.0 / scaleInside;
|
||||
let dy:number = vp2px(1) * topLeftPoint[1] * 1.0 / scaleInside;
|
||||
let sx:number = vp2px(1) * (bottomRightPoint[0] - topLeftPoint[0]) * 1.0 / scaleInside;
|
||||
let sy:number = vp2px(1) * (bottomRightPoint[1] - topLeftPoint[1]) * 1.0 / scaleInside;
|
||||
Crop.crop(this.pixelBuffer, dx, dy, sx, sy, {
|
||||
cropCallback: (error: BusinessError | string, pixelmap: PixelMap | null) => {
|
||||
this.cropFunction(error, pixelmap, sx, sy)
|
||||
}
|
||||
}, 1);
|
||||
|
||||
}
|
||||
|
||||
return this;
|
||||
|
|
@ -857,7 +858,7 @@ namespace PixelMapCrop {
|
|||
//数据赋值
|
||||
this.pixelBuffer = buffer;
|
||||
|
||||
let imageSource = image.createImageSource(buffer as any);
|
||||
let imageSource:image.ImageSource = image.createImageSource(buffer);
|
||||
imageSource.getImageInfo().then((imageInfo) => {
|
||||
//获取宽高
|
||||
|
||||
|
|
@ -879,7 +880,7 @@ namespace PixelMapCrop {
|
|||
this.pixelWidth = imageInfo.size.width * scaleInside;
|
||||
this.pixelHeight = imageInfo.size.height * scaleInside;
|
||||
|
||||
let options = {
|
||||
let options:image.DecodingOptions = {
|
||||
editable: true,
|
||||
rotate: 0,
|
||||
desiredSize: {
|
||||
|
|
@ -887,7 +888,7 @@ namespace PixelMapCrop {
|
|||
height: imageInfo.size.height * scaleInside,
|
||||
}
|
||||
}
|
||||
imageSource.createPixelMap(options).then((pixelmap) => {
|
||||
imageSource.createPixelMap(options).then((pixelmap:PixelMap) => {
|
||||
this.pixelMap = pixelmap;
|
||||
if (readyCrop) {
|
||||
readyCrop();
|
||||
|
|
@ -898,6 +899,6 @@ namespace PixelMapCrop {
|
|||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default PixelMapCrop;
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue