在裁剪成矩形大小的同时在QML中缩放图像

walolinux 发表于 Dev

walolinux

我有一个固定大小的黄色QML矩形，并且在其中缩放图像。

发生这种情况时，我的图像最终变得比我的黄色矩形大（显然）。但是，发生这种情况时，我希望仅在矩形内部绘制我的图像，而不要在其上延伸。

这是我的代码：

import QtQuick 2.1
import QtQuick.Controls 1.0

Rectangle{
    width: 1500
    height: 1100
    color: "red"
    
    Rectangle {
        width: 900
        height: 500
        color: "yellow"
    
        Component.onCompleted: init()
        
        Image {
            id: imagenCentro
            width: 800
            height: 400
            fillMode: Image.PreserveAspectCrop
            source: "http://www.bizh2o.com/wp-content/uploads/2015/02/shopping.jpg"
            smooth: true
            z: parent.z+1
            opacity: 0.7
        }

        NumberAnimation {
            id: animacion
            target: imagenCentro
            property: "scale"
            to: 1.5
            easing.type: Easing.InOutQuad
        }

        function init(){
            imagenCentro.scale = 1
            animacion.duration = 5000
            animacion.start()
        }
           
    }

}

谢谢。

米奇

设置clip为true黄色矩形：

import QtQuick 2.1
import QtQuick.Controls 1.0

Rectangle {
    width: 1500
    height: 1100
    color: "red"

    Rectangle {
        width: 900
        height: 500
        color: "yellow"
        clip: true

        Component.onCompleted: init()

        Image {
            id: imagenCentro
            width: 800
            height: 400
            fillMode: Image.PreserveAspectCrop
            source: "http://www.bizh2o.com/wp-content/uploads/2015/02/shopping.jpg"
            smooth: true
            z: parent.z + 1
            opacity: 0.7
        }

        NumberAnimation {
            id: animacion
            target: imagenCentro
            property: "scale"
            to: 1.5
            easing.type: Easing.InOutQuad
        }

        function init() {
            imagenCentro.scale = 1
            animacion.duration = 5000
            animacion.start()
        }
    }
}

请注意，这clip 确实会带来性能损失：

默认情况下，裁剪是禁用的，并且仅在需要时才启用。

剪辑是一种视觉效果，而不是优化。它增加（而不是减少）渲染器的复杂性。如果启用了剪切，则一个项目会将其自己的绘画以及其子代的绘画都剪切到其边界矩形。这使渲染器无法自由地对元素的绘制顺序进行重新排序，从而导致次佳的最佳情况场景图遍历。

委托内部的剪辑特别糟糕，应不惜一切代价避免。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。