新增aspectRatio参数, 修复某些情况下组件内的 Image 加载图片成功后只有componentWith, 但是componentHeight=0的情况

This commit is contained in:
qiujietian 2024-08-29 20:13:41 +08:00
parent b3114dd47b
commit 8c025e5d02
3 changed files with 17 additions and 1 deletions

View File

@ -50,7 +50,7 @@ struct SingleImage {
loadSrc: $r("app.media.svgSample"), loadSrc: $r("app.media.svgSample"),
placeholderSrc: $r("app.media.loading"), placeholderSrc: $r("app.media.loading"),
errorholderSrc: $r("app.media.failed"), errorholderSrc: $r("app.media.failed"),
objectFit: ImageFit.Contain objectFit: ImageFit.Contain,
}) })
}).width(100).height(100) }).width(100).height(100)
.onClick(()=>{ .onClick(()=>{
@ -67,6 +67,18 @@ struct SingleImage {
objectFit: ImageFit.Contain objectFit: ImageFit.Contain
}) })
}).width(100).height(100) }).width(100).height(100)
Text("测试aspectRatio")
.fontSize(30)
.fontWeight(FontWeight.Bold)
ImageKnifeComponent({
imageKnifeOption: new ImageKnifeOption({
loadSrc: this.localFile,
placeholderSrc: $r("app.media.loading"),
errorholderSrc: $r("app.media.failed"),
objectFit: ImageFit.Contain,
aspectRatio: 1.5
})
}).width(100).height(100).backgroundColor(Color.Red)
Text("网络图片") Text("网络图片")
.fontSize(30) .fontSize(30)
.fontWeight(FontWeight.Bold) .fontWeight(FontWeight.Bold)

View File

@ -90,6 +90,7 @@ interface ImageOption {
onLoadListener?: OnLoadCallBack | undefined; onLoadListener?: OnLoadCallBack | undefined;
onComplete?:(event:EventImage | undefined) => void onComplete?:(event:EventImage | undefined) => void
drawingColorFilter?: ColorFilter | drawing.ColorFilter drawingColorFilter?: ColorFilter | drawing.ColorFilter
aspectRatio?: number;
} }
@ObservedV2 @ObservedV2
export class ImageKnifeOption { export class ImageKnifeOption {
@ -121,6 +122,7 @@ export class ImageKnifeOption {
onLoadListener?: OnLoadCallBack | undefined; onLoadListener?: OnLoadCallBack | undefined;
onComplete?:(event:EventImage | undefined) => void onComplete?:(event:EventImage | undefined) => void
drawingColorFilter?: ColorFilter | drawing.ColorFilter drawingColorFilter?: ColorFilter | drawing.ColorFilter
aspectRatio?: number;
constructor(option?:ImageOption) { constructor(option?:ImageOption) {
this.loadSrc = option?.loadSrc == undefined ? "" : option?.loadSrc this.loadSrc = option?.loadSrc == undefined ? "" : option?.loadSrc
this.placeholderSrc = option?.placeholderSrc this.placeholderSrc = option?.placeholderSrc
@ -141,6 +143,7 @@ export class ImageKnifeOption {
this.onLoadListener = option?.onLoadListener this.onLoadListener = option?.onLoadListener
this.onComplete = option?.onComplete this.onComplete = option?.onComplete
this.drawingColorFilter = option?.drawingColorFilter this.drawingColorFilter = option?.drawingColorFilter
this.aspectRatio = option?.aspectRatio
} }
} }

View File

@ -93,6 +93,7 @@ export struct ImageKnifeComponent {
.border(this.imageKnifeOption.border) .border(this.imageKnifeOption.border)
.syncLoad(this.syncLoad) .syncLoad(this.syncLoad)
.draggable(false) .draggable(false)
.aspectRatio(this.imageKnifeOption.aspectRatio)
.onComplete(this.imageKnifeOption.onComplete) .onComplete(this.imageKnifeOption.onComplete)
.onSizeChange((oldValue:SizeOptions, newValue:SizeOptions) => { .onSizeChange((oldValue:SizeOptions, newValue:SizeOptions) => {
this.currentWidth = newValue.width as number this.currentWidth = newValue.width as number