diff --git a/entry/src/main/ets/common/CustomEngineKeyImpl.ets b/entry/src/main/ets/common/CustomEngineKeyImpl.ets index 06f2901..5d9fee4 100644 --- a/entry/src/main/ets/common/CustomEngineKeyImpl.ets +++ b/entry/src/main/ets/common/CustomEngineKeyImpl.ets @@ -12,6 +12,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { DownsampleStrategy } from '@ohos/imageknife'; import { IEngineKey, ImageKnifeOption, PixelMapTransformation,SparkMD5 ,ImageKnifeRequestSource} from '@ohos/libraryimageknife'; //全局自定义key demo @@ -35,6 +36,10 @@ export class CustomEngineKeyImpl implements IEngineKey { if (imageKnifeOption.transformation) { key += "transformation=" + this.getTransformation(imageKnifeOption.transformation) + ";" } + if ((imageKnifeOption.downsampleOf !== DownsampleStrategy.NONE && imageKnifeOption.downsampleOf !== undefined)) { + key += "downsampleOf" + imageKnifeOption.downsampleOf +"width="+width+"height="+ height + } + } return key } diff --git a/entry/src/main/ets/pages/DownSamplePage.ets b/entry/src/main/ets/pages/DownSamplePage.ets index b8cc0e6..c7442e0 100644 --- a/entry/src/main/ets/pages/DownSamplePage.ets +++ b/entry/src/main/ets/pages/DownSamplePage.ets @@ -45,24 +45,24 @@ struct DownSamplePage { updateImageKnifeOption(value: string) { if (value === 'NONE') { this.imageKnifeOption =new ImageKnifeOption( { - loadSrc: $r('app.media.jpgSample'), + loadSrc: $r('app.media.pngSample'), placeholderSrc: $r("app.media.loading"), errorholderSrc: $r("app.media.app_icon"), objectFit: ImageFit.Contain, downsampleOf: DownsampleStrategy.NONE }) - this.originalPixMap($r('app.media.jpgSample')) - this.afterSamplingFunc($r('app.media.jpgSample')) + this.originalPixMap($r('app.media.pngSample')) + this.afterSamplingFunc($r('app.media.pngSample')) } else if (value === 'AT_MOST') { this.imageKnifeOption =new ImageKnifeOption( { - loadSrc: $r('app.media.svgSample'), + loadSrc: $r('app.media.pngSample'), placeholderSrc: $r("app.media.loading"), errorholderSrc: $r("app.media.app_icon"), objectFit: ImageFit.Contain, downsampleOf: DownsampleStrategy.AT_MOST }) - this.originalPixMap($r('app.media.svgSample')) - this.afterSamplingFunc($r('app.media.svgSample')) + this.originalPixMap($r('app.media.pngSample')) + this.afterSamplingFunc($r('app.media.pngSample')) } else if (value === 'FIT_CENTER_MEMORY') { this.imageKnifeOption =new ImageKnifeOption( { loadSrc: $r('app.media.pngSample'), @@ -87,35 +87,35 @@ struct DownSamplePage { } else if (value === 'CENTER_INSIDE_MEMORY') { this.imageKnifeOption = new ImageKnifeOption({ - loadSrc: $r('app.media.jpgSample1'), + loadSrc: $r('app.media.pngSample'), placeholderSrc: $r("app.media.loading"), errorholderSrc: $r("app.media.app_icon"), objectFit: ImageFit.Contain, downsampleOf: DownsampleStrategy.CENTER_INSIDE_MEMORY }) - this.originalPixMap($r('app.media.jpgSample1')) - this.afterSamplingFunc($r('app.media.jpgSample1')) + this.originalPixMap($r('app.media.pngSample')) + this.afterSamplingFunc($r('app.media.pngSample')) } else if (value === 'CENTER_INSIDE_QUALITY') { this.imageKnifeOption = new ImageKnifeOption({ - loadSrc: $r('app.media.jpgSample1'), + loadSrc: $r('app.media.pngSample'), placeholderSrc: $r("app.media.loading"), errorholderSrc: $r("app.media.app_icon"), objectFit: ImageFit.Contain, downsampleOf: DownsampleStrategy.CENTER_INSIDE_QUALITY }) - this.originalPixMap($r('app.media.jpgSample1')) - this.afterSamplingFunc($r('app.media.jpgSample1')) + this.originalPixMap($r('app.media.pngSample')) + this.afterSamplingFunc($r('app.media.pngSample')) } else { this.imageKnifeOption = new ImageKnifeOption({ - loadSrc: $r('app.media.jpgSample2'), + loadSrc: $r('app.media.pngSample'), placeholderSrc: $r("app.media.loading"), errorholderSrc: $r("app.media.app_icon"), objectFit: ImageFit.Contain, downsampleOf: DownsampleStrategy.CENTER_OUTSIDE }) - this.originalPixMap($r('app.media.jpgSample2')) - this.afterSamplingFunc($r('app.media.jpgSample2')) + this.originalPixMap($r('app.media.pngSample')) + this.afterSamplingFunc($r('app.media.pngSample')) } } diff --git a/library/src/main/ets/ImageKnifeDispatcher.ets b/library/src/main/ets/ImageKnifeDispatcher.ets index 2fc5d4f..cd0e49f 100644 --- a/library/src/main/ets/ImageKnifeDispatcher.ets +++ b/library/src/main/ets/ImageKnifeDispatcher.ets @@ -656,11 +656,11 @@ async function requestJob(request: RequestJobRequest, requestList?: List { resPixelmap = pixelmap diff --git a/library/src/main/ets/ImageKnifeOption.ets b/library/src/main/ets/ImageKnifeOption.ets index 670180d..ec1586c 100644 --- a/library/src/main/ets/ImageKnifeOption.ets +++ b/library/src/main/ets/ImageKnifeOption.ets @@ -125,7 +125,7 @@ export class ImageKnifeOption { onComplete?:(event:EventImage | undefined) => void drawingColorFilter?: ColorFilter | drawing.ColorFilter // 下采样 - downsampleOf?: DownsampleStrategy = DownsampleStrategy.NONE + @Trace downsampleOf?: DownsampleStrategy = DownsampleStrategy.NONE constructor(option?:ImageOption) { this.loadSrc = option?.loadSrc == undefined ? "" : option?.loadSrc diff --git a/library/src/main/ets/components/ImageKnifeComponent.ets b/library/src/main/ets/components/ImageKnifeComponent.ets index 1232ba3..eacc634 100644 --- a/library/src/main/ets/components/ImageKnifeComponent.ets +++ b/library/src/main/ets/components/ImageKnifeComponent.ets @@ -38,7 +38,7 @@ export struct ImageKnifeComponent { @Param imageKnifeOption: ImageKnifeOption = new ImageKnifeOption(); @Monitor('imageKnifeOption', - "imageKnifeOption.loadSrc","imageKnifeOption.signature","imageKnifeOption.transformation","imageKnifeOption.border","imageKnifeOption.objectFit") + "imageKnifeOption.loadSrc","imageKnifeOption.signature","imageKnifeOption.transformation","imageKnifeOption.border","imageKnifeOption.objectFit",'imageKnifeOption.downsampleOf') watchImageKnifeOption() { this.clearLastRequest() this.componentVersion++ diff --git a/library/src/main/ets/downsampling/DownsampleStartegy.ets b/library/src/main/ets/downsampling/DownsampleStartegy.ets index 3de4efb..05a3610 100644 --- a/library/src/main/ets/downsampling/DownsampleStartegy.ets +++ b/library/src/main/ets/downsampling/DownsampleStartegy.ets @@ -20,9 +20,9 @@ export class FitCenter implements BaseDownsampling { return "FitCenter" } - getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy + getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy |undefined ): number { - if (downsampType===DownsampleStrategy.FIT_CENTER_QUALITY) { + if (downsampType===DownsampleStrategy.FIT_CENTER_MEMORY) { const widthPercentage = requestedWidth / sourceWidth const heightPercentage = requestedHeight / sourceHeight return Math.min(widthPercentage, heightPercentage) @@ -34,7 +34,7 @@ export class FitCenter implements BaseDownsampling { } //实现 getSampleSizeRounding 方法 - getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy|undefined ): number { if (downsampType===DownsampleStrategy.FIT_CENTER_QUALITY) { return SampleSizeRounding.QUALITY; @@ -82,7 +82,6 @@ export class CenterOutside implements BaseDownsampling { getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding { - //根据 CenterOutside 的逻辑，总是返回 QUALITY return SampleSizeRounding.QUALITY; } } @@ -122,7 +121,7 @@ export class CenterInside implements BaseDownsampling { return "CenterInside" } - getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy + getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy|undefined ): number { //获取 FIT_CENTER 的缩放因子 const fitCenterScaleFactor: ESObject = @@ -132,21 +131,20 @@ export class CenterInside implements BaseDownsampling { } - getScale(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy - ): number { - if (downsampType===DownsampleStrategy.FIT_CENTER_QUALITY) { + getScale(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy|undefined + ): number { + if (downsampType===DownsampleStrategy.FIT_CENTER_MEMORY) { const widthPercentage = requestedWidth / sourceWidth const heightPercentage = requestedHeight / sourceHeight return Math.min(widthPercentage, heightPercentage) } else { - //类似 AT_LEAST,但只要求一个维度或另一个维度大于等于请求的尺寸 const maxIntegerFactor = Math.max(sourceHeight / requestedHeight, sourceWidth / requestedWidth); - return maxIntegerFactor === 0 ? 1 : 1 / highestOneBit(maxIntegerFactor); - + const a = maxIntegerFactor === 0 ? 1 : 1 / highestOneBit(maxIntegerFactor) + return a; } } - getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy|undefined ): SampleSizeRounding { //如果缩放因子为 1，表示没有缩放，优先选择质量 if (this.getScaleFactor(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType) === 1) { @@ -156,12 +154,12 @@ export class CenterInside implements BaseDownsampling { return this.getSampleSize(sourceWidth, sourceHeight, requestedWidth, requestedHeight,downsampType); } - getSampleSize(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy + getSampleSize(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,downsampType:DownsampleStrategy|undefined ): SampleSizeRounding { - if (downsampType===DownsampleStrategy.CENTER_INSIDE_QUALITY) { - return SampleSizeRounding.QUALITY; - } else { + if (downsampType===DownsampleStrategy.CENTER_INSIDE_MEMORY) { return SampleSizeRounding.MEMORY; + } else { + return SampleSizeRounding.QUALITY; } } } diff --git a/library/src/main/ets/downsampling/Downsampler.ets b/library/src/main/ets/downsampling/Downsampler.ets index b83918f..c320404 100644 --- a/library/src/main/ets/downsampling/Downsampler.ets +++ b/library/src/main/ets/downsampling/Downsampler.ets @@ -30,118 +30,72 @@ export interface calculateScaleType { export class Downsampler { calculateScaling( typeValue: string | null, - sourceHeight: number, //原始宽高 + // TODO 宽高调整 sourceWidth: number | undefined, //原始宽高 - requestHeight: number, //请求宽高 + sourceHeight: number, //原始宽高 requestWidth: number, //请求宽高 + requestHeight: number, //请求宽高 downsampType: DownsampleStrategy | undefined, - ): calculateScaleType { - let degreesToRotate: ESObject = 90; const fileType = typeValue //获取图片类型 - let powerOfTwoWidth: number | null = null; - let powerOfTwoHeight: number | null = null; - let targetWidth: number = 0 - let targetHeight: number = 0 - + // TODO 命名修改 powerOfTwoWidth改为targetWidth + let targetWidth: number | null = null; + let targetHeight: number | null = null; if (sourceHeight <= 0 || sourceWidth == undefined || sourceWidth == null || sourceWidth <= 0) { - throw new Error("Cannot found width or height"); + throw new Error("Cannot found width or height"); // TODO catch } - let orientedSourceWidth = sourceWidth; - let orientedSourceHeight = sourceHeight; - if (this.isRotationRequired(degreesToRotate)) { - orientedSourceWidth = sourceHeight; - orientedSourceHeight = sourceWidth; - } - if (requestWidth && !requestHeight) { - targetWidth = this.round((requestHeight) * orientedSourceWidth / orientedSourceHeight) - } else if (requestHeight && !requestWidth) { - targetHeight = this.round((requestWidth) * orientedSourceHeight / orientedSourceWidth) - } else if (requestHeight && requestWidth) { - targetWidth = - requestHeight == sourceWidth ? (this.isRotationRequired(degreesToRotate) ? sourceHeight : sourceWidth) : - requestWidth; - targetHeight = - requestHeight == sourceHeight ? (this.isRotationRequired(degreesToRotate) ? sourceWidth : sourceHeight) : - requestWidth; - } else { - throw new Error("Cannot found width or height"); - } - let exactScaleFactor: number | undefined - let rounding: SampleSizeRounding | undefined - switch (downsampType) { - case DownsampleStrategy.FIT_CENTER_MEMORY || DownsampleStrategy.FIT_CENTER_QUALITY: - exactScaleFactor = new FitCenter() - .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight,downsampType) - rounding = new FitCenter() - .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight,downsampType) - break; - case DownsampleStrategy.NONE: - exactScaleFactor = new None() - .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - rounding = new None() - .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - break - case DownsampleStrategy.AT_MOST: - exactScaleFactor = new AtMost() - .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - rounding = new AtMost() - .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - break - case DownsampleStrategy.CENTER_INSIDE_MEMORY || DownsampleStrategy.CENTER_INSIDE_QUALITY: - exactScaleFactor = new CenterInside() - .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight,downsampType) - rounding = new CenterInside() - .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight,downsampType) - break - - case DownsampleStrategy.CENTER_OUTSIDE: - exactScaleFactor = new CenterOutside() - .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - rounding = new CenterOutside() - .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) - break + if(downsampType===undefined){ + throw new Error("Cannot found downsampType"); } + let downsampler = this.getDownsampler(downsampType); + let exactScaleFactor : number = downsampler.getScaleFactor(sourceWidth, sourceHeight, requestWidth, requestHeight, downsampType); + let rounding: SampleSizeRounding= downsampler.getSampleSizeRounding(sourceWidth, sourceHeight, requestWidth, requestHeight, downsampType); if (exactScaleFactor==undefined|| exactScaleFactor <= 0 ) { throw new Error("Cannot round with exactScaleFactor"); } - if (rounding == undefined) { - throw new Error("Cannot round with null rounding"); - } - let outWidth: number = this.round(exactScaleFactor * orientedSourceWidth); - let outHeight: number = this.round(exactScaleFactor * orientedSourceHeight); - let widthScaleFactor = orientedSourceWidth / outWidth; - let heightScaleFactor = orientedSourceHeight / outHeight; + let outWidth: number = this.round(exactScaleFactor * sourceWidth); + let outHeight: number = this.round(exactScaleFactor * sourceHeight); + let widthScaleFactor = sourceWidth / outWidth; + let heightScaleFactor = sourceHeight / outHeight; let scaleFactor = rounding ==SampleSizeRounding.QUALITY ? Math.max(widthScaleFactor, heightScaleFactor) : Math.min(widthScaleFactor, heightScaleFactor) //将整型的缩放因子转换为2的次幂采样大小 let powerOfTwoSampleSize: number = scaleFactor; powerOfTwoSampleSize = Math.max(1, highestOneBit(scaleFactor)) - if (rounding == 1 && (powerOfTwoSampleSize < (1 / exactScaleFactor))) { + if (rounding == 0 && (powerOfTwoSampleSize < (1 / exactScaleFactor))) { powerOfTwoSampleSize = powerOfTwoSampleSize << 1; } //基于上一步得出的采样大小，根据不同的图片类型，计算采样后的图片尺寸 if (fileType === "png") { - powerOfTwoWidth = Math.floor(orientedSourceWidth / powerOfTwoSampleSize); - powerOfTwoHeight = Math.floor(orientedSourceHeight / powerOfTwoSampleSize); + targetWidth = Math.floor(sourceWidth / powerOfTwoSampleSize); + targetHeight = Math.floor(sourceHeight / powerOfTwoSampleSize); } else if (fileType === "webp") { - powerOfTwoWidth = Math.round(orientedSourceWidth / powerOfTwoSampleSize); - powerOfTwoHeight = Math.round(orientedSourceHeight / powerOfTwoSampleSize); + targetWidth = Math.round(sourceWidth / powerOfTwoSampleSize); + targetHeight = Math.round(sourceHeight / powerOfTwoSampleSize); } else { - powerOfTwoWidth = orientedSourceWidth / powerOfTwoSampleSize; - powerOfTwoHeight = orientedSourceHeight / powerOfTwoSampleSize; + targetWidth = sourceWidth / powerOfTwoSampleSize; + targetHeight = sourceHeight / powerOfTwoSampleSize; + } + return { targetWidth, targetHeight } + } + getDownsampler(downsampType:DownsampleStrategy) { + switch (downsampType) { + case DownsampleStrategy.FIT_CENTER_MEMORY: + case DownsampleStrategy.FIT_CENTER_QUALITY: + return new FitCenter(); + case DownsampleStrategy.NONE: + return new None(); + case DownsampleStrategy.AT_MOST: + return new AtMost(); + case DownsampleStrategy.CENTER_INSIDE_MEMORY: + case DownsampleStrategy.CENTER_INSIDE_QUALITY: + return new CenterInside(); + case DownsampleStrategy.CENTER_OUTSIDE: + return new CenterOutside(); + default: + throw new Error('Unsupported downsampling strategy'); } - let a: calculateScaleType = { - "targetWidth": powerOfTwoWidth, - "targetHeight": powerOfTwoHeight - } - return a } - round(value: number): number { return Math.floor(value + 0.5); } - - isRotationRequired(degreesToRotate: number): boolean { - return degreesToRotate == 90 || degreesToRotate == 270; - } }