Compare commits

..

No commits in common. "b0e0f970228d4850b694335d084253551e8cde27" and "c9957c458fdf09980c5ac1b691235cd7e1c00a94" have entirely different histories.

7 changed files with 163 additions and 81 deletions

View File

@ -126,8 +126,6 @@ struct DownSamplePage {
desiredPixelFormat: 3, desiredPixelFormat: 3,
} }
let imageInfo = await imageSource.getImageInfo() let imageInfo = await imageSource.getImageInfo()
if (this.imageKnifeOption.downsampleOf !== DownsampleStrategy.NONE){
let reqSize = let reqSize =
new Downsampler().calculateScaling(typeValue, imageInfo.size.width, imageInfo.size.height, 300, new Downsampler().calculateScaling(typeValue, imageInfo.size.width, imageInfo.size.height, 300,
300, this.imageKnifeOption.downsampleOf) 300, this.imageKnifeOption.downsampleOf)
@ -138,8 +136,6 @@ struct DownSamplePage {
height: reqSize.height height: reqSize.height
} }
} }
}
// 创建pixelMap // 创建pixelMap
imageSource.createPixelMap(decodingOptions).then((pixelMap: image.PixelMap) => { imageSource.createPixelMap(decodingOptions).then((pixelMap: image.PixelMap) => {
this.afterSampling = pixelMap.getPixelBytesNumber() this.afterSampling = pixelMap.getPixelBytesNumber()

View File

@ -40,9 +40,19 @@ struct Index {
uri: 'pages/TestCommonImage', uri: 'pages/TestCommonImage',
}); });
}) })
Button(this.getResourceString($r('app.string.Multiple_images')) + " + reuse + LazyForeach").margin({top:10}).onClick(()=>{ Button($r('app.string.Image_Downsampling_Functionality')).margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/UserPage', uri: 'pages/DownSamplePage',
});
})
Button($r('app.string.Test_Task_error')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TestTaskResourcePage',
});
})
Button($r('app.string.Test_HSP')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TestHspPreLoadImage',
}); });
}) })
@ -52,9 +62,22 @@ struct Index {
}); });
}) })
Button($r('app.string.Image_Downsampling_Functionality')).margin({top:10}).onClick(()=>{ Button($r('app.string.Test_custom_download')).margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/DownSamplePage', uri: 'pages/TestSetCustomImagePage',
});
})
Button(this.getResourceString($r('app.string.Multiple_images')) + " + LazyForEach").margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/ManyPhotoShowPage',
});
})
Button(this.getResourceString($r('app.string.Multiple_images')) + " + reuse + LazyForeach").margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/UserPage',
}); });
}) })
Button($r('app.string.Display_long_image')).margin({top:10}).onClick(()=>{ Button($r('app.string.Display_long_image')).margin({top:10}).onClick(()=>{
@ -63,25 +86,17 @@ struct Index {
}); });
}) })
Button($r('app.string.Image_Transformation')).margin({top:10}).onClick(()=>{ Button($r('app.string.Image_scaling')).margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/ImageTransformation', uri: 'pages/TransformPage',
});
})
Button($r('app.string.Test_media_URL')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/dataShareUriLoadPage',
}); });
}) })
Button($r('app.string.Different_ObjectFit')).margin({top:10}).onClick(()=>{ Button(this.getResourceString($r('app.string.Message_list')) + " + List").margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/ObjectFitPage', uri: 'pages/TestImageFlash',
}); });
}) })
Button($r('app.string.Custom_cache_key')).margin({top:10}).onClick(()=>{ Button($r('app.string.Custom_cache_key')).margin({top:10}).onClick(()=>{
router.push({ router.push({
@ -89,39 +104,6 @@ struct Index {
}); });
}) })
Button($r('app.string.Test_image_loading_success_or_failure_events')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/LoadStatePage',
})
})
Button($r('app.string.Image_scaling')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TransformPage',
});
})
Button($r('app.string.Test_HSP')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TestHspPreLoadImage',
});
})
Button($r('app.string.Test_custom_download')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TestSetCustomImagePage',
});
})
Button(this.getResourceString($r('app.string.Message_list')) + " + List").margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/TestImageFlash',
});
})
Button($r('app.string.Preloading_images_to_cache')).margin({top:10}).onClick(()=>{ Button($r('app.string.Preloading_images_to_cache')).margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/TestPrefetchToFileCache', uri: 'pages/TestPrefetchToFileCache',
@ -146,7 +128,27 @@ struct Index {
}); });
}) })
Button($r('app.string.Image_Transformation')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/ImageTransformation',
});
})
Button($r('app.string.Different_ObjectFit')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/ObjectFitPage',
});
})
Button($r('app.string.Test_image_loading_success_or_failure_events')).margin({top:10}).onClick(()=>{
router.push({
uri: 'pages/LoadStatePage',
})
})
Button($r('app.string.Test_removing_image_cache_interface')).margin({top:10}).onClick(()=>{ Button($r('app.string.Test_removing_image_cache_interface')).margin({top:10}).onClick(()=>{
router.push({ router.push({
@ -159,11 +161,13 @@ struct Index {
}); });
}) })
Button($r('app.string.Test_Task_error')).margin({top:10}).onClick(()=>{ Button($r('app.string.Test_media_URL')).margin({top:10}).onClick(()=>{
router.push({ router.push({
uri: 'pages/TestTaskResourcePage', uri: 'pages/dataShareUriLoadPage',
}); });
}) })
} }
} .width('100%') } .width('100%')
.height('100%') .height('100%')

View File

@ -389,27 +389,27 @@ export class ImageKnifeLoader {
} }
static downsamplerReqSize(typeValue: string, request: RequestJobRequest, size: Size, static downsamplerReqSize(typeValue: string, request: RequestJobRequest, size: Size,
SRC?: ImageKnifeRequestSource):image.DecodingOptions { SRC?: ImageKnifeRequestSource) {
let reqSize = let reqSize =
new Downsampler().calculateScaling(typeValue, size.width, size.height, request.targetWidth, request.targetHeight, new Downsampler().calculateScaling(typeValue, size.width, size.height, request.targetWidth, request.targetHeight,
request.downsampType) request.downsampType)
if (typeValue == "svg") { if (typeValue == "svg") {
return { return ({
editable: true, editable: true,
desiredSize: { desiredSize: ({
height: vp2px(reqSize.height), height: vp2px(reqSize.height),
width: vp2px(reqSize.width) width: vp2px(reqSize.width)
} } as Size)
} } as image.DecodingOptions)
} else { } else {
return { return ({
editable: request.requestSource === SRC && request.transformation !== undefined ? true : false, editable: request.requestSource === SRC && request.transformation !== undefined ? true : false,
desiredSize:{ desiredSize: ({
width: reqSize.width, width: reqSize.width,
height: reqSize.height height: reqSize.height
} } as Size)
} } as image.DecodingOptions)
} }
} }
} }

View File

@ -20,4 +20,7 @@ export interface BaseDownsampling {
getName(): string getName(): string
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number,downsampType?:DownsampleStrategy): number getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number,downsampType?:DownsampleStrategy): number
//
getSampleSizeType(sourceWidth: number, sourceHeight: number, requestWidth: number,
requestHeight: number,downsampType?:DownsampleStrategy): SampleSizeRounding
} }

View File

@ -28,16 +28,50 @@ export class FitCenter implements BaseDownsampling {
width: round(getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType) * sourceWidth), width: round(getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType) * sourceWidth),
height:round(getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType) * sourceHeight) height:round(getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType) * sourceHeight)
} }
let scaleFactor = downsampType === DownsampleStrategy.FIT_CENTER_QUALITY? let scaleFactor = this.getSampleSizeType(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)===
Math.max(1, highestOneBit(Math.max(sourceWidth / outSize.width, sourceHeight / outSize.height))) : SampleSizeRounding.QUALITY? Math.max(1, highestOneBit(Math.max(sourceWidth / outSize.width, sourceHeight / outSize.height))) :
Math.max(1, highestOneBit(Math.min(sourceWidth / outSize.width, sourceHeight / outSize.height)))//将整型的缩放因子转换为2的次幂采样大小 Math.max(1, highestOneBit(Math.min(sourceWidth / outSize.width, sourceHeight / outSize.height)))//将整型的缩放因子转换为2的次幂采样大小
if (downsampType === DownsampleStrategy.FIT_CENTER_MEMORY if (this.getSampleSizeType(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)===
&& (scaleFactor < (1 / getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)))) { SampleSizeRounding.MEMORY && (scaleFactor < (1 / getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)))) {
scaleFactor = scaleFactor << 1; scaleFactor = scaleFactor << 1;
} }
return scaleFactor return scaleFactor
} }
getSampleSizeType(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,
downsampType: DownsampleStrategy
): number {
if (downsampType === DownsampleStrategy.FIT_CENTER_QUALITY) {
return SampleSizeRounding.QUALITY;
} else {
return SampleSizeRounding.MEMORY;
}
}
}
export class None implements BaseDownsampling {
getName(): string {
return "DownsampleNone"
}
public getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number,
requestedHeight: number): number {
let outSize: Size = {
width: round(sourceWidth),
height:round(sourceHeight)
}
let scaleFactor =
Math.max(1, highestOneBit(Math.max(sourceWidth / outSize.width, sourceHeight / outSize.height)))
return scaleFactor
}
//实现 getSampleSizeType 方法
public getSampleSizeType(sourceWidth: number, sourceHeight: number, requestedWidth: number,
requestedHeight: number): SampleSizeRounding {
return SampleSizeRounding.QUALITY
}
} }
@ -61,6 +95,11 @@ export class CenterOutside implements BaseDownsampling {
return scaleFactor return scaleFactor
} }
getSampleSizeType(sourceWidth: number, sourceHeight: number, requestedWidth: number,
requestedHeight: number): SampleSizeRounding {
return SampleSizeRounding.QUALITY;
}
} }
/*请求尺寸大于实际尺寸不进行放大,按照原图展示*/ /*请求尺寸大于实际尺寸不进行放大,按照原图展示*/
@ -79,7 +118,7 @@ export class AtMost implements BaseDownsampling {
greaterOrEqualSampleSize = lesserOrEqualSampleSize <<= 1; greaterOrEqualSampleSize = lesserOrEqualSampleSize <<= 1;
} }
greaterOrEqualSampleSize = lesserOrEqualSampleSize << (lesserOrEqualSampleSize < maxIntegerFactor ? 1 : 0) greaterOrEqualSampleSize = lesserOrEqualSampleSize << (lesserOrEqualSampleSize < maxIntegerFactor ? 1 : 0)
//返回缩放因子
let outSize: Size = { let outSize: Size = {
width: round((1 / greaterOrEqualSampleSize) * sourceWidth), width: round((1 / greaterOrEqualSampleSize) * sourceWidth),
height:round((1 / greaterOrEqualSampleSize) * sourceHeight) height:round((1 / greaterOrEqualSampleSize) * sourceHeight)
@ -90,6 +129,13 @@ export class AtMost implements BaseDownsampling {
} }
return scaleFactor return scaleFactor
} }
getSampleSizeType(sourceWidth: number, sourceHeight: number, requestedWidth: number,
requestHeight: number): SampleSizeRounding {
//根据 AtMost 的逻辑,总是返回 MEMORY
return SampleSizeRounding.MEMORY
}
} }
/*宽高进行等比缩放宽高里面最大的比例先放进去 /*宽高进行等比缩放宽高里面最大的比例先放进去
@ -101,6 +147,7 @@ export class CenterInside implements BaseDownsampling {
getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number, getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,
downsampType: DownsampleStrategy downsampType: DownsampleStrategy
): number { ): number {
let outSize: Size = { let outSize: Size = {
width: round(Math.min(1, getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)) * sourceWidth), width: round(Math.min(1, getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)) * sourceWidth),
height:round(Math.min(1, getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)) * sourceHeight) height:round(Math.min(1, getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType)) * sourceHeight)
@ -126,7 +173,17 @@ export class CenterInside implements BaseDownsampling {
return SampleSizeRounding.QUALITY return SampleSizeRounding.QUALITY
} }
//否则,使用 FIL_CENTER 的 SampleSizeRounding 值 //否则,使用 FIL_CENTER 的 SampleSizeRounding 值
return downsampType === DownsampleStrategy.CENTER_INSIDE_MEMORY?SampleSizeRounding.MEMORY:SampleSizeRounding.QUALITY return this.getSampleSize(sourceWidth, sourceHeight, requestedWidth, requestedHeight, downsampType);
}
getSampleSize(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number,
downsampType: DownsampleStrategy
): SampleSizeRounding {
if (downsampType === DownsampleStrategy.CENTER_INSIDE_MEMORY) {
return SampleSizeRounding.MEMORY;
} else {
return SampleSizeRounding.QUALITY;
}
} }
} }

View File

@ -28,7 +28,7 @@ export enum SampleSizeRounding {
//(质量优先) //(质量优先)
QUALITY QUALITY
} }
//找出给定整数 i 中最高位的1即最左边的1所代表的值
export function highestOneBit(i: number): number { export function highestOneBit(i: number): number {
i |= (i >> 1); i |= (i >> 1);
i |= (i >> 2); i |= (i >> 2);
@ -52,7 +52,6 @@ export function getScale(sourceWidth: number, sourceHeight: number, requestedWid
} }
} }
//四舍五入
export function round(value: number): number { export function round(value: number): number {
return Math.floor(value + 0.5); return Math.floor(value + 0.5);
} }

View File

@ -18,7 +18,11 @@ import {
CenterOutside, CenterOutside,
DownsampleStrategy, DownsampleStrategy,
FitCenter, FitCenter,
None,
} from './DownsampleStartegy'; } from './DownsampleStartegy';
import { highestOneBit, round, SampleSizeRounding } from './DownsampleUtils';
export class Downsampler { export class Downsampler {
calculateScaling( calculateScaling(
typeValue: string, typeValue: string,
@ -35,6 +39,22 @@ export class Downsampler {
let downsampler = this.getDownsampler(downsampType); let downsampler = this.getDownsampler(downsampType);
let scaleFactor: number = let scaleFactor: number =
downsampler.getScaleFactor(sourceWidth, sourceHeight, requestWidth, requestHeight, downsampType);//缩放比 downsampler.getScaleFactor(sourceWidth, sourceHeight, requestWidth, requestHeight, downsampType);//缩放比
// let rounding: SampleSizeRounding =
// downsampler.getSampleSizeType(sourceWidth, sourceHeight, requestWidth, requestHeight, downsampType); //采样类型
//根据缩放比重新计算宽高
// let outSize: Size = {
// width: round(exactScaleFactor * sourceWidth),
// height:round(exactScaleFactor * sourceHeight)
// }
// let scaleFactor =
// rounding == SampleSizeRounding.QUALITY ? Math.max(sourceWidth / exactScaleFactor.width, sourceHeight / exactScaleFactor.height) :
// Math.min(sourceWidth / exactScaleFactor.width, sourceHeight / exactScaleFactor.height) //重新计算宽高比
// scaleFactor = Math.max(1, highestOneBit(scaleFactor))//将整型的缩放因子转换为2的次幂采样大小
//
// if (rounding == 0 && (scaleFactor < (1 / exactScaleFactor))) {
// scaleFactor = scaleFactor << 1;
// }
//基于上一步得出的采样大小,根据不同的图片类型,计算采样后的图片尺寸 //基于上一步得出的采样大小,根据不同的图片类型,计算采样后的图片尺寸
if (typeValue === "png") { if (typeValue === "png") {
return { return {
@ -54,11 +74,14 @@ export class Downsampler {
} }
} }
} }
getDownsampler(downsampType: DownsampleStrategy) { getDownsampler(downsampType: DownsampleStrategy) {
switch (downsampType) { switch (downsampType) {
case DownsampleStrategy.FIT_CENTER_MEMORY: case DownsampleStrategy.FIT_CENTER_MEMORY:
case DownsampleStrategy.FIT_CENTER_QUALITY: case DownsampleStrategy.FIT_CENTER_QUALITY:
return new FitCenter(); return new FitCenter();
case DownsampleStrategy.NONE:
return new None();
case DownsampleStrategy.AT_MOST: case DownsampleStrategy.AT_MOST:
return new AtMost(); return new AtMost();
case DownsampleStrategy.CENTER_INSIDE_MEMORY: case DownsampleStrategy.CENTER_INSIDE_MEMORY: