降采样适配

Signed-off-by: tsm <2418639820@qq.com>
This commit is contained in:
tsm 2024-05-22 15:25:31 +08:00
parent 6d43923279
commit 68fbe7ef51
10 changed files with 376 additions and 330 deletions

View File

@ -1,116 +1,89 @@
/*
* Copyright (C) 2024 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 {
FitCenter,
ImageKnifeComponent,
import { FitCenter, ImageKnifeComponent,
ImageKnifeData,
ImageKnifeGlobal,
ImageKnifeOption,
RequestOption
} from '@ohos/libraryimageknife'
RequestOption } from '@ohos/libraryimageknife'
import { BusinessError } from '@ohos.base'
import { fitter, sampleNone } from '@ohos/imageknife';
let pngUrl = $r('app.media.pngSample');
let jpgUrl = $r('app.media.jpgSample');
let svgUrl = $r('app.media.svgSample');
let gifUrl = $r('app.media.gifSample');
let bmpUrl = $r('app.media.bmpSample');
let webpUrl = $r('app.media.webpSample');
let imageKnife = ImageKnifeGlobal.getInstance().getImageKnife();
let ImageKnife = ImageKnifeGlobal.getInstance().getImageKnife();
@Entry
@Component
struct Index {
@State originalMSquarePixelMap?: PixelMap = undefined;
@State mSquarePixelMap?: PixelMap = undefined;
@State h: number = 0
@State w: number = 0
@State originalBytesNumber: number = 0
@State bytesNumber: number = 0
@State url: string = ''
@State network: Boolean = false
@State imageKnifeOption: ImageKnifeOption = {
@State mSquarePixelMap1?: PixelMap = undefined;
@State mSquarePixelMap2?: PixelMap = undefined;
@State h:number = 0
@State w:number = 0
@State BytesNumber1:number = 0
@State BytesNumber2:number = 0
@State url:string = ''
@State network:Boolean = false
@State ImageKnifeOption1: ImageKnifeOption = {
loadSrc: $r('app.media.icon'),
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed')
}
transformSquare1(mUrl: string|Resource|PixelMap) {
let imageKnifeOption: RequestOption = new RequestOption();
transformSquare1(mUrl:ESObject) {
let imageKnifeOption:RequestOption = new RequestOption();
imageKnifeOption.load(mUrl)
.addListener({
callback: (err: BusinessError | string, data: ImageKnifeData) => {
this.originalMSquarePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
this.originalBytesNumber = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber()
return false;
}
})
imageKnife?.call(imageKnifeOption);
.addListener({ callback: (err: BusinessError | string, data: ImageKnifeData) => {
this.mSquarePixelMap1 = data.drawPixelMap?.imagePixelMap as PixelMap;
this.BytesNumber1 = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber()
return false;
} })
ImageKnife?.call(imageKnifeOption);
}
transformSquare2(mUrl: string|Resource|PixelMap) {
let imageKnifeOption: RequestOption = new RequestOption();
transformSquare2(mUrl:ESObject) {
let imageKnifeOption:RequestOption = new RequestOption();
let a = new fitter()
imageKnifeOption.load(mUrl)
.addListener({
callback: (err: BusinessError | string, data: ImageKnifeData) => {
this.mSquarePixelMap = data.drawPixelMap?.imagePixelMap as PixelMap;
this.bytesNumber = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber()
return false;
}
})
.setImageViewSize({ width: this.w, height: this.h })
.addListener({ callback: (err: BusinessError | string, data: ImageKnifeData) => {
this.mSquarePixelMap2 = data.drawPixelMap?.imagePixelMap as PixelMap;
this.BytesNumber2 = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber()
return false;
} })
.setImageViewSize({ width: this.w, height:this.h})
.downsampleOf(a)
imageKnife?.call(imageKnifeOption);
ImageKnife?.call(imageKnifeOption);
}
@Builder
TextInputSample() {
Flex() {
TextInput({ placeholder: '输入宽' })
.onChange((enterKeyType) => {
this.w = Number(enterKeyType)
.onChange((EnterKeyType)=>{
this.w =Number(EnterKeyType)
})
TextInput({ placeholder: '输入高' })
.onChange((enterKeyType) => {
this.h = Number(enterKeyType)
.onChange((EnterKeyType)=>{
this.h =Number(EnterKeyType)
})
}.padding(20)
}
build() {
Scroll() {
Scroll(){
Column() {
Row() {
Row(){
Button('切换网络图片')
.onClick(() => {
this.network = !this.network
.onClick(()=>{
this.network = !this.network
})
Text('输入网络图片url')
TextInput({ placeholder: '输入url' })
.onChange((urls) => {
this.url = urls
.onChange((urls)=>{
this.url =urls
})
}
if (this.network) {
Column() {
if(this.network){
Column(){
Text('原图')
Flex() {
Flex(){
Button('png')
.onClick(() => {
this.transformSquare1(this.url);
@ -141,12 +114,11 @@ struct Index {
this.transformSquare1(this.url);
});
}.margin({ top: 20, bottom: 20 })
Text("原图字节大小:" + this.originalBytesNumber)
Column() {
if (this.originalMSquarePixelMap) {
Image(this.originalMSquarePixelMap == undefined ? '' : this.originalMSquarePixelMap!)
}.margin({top:20,bottom:20})
Text("原图字节大小:"+this.BytesNumber1)
Column(){
if (this.mSquarePixelMap1) {
Image(this.mSquarePixelMap1 == undefined ? '' : this.mSquarePixelMap1!)
.objectFit(ImageFit.Fill)
.width(200)
.height(200)
@ -155,90 +127,82 @@ struct Index {
Text('component用法')
}.height(300).width('100%').backgroundColor(Color.Pink)
Text('降采样图片')
Flex() {
Flex(){
Button('png')
.onClick(() => {
this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: pngUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
Button('svg')
.onClick(() => {
this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: svgUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
Button('bmp')
.onClick(() => {
this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: bmpUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
Button('jpg')
.onClick(() => {
this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: jpgUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
Button('gif')
.onClick(() => {
// this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: gifUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
Button('webp')
.onClick(() => {
// this.transformSquare2(this.url);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: webpUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
downsampling: new fitter()
}
});
}.margin({ top: 20, bottom: 20 })
Text("降采样字节大小:" + this.bytesNumber)
}.margin({top:20,bottom:20})
Text("降采样字节大小:"+this.BytesNumber2)
this.TextInputSample()
Column() {
if (this.mSquarePixelMap) {
Image(this.mSquarePixelMap == undefined ? '' : this.mSquarePixelMap!)
Column(){
if (this.mSquarePixelMap2) {
Image(this.mSquarePixelMap2 == undefined ? '' : this.mSquarePixelMap2!)
.objectFit(ImageFit.Fill)
.width(200)
.height(200)
.margin({ top: 10 })
}
Text('component用法')
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption }).width(200).height(200)
ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption1 }).width(200).height(200)
}.height(300).width('100%').backgroundColor(Color.Pink)
}.backgroundColor(Color.Orange)
} else {
Column() {
}else {
Column(){
Text('原图')
Flex() {
Flex(){
Button('png')
.onClick(() => {
this.transformSquare1(pngUrl);
@ -269,12 +233,11 @@ struct Index {
this.transformSquare1(webpUrl);
});
}.margin({ top: 20, bottom: 20 })
Text("原图字节大小:" + this.originalBytesNumber)
Column() {
if (this.originalMSquarePixelMap) {
Image(this.originalMSquarePixelMap == undefined ? '' : this.originalMSquarePixelMap!)
}.margin({top:20,bottom:20})
Text("原图字节大小:"+this.BytesNumber1)
Column(){
if (this.mSquarePixelMap1) {
Image(this.mSquarePixelMap1 == undefined ? '' : this.mSquarePixelMap1!)
.objectFit(ImageFit.Fill)
.width(200)
.height(200)
@ -283,13 +246,12 @@ struct Index {
Text('component用法')
}.height(300).width('100%').backgroundColor(Color.Pink)
Text('降采样图片')
Flex() {
Flex(){
Button('png')
.onClick(() => {
this.transformSquare2(pngUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: pngUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
@ -298,7 +260,7 @@ struct Index {
Button('svg')
.onClick(() => {
this.transformSquare2(svgUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: svgUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
@ -308,7 +270,7 @@ struct Index {
Button('bmp')
.onClick(() => {
this.transformSquare2(bmpUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: bmpUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
@ -317,7 +279,7 @@ struct Index {
Button('jpg')
.onClick(() => {
this.transformSquare2(jpgUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: jpgUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
@ -326,7 +288,7 @@ struct Index {
Button('gif')
.onClick(() => {
// this.transformSquare2(gifUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: gifUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
@ -335,29 +297,30 @@ struct Index {
Button('webp')
.onClick(() => {
// this.transformSquare2(webpUrl);
this.imageKnifeOption = {
this.ImageKnifeOption1 = {
loadSrc: webpUrl,
placeholderSrc: $r('app.media.icon_loading'),
errorholderSrc: $r('app.media.icon_failed'),
}
});
}.margin({ top: 20, bottom: 20 })
Text("降采样字节大小:" + this.bytesNumber)
}.margin({top:20,bottom:20})
Text("降采样字节大小:"+this.BytesNumber2)
this.TextInputSample()
Column() {
if (this.mSquarePixelMap) {
Image(this.mSquarePixelMap == undefined ? '' : this.mSquarePixelMap!)
Column(){
if (this.mSquarePixelMap2) {
Image(this.mSquarePixelMap2 == undefined ? '' : this.mSquarePixelMap2!)
.objectFit(ImageFit.Fill)
.width(200)
.height(200)
.margin({ top: 10 })
}
Text('component用法')
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption }).width(200).height(200)
ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption1 }).width(200).height(200)
}.height(300).width('100%').backgroundColor(Color.Pink)
}
}
}
}
.height('100%')

View File

@ -69,3 +69,5 @@ function makeRequest(src: string, context: common.UIAbilityContext, priority: ta
request.moduleContext = context;
return request;
}

View File

@ -135,4 +135,12 @@ export { LogUtil } from './src/main/ets/components/imageknife/utils/LogUtil'
/*下采样*/
export {Downsampler} from './src/main/ets/components/imageknife/downsampling/Downsampler'
export {DownsampleNone as sampleNone, FitCenter as fitter} from './src/main/ets/components/imageknife/downsampling/DownsampleStartegy'
export {
DownsampleNone as sampleNone,
FitCenter as fitter,
CenterOutside,
Atleast,
AtMost,
CenterInside as Center_Inside
} from './src/main/ets/components/imageknife/downsampling/DownsampleStartegy'

View File

@ -1,18 +1,3 @@
/*
* Copyright (C) 2024 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 { lang } from '@kit.ArkTS';
type ISendable = lang.ISendable;

View File

@ -12,138 +12,205 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { BaseDownsampling } from './BaseDownsampling'
@Sendable
export class CenterInside {
getName() {
return "CenterInside"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
return Math.min(1, this.getScale(sourceWidth, sourceHeight, requestWidth, requestHeight))
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
}
getScale(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
let widthPercentage = requestWidth / sourceWidth
let heightPercentage = requestHeight / sourceHeight
return Math.min(widthPercentage, heightPercentage)
}
}
/*不进行下采样*/
@Sendable
export class DownsampleNone implements BaseDownsampling {
getName() {
return "DownsampleNone"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
}
}
/* 下采样使得图像的组大尺寸在给定的尺寸的1/2之间*/
@Sendable
export class AtMost implements BaseDownsampling {
getName() {
return "AtMost"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
let maxIntegerFactor = Math.ceil(Math.max(sourceHeight / requestHeight, sourceWidth / requestWidth));
let lesserOrEqualSampleSize = Math.max(1, this.highestOneBit(maxIntegerFactor))
let greaterOrEqualSampleSize = lesserOrEqualSampleSize << (lesserOrEqualSampleSize < maxIntegerFactor ? 1 : 0)
return 1 / greaterOrEqualSampleSize
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
return 0
}
highestOneBit(i: number): number {
i |= (i >> 1);
i |= (i >> 2);
i |= (i >> 4);
i |= (i >> 8);
i |= (i >> 16);
return i - (i >>> 1);
}
}
@Sendable
export class Atleast implements BaseDownsampling {
getName() {
return "Atleast"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
let minIntegerFactor = Math.floor(Math.min(sourceHeight / requestHeight, sourceWidth / requestWidth))
return minIntegerFactor == 0 ? 1 : 1 / this.highestOneBit(minIntegerFactor)
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
}
highestOneBit(i: number): number {
i |= (i >> 1);
i |= (i >> 2);
i |= (i >> 4);
i |= (i >> 8);
i |= (i >> 16);
return i - (i >>> 1);
}
}
@Sendable
export class CenterOutside implements BaseDownsampling {
getName() {
return "CenterOutside"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
let widthPercentage = requestWidth / sourceWidth
let heightPercentage = requestHeight / sourceHeight
return Math.max(widthPercentage, heightPercentage)
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
}
}
import { BaseDownsampling } from './BaseDownsampling';
import { highestOneBit, SampleSizeRounding } from './downsampleUtils';
//FitCenter类实现DownsampleStartegy
@Sendable
export class FitCenter implements BaseDownsampling {
getName() {
return "FitCenter"
}
getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
let widthPercentage = requestWidth / sourceWidth
let heightPercentage = requestHeight / sourceHeight
return Math.min(widthPercentage, heightPercentage)
//实现 getScaleFactor 方法
getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
const IS_BITMAP_FACTORY_SCALING_SUPPORTED = false; //这里需要根据实际情况设置这个值
if (IS_BITMAP_FACTORY_SCALING_SUPPORTED) {
const widthPercentage = requestedWidth / sourceWidth
const heightPercentage = requestedHeight / sourceHeight
return Math.min(widthPercentage, heightPercentage)
} else {
//类似 AT_LEAST,但只要求一个维度或另一个维度大于等于请求的尺寸
const maxIntegerFactor = Math.max(sourceHeight / requestedHeight, sourceWidth / requestedWidth);
const a = maxIntegerFactor === 0 ? 1 : 1 / highestOneBit(maxIntegerFactor)
return a;
}
}
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number {
//下采样因子
return 1
//实现 getSampleSizeRounding 方法
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
const IS_BITMAP_FACTORY_SCALING_SUPPORTED = true; //这里需要根据实际情况设置这个值
// if (!IS_BITMAP_FACTORY_SCALING_SUPPORTED) {
// return 0;
// } else {
// TODO: 这个逻辑可能不正确,但是如果不这样做,我们可能会跳过一个采样尺寸,因为 QUALITY 更喜欢宽度和高度缩放因子中比较小的那个
// MEMORY 折中方案,他让我们更喜欢两者中较大的那个
//
// }
return SampleSizeRounding.MEMORY;
}
}
export enum SampleSizeRounding {
MEMORY,
QUALITY
//None 类实现 DownsampleStrategy 接口
@Sendable
export class DownsampleNone implements BaseDownsampling {
getName(): string {
return "DownsampleNone"
}
//实现 getScaleFactor 方法
public getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
//不进行任何下采样,缩放因子为 1
return 1;
}
//实现 getSampleSizeRounding 方法
public getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
//总是返回 QUALITY
return SampleSizeRounding.QUALITY
}
}
/*宽高进行等比缩放宽高里面最小的比例先放进去然后再更据原图的缩放比去适配另一边*/
@Sendable
export class CenterOutside implements BaseDownsampling {
getName() {
return "CenterOutside"
}
//实现 getScaleFactor 方法
getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
const widthPercentage = requestedWidth / sourceWidth;
const heightPercentage = requestedHeight / sourceHeight;
//返回宽度和高度比例中最大的值
return Math.max(widthPercentage, heightPercentage);
}
//实现 getSampleSizeRounding 方法
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
//根据 CenterOutside 的逻辑,总是返回 QUALITY
return SampleSizeRounding.QUALITY;
}
}
/*请求尺寸大于实际尺寸不进行放大,按照原图展示*/
@Sendable
export class Atleast implements BaseDownsampling {
getName() {
return "AtLeast"
}
//实现 getScaleFactor 方法
public getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
//计算最小整数因子
const minIntegerFactor = Math.min(sourceHeight / requestedHeight, sourceWidth / requestedWidth)
//根据最小整数因子计算缩放因子
return minIntegerFactor === 0 ? 1 : 1 / highestOneBit(minIntegerFactor);
}
//实现 getSampleSizeRounding 方法
public getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
//总是返回 QUALITY
return SampleSizeRounding.QUALITY
}
}
/*请求尺寸大于实际尺寸不进行放大,按照原图展示*/
@Sendable
export class AtMost implements BaseDownsampling {
getName() {
return "AtMost"
}
//实现 getScaleFactor 方法
getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
const maxIntegerFactor = Math.ceil(Math.max(sourceHeight / requestedHeight, sourceWidth / requestedWidth));
let lesserOrEqualSampleSize = Math.max(1, highestOneBit(maxIntegerFactor));
let greaterOrEqualSampleSize = lesserOrEqualSampleSize
// if (lesserOrEqualSampleSize < maxIntegerFactor) {
// let greaterOrEqualSampleSize = lesserOrEqualSampleSize <<= 1; // lest shift by 1
// }
greaterOrEqualSampleSize = lesserOrEqualSampleSize << (lesserOrEqualSampleSize < maxIntegerFactor ? 1 : 0)
//返回缩放因子
return 1 / greaterOrEqualSampleSize
}
//实现 getSampleSizeRounding 方法
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestHeight: number): SampleSizeRounding {
//根据 AtMost 的逻辑,总是返回 MEMORY
return SampleSizeRounding.MEMORY
}
}
/*宽高进行等比缩放宽高里面最大的比例先放进去然后再更据原图的缩放比去适配另一边*/
@Sendable
export class CenterInside implements BaseDownsampling {
getName() {
return "CenterInside"
}
//实现 getScaleFactor 方法
getScaleFactor(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
//获取 FIT_CENTER 的缩放因子
const fitCenterScaleFactor: ESObject = this.getScale(sourceWidth, sourceHeight, requestedWidth, requestedHeight);
//实现 getScaleFactor 方法
//返回不超过 1 的缩放因子,即尽量缩小图像以适应目标尺寸,但不会放大
return Math.min(1, fitCenterScaleFactor);
}
getScale(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): number {
const IS_BITMAP_FACTORY_SCALING_SUPPORTED = false; //这里需要根据实际情况设置这个值
if (IS_BITMAP_FACTORY_SCALING_SUPPORTED) {
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);
}
}
//实现 getSampleSizeRounding 方法
getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
//如果缩放因子为 1表示没有缩放优先选择质量
if (this.getScaleFactor(sourceWidth, sourceHeight, requestedWidth, requestedHeight) === 1) {
return SampleSizeRounding.QUALITY
}
//否则,使用 FIL_CENTER 的 SampleSizeRounding 值
return this.getSampleSize(sourceWidth, sourceHeight, requestedWidth, requestedHeight);
}
//实现 getSampleSizeRounding 方法
getSampleSize(sourceWidth: number, sourceHeight: number, requestedWidth: number, requestedHeight: number): SampleSizeRounding {
const IS_BITMAP_FACTORY_SCALING_SUPPORTED = true; //这里需要根据实际情况设置这个值
if (IS_BITMAP_FACTORY_SCALING_SUPPORTED) {
return 0;
} else {
// TODO: 这个逻辑可能不正确,但是如果不这样做,我们可能会跳过一个采样尺寸,因为 QUALITY 更喜欢宽度和高度缩放因子中比较小的那个
// MEMORY 折中方案,他让我们更喜欢两者中较大的那个
//
// }
return SampleSizeRounding.MEMORY;
}
}
}
export enum DownsampleStrategy {
AT_LEAST,
AT_MOST,
FIT_CENTER,
CENTER_INSIDE,
CENTER_OUTSIDE,
NONE,
}

View File

@ -1,26 +1,7 @@
/*
* Copyright (C) 2024 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 } from '../RequestOption';
import { FileTypeUtil } from '../utils/FileTypeUtil';
import { CenterOutside, FitCenter, SampleSizeRounding } from './DownsampleStartegy';
let TAG = 'downsampling'
export interface calculateScaleType {
targetWidth: number,
targetHeight: number
}
import { Atleast, AtMost, CenterInside, CenterOutside, DownsampleNone, FitCenter } from './DownsampleStartegy';
import { calculateScaleType, highestOneBit, SampleSizeRounding } from './downsampleUtils';
export class Downsampler {
@ -29,40 +10,79 @@ export class Downsampler {
sourceHeight: number,
sourceWidth: number,
request?: RequestOption
): calculateScaleType {
const fileType: string | null = new FileTypeUtil().getFileType(imageType)
let powerOfTwoWidth: number | null = null;
let powerOfTwoHeight: number | null = null;
): ESObject {
let degreesToRotate:number = 0 //获取旋转角度
const fileType: string | null = new FileTypeUtil().getFileType(imageType)//获取图片类型
let powerOfTwoWidth: number = 0;
let powerOfTwoHeight: number = 0;
let targetWidth: number = 0
let targetHeight: number = 0
if (sourceWidth <= 0 || sourceHeight <= 0) {
throw new Error("Cannot found width or height ");
};
let orientedSourceWidth = sourceWidth;
let orientedSourceHeight = sourceHeight;
if (this.isRotationRequired(degreesToRotate)) {
orientedSourceWidth = sourceHeight;
orientedSourceHeight = sourceWidth;
}
if (request?.size.width && !request?.size.height) {
targetWidth = this.round((request?.size.height) * sourceWidth / sourceHeight)
} else if (request?.size.height && !request?.size.width) {
targetHeight = this.round((request?.size.width) * sourceHeight / sourceWidth)
} else if (request?.size.height && request?.size.width) {
targetHeight = request.size.height;
targetWidth = request?.size.width;
targetWidth = request?.size.width===sourceWidth?(this.isRotationRequired(degreesToRotate)?sourceHeight:sourceWidth):request?.size.width
targetHeight = request?.size.height===sourceHeight?(this.isRotationRequired(degreesToRotate)?sourceWidth:sourceHeight):request?.size.height;
} else {
throw new Error("Cannot found width or height ");
}
if (sourceWidth <= 0 || sourceHeight <= 0){
throw new Error("Cannot found width or height");
};
let orientedSourceWidth = sourceWidth;
let orientedSourceHeight = sourceHeight;
if (this.isRotationRequired(90)) {
orientedSourceWidth = sourceHeight;
orientedSourceHeight = sourceWidth;
}
/*安卓的模式*/
let exactScaleFactor: number = new FitCenter()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
if (exactScaleFactor <= 0) {
throw new Error("Cannot round with exactScaleFactor");
}
/*安卓的模式*/
let rounding: SampleSizeRounding = new FitCenter()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
switch (request?.downsampType.getName()) {
case "FitCenter":
exactScaleFactor = new FitCenter()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new FitCenter()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break;
case "DownsampleNone":
exactScaleFactor = new DownsampleNone()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new DownsampleNone()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break
case "AtMost":
exactScaleFactor = new AtMost()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new AtMost()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break
case "CenterInside":
exactScaleFactor = new CenterInside()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new CenterInside()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break
case "AtLeast":
exactScaleFactor = new Atleast()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new Atleast()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break
case "CenterOutside":
exactScaleFactor = new CenterOutside()
.getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
rounding = new CenterOutside()
.getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight)
break
}
if (exactScaleFactor <= 0) {
throw new Error("Cannot round with exactScaleFactor");
}
if (rounding == null) {
throw new Error("Cannot round with null rounding");
}
@ -75,7 +95,7 @@ export class Downsampler {
Math.min(widthScaleFactor, heightScaleFactor)
// 将整型的缩放因子转换为2的次幂采样大小
let powerOfTwoSampleSize: number = 0;
powerOfTwoSampleSize = Math.max(1, this.highestOneBit(scaleFactor))
powerOfTwoSampleSize = Math.max(1, highestOneBit(scaleFactor))
if (rounding == SampleSizeRounding.MEMORY && powerOfTwoSampleSize < (1 / exactScaleFactor)) {
powerOfTwoSampleSize = powerOfTwoSampleSize << 1;
}
@ -103,15 +123,6 @@ export class Downsampler {
return a
}
highestOneBit(i: number): number {
i |= (i >> 1);
i |= (i >> 2);
i |= (i >> 4);
i |= (i >> 8);
i |= (i >> 16);
return i - (i >>> 1);
}
round(value: number): number {
return Math.floor(value + 0.5);
}
@ -119,16 +130,4 @@ export class Downsampler {
isRotationRequired(degreesToRotate: number): boolean {
return degreesToRotate == 90 || degreesToRotate == 270;
}
getDensityMultiplier(adjustedScaleFactor: number): number {
return Math.round(Number.MAX_VALUE * (adjustedScaleFactor <= 1 ? adjustedScaleFactor : 1 / adjustedScaleFactor));
}
adjustTargetDensityForError(adjustedScaleFactor: number): number {
let densityMultiplier = this.getDensityMultiplier(adjustedScaleFactor);
let targetDensity = this.round(densityMultiplier * adjustedScaleFactor);
let scaleFactorWithError = targetDensity / densityMultiplier;
let difference = adjustedScaleFactor / scaleFactorWithError;
return this.round(difference * targetDensity);
}
}

View File

@ -0,0 +1,19 @@
//假设的枚举类型与Java中的枚举相似
export enum SampleSizeRounding {
QUALITY,
MEMORY
}
export function highestOneBit(i: number): number {
i |= (i >> 1);
i |= (i >> 2);
i |= (i >> 4);
i |= (i >> 8);
i |= (i >> 16);
return i - (i >>> 1);
}
export interface calculateScaleType {
targetWidth: number,
targetHeight: number
}

View File

@ -17,19 +17,20 @@ import { IParseImage } from '../interface/IParseImage'
import image from '@ohos.multimedia.image';
import { BusinessError } from '@ohos.base'
import { RequestOption } from '../RequestOption';
import {Downsampler,calculateScaleType } from '../downsampling/Downsampler';
import { Downsampler } from '../downsampling/Downsampler';
import { calculateScaleType } from '../Downsampling/downsampleUtils';
export class ParseImageUtil implements IParseImage<PixelMap> {
parseImage(
imageinfo: ArrayBuffer,
onCompleteFunction: (value: PixelMap) => void | PromiseLike<PixelMap>,
onErrorFunction: (reason?: BusinessError | string) => void,
request?:RequestOption
request?: RequestOption
) {
this.parseImageThumbnail(1, imageinfo, onCompleteFunction, onErrorFunction,request)
this.parseImageThumbnail(1, imageinfo, onCompleteFunction, onErrorFunction, request)
}
parseImageThumbnail(scale: number, imageinfo: ArrayBuffer, onCompleteFunction: (value: PixelMap) => void | PromiseLike<PixelMap>, onErrorFunction: (reason?: BusinessError | string) => void,request?:RequestOption) {
parseImageThumbnail(scale: number, imageinfo: ArrayBuffer, onCompleteFunction: (value: PixelMap) => void | PromiseLike<PixelMap>, onErrorFunction: (reason?: BusinessError | string) => void, request?: RequestOption) {
let imageSource: image.ImageSource = image.createImageSource(imageinfo); // 步骤一文件转为pixelMap 然后变换 给Image组件
imageSource.getImageInfo().then((value) => {
@ -43,9 +44,9 @@ export class ParseImageUtil implements IParseImage<PixelMap> {
editable: true,
desiredSize: defaultSize
};
if(request?.downsampType.getName()!==undefined && request?.downsampType.getName()!=='DownsampleNone'){
const b:calculateScaleType = new Downsampler().calculateScaling(imageinfo, hValue, wValue,request)
opts= {
if (request?.downsampType.getName() !== undefined && request?.downsampType.getName() !== 'DownsampleNone') {
const b: calculateScaleType = new Downsampler().calculateScaling(imageinfo, hValue, wValue, request)
opts = {
editable: true,
desiredSize: {
height: b.targetHeight,

View File

@ -20,7 +20,8 @@ import worker, { ErrorEvent, MessageEvents } from '@ohos.worker';
import taskpool from '@ohos.taskpool'
import { LogUtil } from '../LogUtil'
import { RequestOption } from '../../RequestOption'
import { Downsampler,calculateScaleType } from '../../downsampling/Downsampler'
import { Downsampler } from '../../downsampling/Downsampler'
import { calculateScaleType } from '../../Downsampling/downsampleUtils'
export interface senderData {
type: string,
@ -53,7 +54,7 @@ export class GIFParseImpl implements IParseGif {
imageSource.getImageInfo().then((value) => {
hValue = Math.round(value.size.height);
wValue = Math.round(value.size.height);
if ( _request?.downsampType.getName()!==undefined && _request?.downsampType.getName()!=='DownsampleNone') {
if (_request?.downsampType.getName() !== undefined && _request?.downsampType.getName() !== 'DownsampleNone') {
const b: calculateScaleType = new Downsampler().calculateScaling(imageinfo, Math.round(value.size.height), Math.round(value.size.width), _request)
decodeOpts = {
sampleSize: 1,

View File

@ -17,7 +17,8 @@ import { RequestOption } from '../../RequestOption'
import { BusinessError } from '@ohos.base'
import { ImageKnifeData, ImageKnifeType } from '../../ImageKnifeData'
import image from '@ohos.multimedia.image'
import { Downsampler, calculateScaleType } from '../../downsampling/Downsampler'
import { Downsampler } from '../../downsampling/Downsampler'
import { calculateScaleType } from '../../Downsampling/downsampleUtils'
export class SVGParseImpl implements IParseSvg {
parseSvg(option: RequestOption, imageInfo: ArrayBuffer,
@ -36,7 +37,7 @@ export class SVGParseImpl implements IParseSvg {
editable: true,
desiredSize: defaultSize
};
if (option?.downsampType.getName()!==undefined && option?.downsampType.getName()!=='DownsampleNone') {
if (option?.downsampType.getName() !== undefined && option?.downsampType.getName() !== 'DownsampleNone') {
const b: calculateScaleType = new Downsampler().calculateScaling(imageInfo, hValue, wValue, option)
opts = {
editable: true,