994 lines
32 KiB
Plaintext
994 lines
32 KiB
Plaintext
/*
|
|
* Copyright (C) 2021 Huawei Device Co., Ltd.
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
import { RequestOption,ImageKnifeGlobal} from '@ohos/imageknife'
|
|
import { CropCircleTransformation } from '@ohos/imageknife'
|
|
import { RoundedCornersTransformation } from '@ohos/imageknife'
|
|
import {
|
|
CropCircleWithBorderTransformation
|
|
} from '@ohos/imageknife/src/main/ets/components/imageknife/transform/CropCircleWithBorderTransformation'
|
|
import { RotateImageTransformation } from '@ohos/imageknife'
|
|
import { CropSquareTransformation } from '@ohos/imageknife'
|
|
import { CropTransformation } from '@ohos/imageknife'
|
|
import { CropType } from '@ohos/imageknife'
|
|
import { GrayscaleTransformation } from '@ohos/imageknife'
|
|
import { BrightnessFilterTransformation } from '@ohos/imageknife'
|
|
import { ContrastFilterTransformation } from '@ohos/imageknife'
|
|
import { InvertFilterTransformation } from '@ohos/imageknife'
|
|
import { SepiaFilterTransformation } from '@ohos/imageknife'
|
|
import { SketchFilterTransformation } from '@ohos/imageknife'
|
|
import { BlurTransformation } from '@ohos/imageknife'
|
|
import { PixelationFilterTransformation } from '@ohos/imageknife'
|
|
import { MaskTransformation } from '@ohos/imageknife'
|
|
import { SwirlFilterTransformation } from '@ohos/imageknife'
|
|
import { BusinessError } from '@ohos.base'
|
|
import {ImageKnifeData} from '@ohos/imageknife'
|
|
/**
|
|
* PixelMap transform 示例
|
|
*/
|
|
let mRotate: number = 0;
|
|
//let mUrl = "https://hbimg.huabanimg.com/cc6af25f8d782d3cf3122bef4e61571378271145735e9-vEVggB"
|
|
let mUrl = $r('app.media.pngSample');
|
|
|
|
@Entry
|
|
@Component
|
|
struct TransformPixelMapPage {
|
|
@State url: string = "";
|
|
@State mCropPixelMap?: PixelMap = undefined;
|
|
@State mRoundPixelMap?: PixelMap = undefined;
|
|
@State mCirclePixelMap?: PixelMap = undefined;
|
|
@State mCircleBorderPixelMap?: PixelMap = undefined;
|
|
@State mRotatePixelMap?: PixelMap = undefined;
|
|
@State mSquarePixelMap?: PixelMap = undefined;
|
|
@State mClipTopPixelMap?: PixelMap = undefined;
|
|
@State mClipCenterPixelMap?: PixelMap = undefined;
|
|
@State mClipBottomPixelMap?: PixelMap = undefined;
|
|
@State mGrayscalePixelMap?: PixelMap = undefined;
|
|
@State mBrightnessPixelMap?: PixelMap = undefined;
|
|
@State mContrastPixelMap?: PixelMap = undefined;
|
|
@State mInvertPixelMap?: PixelMap = undefined;
|
|
@State mSepiaPixelMap?: PixelMap = undefined;
|
|
@State mSketchPixelMap?: PixelMap = undefined;
|
|
@State mBlurPixelMap?: PixelMap = undefined;
|
|
@State mPixelPixelMap?: PixelMap = undefined;
|
|
@State mSwirlPixelMap?: PixelMap = undefined;
|
|
@State mMaskPixelMap?: PixelMap = undefined;
|
|
@State mKuwaharaPixelMap?: PixelMap = undefined;
|
|
@State mToonPixelMap?: PixelMap = undefined;
|
|
@State mVignettePixelMap?: PixelMap = undefined;
|
|
|
|
build() {
|
|
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center }) {
|
|
Scroll() {
|
|
Column() {
|
|
Column() {
|
|
Text("基础变换").fontColor(Color.Gray).fontSize(16);
|
|
Row({ space: 1 }) {
|
|
Button() {
|
|
Text("CenterCrop").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(100)
|
|
.onClick(() => {
|
|
this.centerCrop();
|
|
});
|
|
Button() {
|
|
Text("CenterInside").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(100)
|
|
.onClick(() => {
|
|
this.centerInside();
|
|
});
|
|
Button() {
|
|
Text("fitCenter").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(100)
|
|
.onClick(() => {
|
|
this.fitCenter();
|
|
});
|
|
}.margin({ top: 10 })
|
|
|
|
Image(this.mCropPixelMap == undefined ? '':this.mCropPixelMap!)
|
|
.objectFit(ImageFit.None)
|
|
.width(100)
|
|
.height(100)
|
|
.backgroundColor("#23d1de")
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("RoundedCornersTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Row({ space: 1 }) {
|
|
Button() {
|
|
Text($r("app.string.left_top_corner")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.roundedCornersTransformation(10, 0, 0, 0);
|
|
});
|
|
Button() {
|
|
Text($r("app.string.r_top_corner")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.roundedCornersTransformation(0, 0, 10, 0);
|
|
});
|
|
Button() {
|
|
Text($r("app.string.left_bottom_corner")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.roundedCornersTransformation(0, 10, 0, 0);
|
|
});
|
|
Button() {
|
|
Text($r("app.string.r_bottom_corner")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.roundedCornersTransformation(0, 0, 0, 10);
|
|
});
|
|
Button("All")
|
|
.fontSize(13)
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.roundedCornersTransformation(10, 10, 10, 10);
|
|
});
|
|
}.margin({ top: 10 })
|
|
|
|
Image(this.mRoundPixelMap == undefined ? '': this.mRoundPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(100)
|
|
.height(100)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("CropCircleTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.trans_circle")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.circleTransformation();
|
|
});
|
|
Image(this.mCirclePixelMap == undefined ? '':this.mCirclePixelMap!)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("CropCircleWithBorderTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.trans_circle_border")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.circleBorderTransformation(5);
|
|
});
|
|
Image(this.mCircleBorderPixelMap == undefined ? '':this.mCircleBorderPixelMap!)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("RotateImageTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.trans_rotate")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
mRotate += 45;
|
|
if (mRotate > 360) {
|
|
mRotate = 0;
|
|
}
|
|
this.transformRotate(mRotate);
|
|
});
|
|
Image(this.mRotatePixelMap == undefined ? '':this.mRotatePixelMap!)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("CropSquareTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.trans_square")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.transformSquare();
|
|
});
|
|
Image(this.mSquarePixelMap == undefined ? '' : this.mSquarePixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("CropTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Row({ space: 1 }) {
|
|
Button() {
|
|
Text($r("app.string.trans_clip_top")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.clipPixelMap(25, 25, CropType.TOP);
|
|
});
|
|
Button() {
|
|
Text($r("app.string.trans_clip_center")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.clipPixelMap(25, 25, CropType.CENTER);
|
|
});
|
|
Button() {
|
|
Text($r("app.string.trans_clip_bottom")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(72)
|
|
.onClick(() => {
|
|
this.clipPixelMap(25, 25, CropType.BOTTOM);
|
|
});
|
|
}.margin({ top: 10 })
|
|
|
|
Row({ space: 1 }) {
|
|
Image(this.mClipTopPixelMap == undefined ? '':this.mClipTopPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(100)
|
|
.height(100)
|
|
.margin({ top: 10 })
|
|
Image(this.mClipCenterPixelMap == undefined ? '':this.mClipCenterPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(100)
|
|
.height(100)
|
|
.margin({ top: 10 })
|
|
Image(this.mClipBottomPixelMap == undefined ? '':this.mClipBottomPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(100)
|
|
.height(100)
|
|
.margin({ top: 10 })
|
|
}
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("GrayscaleTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_grayscale")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.grayscalePixelMap();
|
|
});
|
|
Image(this.mGrayscalePixelMap == undefined ? '': this.mGrayscalePixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
Column() {
|
|
Text("BrightnessFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_Brightness")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.brightnessPixelMap(0.8);
|
|
});
|
|
Image(this.mBrightnessPixelMap == undefined?'':this.mBrightnessPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
Column() {
|
|
Text("ContrastFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_Contrast")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.contrastPixelMap(4);
|
|
});
|
|
Image(this.mContrastPixelMap == undefined?'':this.mContrastPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
Column() {
|
|
Text("InvertFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_Invert")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.invertPixelMap();
|
|
});
|
|
Image(this.mInvertPixelMap == undefined ? '':this.mInvertPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("SepiaFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_Sepia")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.sepiaPixelMap();
|
|
});
|
|
Image(this.mSepiaPixelMap == undefined ? '':this.mSepiaPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
Column() {
|
|
Text("SketchFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_Sketch")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.sketchPixelMap();
|
|
});
|
|
Image(this.mSketchPixelMap == undefined ? '':this.mSketchPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("BlurTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_blur")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.blurHandlePixelMap(20);
|
|
});
|
|
Image(this.mBlurPixelMap==undefined?'':this.mBlurPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
|
|
Column() {
|
|
Text("PixelationFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text($r("app.string.image_pixel")).fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.pixelHandlePixelMap(20);
|
|
});
|
|
Image(this.mPixelPixelMap == undefined ? '':this.mPixelPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("SwirlFilterTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text("图片Swirl").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.swirlHandlePixelMap();
|
|
});
|
|
Image(this.mSwirlPixelMap == undefined ? '':this.mSwirlPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("MaskTransformation").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text("图片mask").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.maskHandlePixelMap($r('app.media.mask_starfish'));
|
|
});
|
|
Image(this.mMaskPixelMap == undefined ? '':this.mMaskPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("KuwaharaFilterTransform").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text("图片kuwahara").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.kuwaharaHandlePixelMap();
|
|
});
|
|
Image(this.mKuwaharaPixelMap == undefined? '':this.mKuwaharaPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("ToonFilterTransform").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text("图片toon").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.toonHandlePixelMap();
|
|
});
|
|
Image(this.mToonPixelMap == undefined?'':this.mToonPixelMap!)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
Column() {
|
|
Text("VignetteFilterTransform").fontColor(Color.Gray).fontSize(16);
|
|
Button() {
|
|
Text("图片vignette").fontSize(13).fontColor(Color.White)
|
|
}
|
|
.height(35)
|
|
.width(120)
|
|
.margin({ top: 10 })
|
|
.onClick(() => {
|
|
this.vignetteHandlePixelMap();
|
|
});
|
|
Image(this.mVignettePixelMap == undefined ? '':this.mVignettePixelMap)
|
|
.objectFit(ImageFit.Fill)
|
|
.width(200)
|
|
.height(200)
|
|
.margin({ top: 10 })
|
|
|
|
}.margin({ top: 10 });
|
|
|
|
}.margin({ bottom: 30 });
|
|
|
|
}
|
|
}.width('100%').height('100%');
|
|
}
|
|
|
|
aboutToAppear() {
|
|
|
|
}
|
|
|
|
/**
|
|
* centerCrop
|
|
*/
|
|
centerCrop() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load($r('app.media.jpgSample'))
|
|
// imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
this.mCropPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(100), height: vp2px(100) })
|
|
.skipMemoryCache(true)
|
|
.centerCrop();
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* centerInside
|
|
*/
|
|
centerInside() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load($r('app.media.Back'))
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
this.mCropPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(100), height: vp2px(100) })
|
|
.skipMemoryCache(true)
|
|
.centerInside();
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* centerInside
|
|
*/
|
|
fitCenter() {
|
|
let imageKnifeOption = new RequestOption()
|
|
imageKnifeOption.load($r('app.media.Back'))
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
this.mCropPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(100), height: vp2px(100) })
|
|
.skipMemoryCache(true)
|
|
.fitCenter();
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
/**
|
|
* 圆角设置
|
|
*/
|
|
roundedCornersTransformation(top_left: number,
|
|
bottom_left: number, top_right: number, bottom_right: number) {
|
|
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
this.mRoundPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(100), height: vp2px(100) })
|
|
.skipMemoryCache(true)
|
|
.roundedCorners({
|
|
top_left: top_left,
|
|
top_right: top_right,
|
|
bottom_left: bottom_left,
|
|
bottom_right: bottom_right
|
|
})
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* 裁剪圆
|
|
*/
|
|
circleTransformation() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mCirclePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.cropCircle()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* 圆环裁剪
|
|
*/
|
|
circleBorderTransformation(border: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let circleTransformation = new CropCircleWithBorderTransformation(border,
|
|
{ r_color: 255, g_color: 204, b_color: 204 });
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mCircleBorderPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.cropCircleWithBorder(border,
|
|
{ r_color: 255, g_color: 204, b_color: 204 })
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* 旋转
|
|
*/
|
|
transformRotate(angled: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new RotateImageTransformation(angled);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mRotatePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.rotateImage(angled)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* 正方形裁剪
|
|
*/
|
|
transformSquare() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new CropSquareTransformation();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mSquarePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.cropSquare()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
}
|
|
|
|
/**
|
|
* 区域裁剪
|
|
*/
|
|
clipPixelMap(width: number, height: number, cropType: CropType) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new CropTransformation(width, height, cropType);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
let result:PixelMap|undefined = undefined;
|
|
if (cropType == CropType.TOP) {
|
|
result = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
this.mClipTopPixelMap = result;
|
|
} else if (cropType == CropType.CENTER) {
|
|
result = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
this.mClipCenterPixelMap = result;
|
|
} else if (cropType == CropType.BOTTOM) {
|
|
result = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
this.mClipBottomPixelMap = result;
|
|
}
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: width, height: height })
|
|
.skipMemoryCache(true)
|
|
.crop(width, height, cropType)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
* 灰度
|
|
*/
|
|
grayscalePixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new GrayscaleTransformation();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mGrayscalePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.grayscale()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*亮度b
|
|
*/
|
|
brightnessPixelMap(brightness: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new BrightnessFilterTransformation(brightness);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mBrightnessPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.brightnessFilter(brightness)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*对比度
|
|
*/
|
|
contrastPixelMap(contrast: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new ContrastFilterTransformation(contrast);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mContrastPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.contrastFilter(contrast)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*反转处理
|
|
*/
|
|
invertPixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new InvertFilterTransformation();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mInvertPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.invertFilter()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*照片老旧出来（黑褐色）
|
|
*/
|
|
sepiaPixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new SepiaFilterTransformation();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mSepiaPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.sepiaFilter()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*素描
|
|
*/
|
|
sketchPixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new SketchFilterTransformation();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mSketchPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.sketchFilter()
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*模糊
|
|
*/
|
|
blurHandlePixelMap(radius: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new BlurTransformation(radius);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mBlurPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.blur(radius)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
/**
|
|
*马赛克
|
|
*/
|
|
pixelHandlePixelMap(pixel: number) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new PixelationFilterTransformation(pixel);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mPixelPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.pixelationFilter(pixel)
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*扭曲
|
|
*/
|
|
swirlHandlePixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new SwirlFilterTransformation(80);
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mSwirlPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.swirlFilter(80)
|
|
// .diskCacheStrategy(new NONE())
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
/**
|
|
*遮罩
|
|
*/
|
|
maskHandlePixelMap(maskResource: Resource) {
|
|
let imageKnifeOption = new RequestOption();
|
|
let transformation = new MaskTransformation(maskResource);
|
|
// imageKnifeOption.load($r('app.media.photo6'))
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mMaskPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.mask(maskResource)
|
|
// .diskCacheStrategy(new NONE())
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*kuwahara
|
|
*/
|
|
kuwaharaHandlePixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mKuwaharaPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.kuwaharaFilter(20.0)
|
|
// .diskCacheStrategy(new NONE())
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*toon
|
|
*/
|
|
toonHandlePixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mToonPixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.toonFilter(0.2, 50.0);
|
|
// .diskCacheStrategy(new NONE())
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
|
|
/**
|
|
*vignette
|
|
*/
|
|
vignetteHandlePixelMap() {
|
|
let imageKnifeOption = new RequestOption();
|
|
imageKnifeOption.load(mUrl)
|
|
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
|
|
|
this.mVignettePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
|
|
|
|
return false;
|
|
}})
|
|
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
|
.skipMemoryCache(true)
|
|
.enableGPU()
|
|
.vignetteFilter([0.5, 0.5], [0.0, 0.0, 0.0], [0.3, 0.5])
|
|
// .diskCacheStrategy(new NONE())
|
|
ImageKnife?.call(imageKnifeOption);
|
|
|
|
}
|
|
}
|
|
|
|
let ImageKnife = ImageKnifeGlobal.getInstance().getImageKnife(); |