抛出是否开启抗锯齿属性配置

Signed-off-by: liangdazhi <liangdazhi@h-partners.com>
This commit is contained in:
liangdazhi 2024-01-02 11:27:20 +08:00
parent 0686bdf757
commit dcf18a3ce7
4 changed files with 44 additions and 30 deletions

View File

@ -1,6 +1,9 @@
## 2.1.2-rc.4
- canvas新增抗锯齿
## 2.1.2-rc.3
- svg图片解码改为imageSource解码
- canvas新增抗锯齿
## 2.1.2-rc.2

View File

@ -107,32 +107,33 @@ imageKnifeOption = {
### ImageKnifeOption参数列表
| 参数名称 | 入参内容 | 功能简介 |
| ---------------------------- | ------------------------------------------------------------ | ----------------------------------- |
| loadSrc | string\|PixelMap\|Resource | 图片数据源 |
| mainScaleType | ScaleType | 设置主图展示样式(可选) |
| strategy | DiskStrategy | 设置磁盘缓存策略(可选) |
| dontAnimateFlag | boolean | gif加载展示一帧可选 |
| placeholderSrc | PixelMap\|Resource | 占位图数据源 |
| placeholderScaleType | ScaleType | 设置占位图展示样式(可选) |
| errorholderSrc | PixelMap\|Resource | 错误占位图数据源 |
| errorholderSrcScaleType | ScaleType | 设置失败占位图展示样式(可选) |
| retryholderSrc | PixelMap\|Resource | 重试占位图数据源 |
| retryholderScaleType | ScaleType | 设置重试占位图展示样式(可选) |
| thumbSizeMultiplier | number 范围(0,1] | 设置缩略图占比(可选) |
| thumbSizeDelay | number | 设置缩略图展示时间(可选) |
| thumbSizeMultiplierScaleType | ScaleType | 设置缩略图展示样式(可选) |
| displayProgress | boolean | 设置是否展示下载进度条(可选) |
| canRetryClick | boolean | 设置重试图层是否点击重试(可选) |
| onlyRetrieveFromCache | boolean | 仅使用缓存加载数据(可选) |
| isCacheable | boolean | 是否开启一级内存缓存(可选) |
| gif | {<br/> // 返回一周期动画gif消耗的时间<br/> loopFinish?: (loopTime?) => void<br/> // gif播放速率相关<br/> speedFactory?: number<br/> // 直接展示gif第几帧数据<br/> seekTo?: number<br/> } | GIF播放控制能力可选 |
| transformation | BaseTransform<PixelMap> | 单个变换(可选) |
| transformations | Array<BaseTransform<PixelMap>> | 多个变换,目前仅支持单个变换(可选) |
| allCacheInfoCallback | IAllCacheInfoCallback | 输出缓存相关内容和信息(可选) |
| signature | ObjectKey | 自定key可选 |
| **drawLifeCycle** | **IDrawLifeCycle** | **用户自定义实现绘制方案(可选)** |
| imageSmoothingQuality | AntiAliasing | 抗锯齿属性配置 |
| 参数名称 | 入参内容 | 功能简介 |
| ---------------------------- | ------------------------------------------------------------ |-----------------------------------------------|
| loadSrc | string\| PixelMap\ |Resource | 图片数据源 |
| mainScaleType | ScaleType | 设置主图展示样式(可选) |
| strategy | DiskStrategy | 设置磁盘缓存策略(可选) |
| dontAnimateFlag | boolean | gif加载展示一帧可选 |
| placeholderSrc | PixelMap\| Resource | 占位图数据源 |
| placeholderScaleType | ScaleType | 设置占位图展示样式(可选) |
| errorholderSrc | PixelMap\| Resource | 错误占位图数据源 |
| errorholderSrcScaleType | ScaleType | 设置失败占位图展示样式(可选) |
| retryholderSrc | PixelMap\| Resource | 重试占位图数据源 |
| retryholderScaleType | ScaleType | 设置重试占位图展示样式(可选) |
| thumbSizeMultiplier | number 范围(0,1] | 设置缩略图占比(可选) |
| thumbSizeDelay | number | 设置缩略图展示时间(可选) |
| thumbSizeMultiplierScaleType | ScaleType | 设置缩略图展示样式(可选) |
| displayProgress | boolean | 设置是否展示下载进度条(可选) |
| canRetryClick | boolean | 设置重试图层是否点击重试(可选) |
| onlyRetrieveFromCache | boolean | 仅使用缓存加载数据(可选) |
| isCacheable | boolean | 是否开启一级内存缓存(可选) |
| gif | {<br/> // 返回一周期动画gif消耗的时间<br/> loopFinish?: (loopTime?) => void<br/> // gif播放速率相关<br/> speedFactory?: number<br/> // 直接展示gif第几帧数据<br/> seekTo?: number<br/> } | GIF播放控制能力可选 |
| transformation | BaseTransform<PixelMap> | 单个变换(可选) |
| transformations | Array<BaseTransform<PixelMap>> | 多个变换,目前仅支持单个变换(可选) |
| allCacheInfoCallback | IAllCacheInfoCallback | 输出缓存相关内容和信息(可选) |
| signature | ObjectKey | 自定key可选 |
| **drawLifeCycle** | **IDrawLifeCycle** | **用户自定义实现绘制方案(可选)** |
| imageSmoothingEnabled | boolean | 抗锯齿是否开启属性配置设置为false时imageSmoothingQuality失效 |
| imageSmoothingQuality | AntiAliasing | 抗锯齿属性配置 |
其他参数只需要在ImageKnifeOption对象上按需添加即可。

View File

@ -37,8 +37,17 @@ struct TestImageAntiAliasingWithPage {
.margin(15)
.overlay('png', { align: Alignment.Bottom, offset: { x: 0, y: 20 } })
.interpolation(ImageInterpolation.High)
Text("ImageKnife开启抗锯齿且设置为中等").fontSize(15)
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1,imageSmoothingQuality: AntiAliasing.FIT_MEDIUM }).width(600).height(600)
Text("Image开启抗锯齿且设置为中等").fontSize(15)
Image($r('app.media.icon_failed'))
.width(600)
.height(600)
.margin(15)
.overlay('png', { align: Alignment.Bottom, offset: { x: 0, y: 20 } })
.interpolation(ImageInterpolation.Medium)
Text("ImageKnife未开启抗锯齿").fontSize(15)
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(600).height(600)
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1,imageSmoothingEnabled: false }).width(600).height(600)
Text("Image未开启抗锯齿").fontSize(15)
Image($r('app.media.icon_failed'))
.width(600)

View File

@ -42,7 +42,8 @@ export struct ImageKnifeComponent {
private startGifLoopTime: number = 0
private endGifLoopTime: number = 0
// 抗锯齿属性
private imageSmoothingQuality: ImageSmoothingQuality = 'low'
private imageSmoothingQuality: ImageSmoothingQuality = 'low';
private imageSmoothingEnabled: boolean = true;
defaultLifeCycle: IDrawLifeCycle = {
// 展示占位图
@ -118,7 +119,7 @@ export struct ImageKnifeComponent {
})
.onReady(() => {
let ctx = this.context;
ctx.imageSmoothingEnabled = true;
ctx.imageSmoothingEnabled = this.imageSmoothingEnabled;
ctx.imageSmoothingQuality = this.imageSmoothingQuality;
this.canvasHasReady = true;
if (this.onReadyNext) {