在 QML 中仅显示图像的右侧部分 - sourceClipRect

Question

我试图通过使用 sourceClipRect 属性

在 QML 中仅显示图像的右侧部分

这是代码片段

Image
{
    id : _image

    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter 
    fillMode: Image.PreserveAspectCrop
    width: parent.width
    height: parent.height
    sourceSize.width : undefined
    sourceSize.height : undefined
    source : imagePath  
    sourceClipRect: Qt.rect(sourceSize.width/2, 0, sourceSize.width/2, sourceSize.height)
    smooth : true
    mipmap : true
}

此图片位于具有固定宽度和高度的项目中

这在属性 sourceClipRect 上给了我一个警告和一个绑定循环，我猜测是在 sourceClipRect

中使用 sourceSize

我不能在sourceClipRect中使用硬数字，因为我不知道图片的原始大小

你知道我怎样才能避免这个绑定循环吗？也许通过另一种方式获得原始宽度和高度，但我不知道除了纯 QML 中的 sourceSize 之外的任何其他方式

Ps：结果按预期工作并且工作正常，我只是有一个丑陋的警告，说明绑定循环

非常感谢

Answer 1

我终于找到了可以接受的修复方法。它可能不是最干净的，但对我来说是可以接受的。

但是在图像的实例化时，我只是保存了没有像这样绑定的 var

  Image
  {
      id : _image

    property var  sourceSizeWidth :{sourceSizeWidth = sourceSize.width} //initializing this way avoids the binding between sourceSize.Width and sourceSizeWidth
    property var  sourceSizeHeight :{sourceSizeHeight = sourceSize.height} //initializing this way avoids the binding between sourceSize.height and sourceSizeHeight

    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter 
    fillMode: Image.PreserveAspectCrop
    width: parent.width
    height: parent.height
    sourceSize.width : undefined
    sourceSize.height : undefined
    source : imagePath  
    sourceClipRect: Qt.rect(sourceSizeWidth/2, 0, sourceSizeWidth/2, sourceSizeHeight) //Use the unbinded var to set the sourceClipRect
    smooth : true
    mipmap : true
   }

像这样进行初始化避免了新创建的 sourceSizeWidth 和 QML 之间的绑定属性 sourceSize.width

 property var  sourceSizeWidth :{sourceSizeWidth = sourceSize.width}

正如我所说，这不是最干净的方法，可能有更聪明的方法，但现在已经足够了，工作正常并且没有警告绑定循环。

干杯！

在 QML 中仅显示图像的右侧部分 - sourceClipRect

Displaying only the right part of an image in QML - sourceClipRect

image

qt

qml

image-size

qt5.15