修复使用模糊化出现图片变模糊和变形
Signed-off-by: zenggaofeng <zenggaofeng2@h-partners.com>
This commit is contained in:
zenggaofeng
parent
52a43f42bc
commit
00d43899f4
|
|
@ -1,5 +1,6 @@
|
|||
## 2.1.2-rc.7
|
||||
- 修复图片圆角图形变换导致抗锯齿、ScaleType失效
|
||||
- 修复使用模糊化出现图片变模糊和变形
|
||||
|
||||
## 2.1.2-rc.6
|
||||
- 修复手机调节显示大小时图片消失
|
||||
|
|
|
|||
46
README.md
46
README.md
|
|
@ -367,30 +367,30 @@ request.skipMemoryCache(true)
|
|||
|
||||
### 图片变换相关
|
||||
|
||||
| 使用方法 | 类型 | 相关描述 |
|
||||
|--------------------------------|------------------------------------|----------------------------------|
|
||||
| request.centerCrop() | CenterCrop | 可以根据图片文件，目标显示大小，进行对应centerCrop |
|
||||
| 使用方法 | 类型 | 相关描述 |
|
||||
|--------------------------------|------------------------------------|--------------------------------|
|
||||
| request.centerCrop() | CenterCrop | 可以根据图片文件，目标显示大小，进行对应centerCrop |
|
||||
| request.centerInside() | CenterInside | 可以根据图片文件，目标显示大小，进行对应centerInside |
|
||||
| request.fitCenter() | FitCenter | 可以根据图片文件，目标显示大小，进行对应fitCenter |
|
||||
| request.blur() | BlurTransformation | 模糊处理 |
|
||||
| request.brightnessFilter() | BrightnessFilterTransformation | 亮度滤波器 |
|
||||
| request.contrastFilter() | ContrastFilterTransformation | 对比度滤波器 |
|
||||
| request.cropCircle() | CropCircleTransformation | 圆形剪裁显示 |
|
||||
| request.cropCircleWithBorder() | CropCircleWithBorderTransformation | 圆环展示 |
|
||||
| request.cropSquare() | CropSquareTransformation | 正方形剪裁 |
|
||||
| request.crop() | CropTransformation | 自定义矩形剪裁 |
|
||||
| request.grayscale() | GrayscaleTransformation | 灰度级转换 |
|
||||
| request.invertFilter() | InvertFilterTransformation | 反转滤波器 |
|
||||
| request.pixelationFilter() | PixelationFilterTransformation | 像素化滤波器 |
|
||||
| request.rotateImage() | RotateImageTransformation | 图片旋转 |
|
||||
| request.roundedCorners() | RoundedCornersTransformation | 圆角剪裁 |
|
||||
| request.sepiaFilter() | SepiaFilterTransformation | 乌墨色滤波器 |
|
||||
| request.sketchFilter() | SketchFilterTransformation | 素描滤波器 |
|
||||
| request.mask() | MaskTransformation | 遮罩 |
|
||||
| request.swirlFilter() | SwirlFilterTransformation | 扭曲滤波器 |
|
||||
| request.kuwaharaFilter() | KuwaharaFilterTransform | 桑原滤波器 |
|
||||
| request.toonFilter() | ToonFilterTransform | 动画滤波器 |
|
||||
| request.vignetteFilter() | VignetteFilterTransform | 装饰滤波器 |
|
||||
| request.fitCenter() | FitCenter | 可以根据图片文件，目标显示大小，进行对应fitCenter |
|
||||
| request.blur() | BlurTransformation | 模糊处理(图片分辨率较大建议传递第二个参数将图片进行缩小) |
|
||||
| request.brightnessFilter() | BrightnessFilterTransformation | 亮度滤波器 |
|
||||
| request.contrastFilter() | ContrastFilterTransformation | 对比度滤波器 |
|
||||
| request.cropCircle() | CropCircleTransformation | 圆形剪裁显示 |
|
||||
| request.cropCircleWithBorder() | CropCircleWithBorderTransformation | 圆环展示 |
|
||||
| request.cropSquare() | CropSquareTransformation | 正方形剪裁 |
|
||||
| request.crop() | CropTransformation | 自定义矩形剪裁 |
|
||||
| request.grayscale() | GrayscaleTransformation | 灰度级转换 |
|
||||
| request.invertFilter() | InvertFilterTransformation | 反转滤波器 |
|
||||
| request.pixelationFilter() | PixelationFilterTransformation | 像素化滤波器 |
|
||||
| request.rotateImage() | RotateImageTransformation | 图片旋转 |
|
||||
| request.roundedCorners() | RoundedCornersTransformation | 圆角剪裁 |
|
||||
| request.sepiaFilter() | SepiaFilterTransformation | 乌墨色滤波器 |
|
||||
| request.sketchFilter() | SketchFilterTransformation | 素描滤波器 |
|
||||
| request.mask() | MaskTransformation | 遮罩 |
|
||||
| request.swirlFilter() | SwirlFilterTransformation | 扭曲滤波器 |
|
||||
| request.kuwaharaFilter() | KuwaharaFilterTransform | 桑原滤波器 |
|
||||
| request.toonFilter() | ToonFilterTransform | 动画滤波器 |
|
||||
| request.vignetteFilter() | VignetteFilterTransform | 装饰滤波器 |
|
||||
|
||||
<img src="screenshot/gif4.gif" width="50%"/>
|
||||
|
||||
|
|
|
|||
|
|
@ -406,7 +406,7 @@ struct TransformPixelMapPage {
|
|||
.width(120)
|
||||
.margin({ top: 10 })
|
||||
.onClick(() => {
|
||||
this.blurHandlePixelMap(20);
|
||||
this.blurHandlePixelMap(20,3);
|
||||
});
|
||||
Image(this.mBlurPixelMap==undefined?'':this.mBlurPixelMap!)
|
||||
.objectFit(ImageFit.Fill)
|
||||
|
|
@ -847,9 +847,9 @@ struct TransformPixelMapPage {
|
|||
/**
|
||||
*模糊
|
||||
*/
|
||||
blurHandlePixelMap(radius: number) {
|
||||
blurHandlePixelMap(radius: number,sampling: number) {
|
||||
let imageKnifeOption = new RequestOption();
|
||||
let transformation = new BlurTransformation(radius);
|
||||
let transformation = new BlurTransformation(radius,sampling);
|
||||
imageKnifeOption.load(mUrl)
|
||||
.addListener({callback:(err:BusinessError|string, data:ImageKnifeData) => {
|
||||
|
||||
|
|
@ -860,7 +860,7 @@ struct TransformPixelMapPage {
|
|||
.setImageViewSize({ width: vp2px(200), height: vp2px(200) })
|
||||
.skipMemoryCache(true)
|
||||
.enableGPU()
|
||||
.blur(radius)
|
||||
.blur(radius,sampling)
|
||||
ImageKnife?.call(imageKnifeOption);
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,10 +64,10 @@ export default function Transform() {
|
|||
it('TestBlurTransformation', 0, ()=>{
|
||||
let startTime = new Date().getTime();
|
||||
for (let index = 0; index < BASE_COUNT; index++) {
|
||||
new BlurTransformation(15);
|
||||
new BlurTransformation(15,3);
|
||||
}
|
||||
endTime(startTime, 'TestBlurTransformation');
|
||||
let blur = new BlurTransformation(15);
|
||||
let blur = new BlurTransformation(15,3);
|
||||
expect(blur.getName()).assertEqual('BlurTransformation _mRadius:15')
|
||||
})
|
||||
it('TestBrightnessFilterTransformation', 1, ()=>{
|
||||
|
|
|
|||
|
|
@ -581,7 +581,7 @@ export struct ImageKnifeComponent {
|
|||
|
||||
requestAddTransform(request: RequestOption) {
|
||||
if (TransformType.BlurTransformation == this.imageKnifeOption.transform?.transformType) {
|
||||
request.blur(this.imageKnifeOption.transform?.blur)
|
||||
request.blur(this.imageKnifeOption.transform?.blur?.radius,this.imageKnifeOption.transform?.blur?.sampling)
|
||||
} else if (TransformType.BrightnessFilterTransformation == this.imageKnifeOption.transform?.transformType) {
|
||||
request.brightnessFilter(this.imageKnifeOption.transform?.brightnessFilter)
|
||||
} else if (TransformType.ContrastFilterTransformation == this.imageKnifeOption.transform?.transformType) {
|
||||
|
|
|
|||
|
|
@ -37,7 +37,10 @@ export interface Crop{
|
|||
height: number,
|
||||
cropType: CropType
|
||||
}
|
||||
|
||||
export interface BlurType {
|
||||
radius: number,
|
||||
sampling: number
|
||||
}
|
||||
export interface GifOptions{
|
||||
loopFinish?: (loopTime?:number) => void
|
||||
speedFactory?: number
|
||||
|
|
@ -45,7 +48,7 @@ export interface GifOptions{
|
|||
}
|
||||
export interface TransformOptions{
|
||||
transformType: number,
|
||||
blur?: number,
|
||||
blur?: BlurType,
|
||||
roundedCorners?: RoundCorner
|
||||
cropCircleWithBorder?: CropCircleWithBorder
|
||||
crop?:Crop
|
||||
|
|
|
|||
|
|
@ -377,12 +377,17 @@ export class RequestOption {
|
|||
return this;
|
||||
}
|
||||
|
||||
blur(radius: number|undefined) {
|
||||
blur(radius: number|undefined , sampling?: number) {
|
||||
if(radius == undefined){
|
||||
return
|
||||
}
|
||||
let transformation = new BlurTransformation(radius)
|
||||
this.transformations.push(transformation);
|
||||
if(sampling == undefined) {
|
||||
let transformation = new BlurTransformation(radius)
|
||||
this.transformations.push(transformation);
|
||||
} else {
|
||||
let transformation = new BlurTransformation(radius,sampling)
|
||||
this.transformations.push(transformation);
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -26,13 +26,19 @@ import {Size} from '../../imageknife/RequestOption'
|
|||
|
||||
export class BlurTransformation implements BaseTransform<PixelMap> {
|
||||
private _mRadius: number;
|
||||
private sampling: number
|
||||
|
||||
constructor(radius: number) {
|
||||
constructor(radius: number,sampling?:number) {
|
||||
this._mRadius = radius;
|
||||
if(sampling == undefined){
|
||||
this.sampling = 1
|
||||
} else {
|
||||
this.sampling = sampling
|
||||
}
|
||||
}
|
||||
|
||||
getName() {
|
||||
return "BlurTransformation _mRadius:" + this._mRadius;
|
||||
return "BlurTransformation _mRadius:" + this._mRadius +"==BlurTransformation sampling:"+ this.sampling;
|
||||
}
|
||||
|
||||
transform(buf: ArrayBuffer, request: RequestOption, func?: AsyncTransform<PixelMap>) {
|
||||
|
|
@ -63,8 +69,8 @@ export class BlurTransformation implements BaseTransform<PixelMap> {
|
|||
let options:image.DecodingOptions = {
|
||||
editable: true,
|
||||
desiredSize: {
|
||||
width: targetWidth,
|
||||
height: targetHeight
|
||||
width: pixelMapWidth / this.sampling,
|
||||
height: pixelMapHeight / this.sampling
|
||||
}
|
||||
}
|
||||
imageSource.createPixelMap(options)
|
||||
|
|
|
|||
Loading…
Reference in New Issue