Rotation QML Type▲

  • Import Statement: import QtQuick

  • Group: Rotation is part of qtquick-visual-transforms

Detailed Description▲

The Rotation type provides a way to rotate an Item through a rotation-type transform.

It allows (z axis) rotation to be relative to an arbitrary point, and also provides a way to specify 3D-like rotations for Items. This gives more control over item rotation than the rotation property.

The following example rotates a Rectangle around its interior point (25, 25):

 
Sélectionnez
Rectangle {
    width: 100; height: 100
    color: "blue"
    transform: Rotation { origin.x: 25; origin.y: 25; angle: 45}
}

For 3D-like item rotations, you must specify the axis of rotation in addition to the origin point. The following example shows various 3D-like rotations applied to an Image.

 
Sélectionnez
import QtQuick 2.0

Row {
    x: 10; y: 10
    spacing: 10

    Image { source: "pics/qt.png" }
    Image {
        source: "pics/qt.png"
        transform: Rotation { origin.x: 30; origin.y: 30; axis { x: 0; y: 1; z: 0 } angle: 18 }
    }
    Image {
        source: "pics/qt.png"
        transform: Rotation { origin.x: 30; origin.y: 30; axis { x: 0; y: 1; z: 0 } angle: 36 }
    }
    Image {
        source: "pics/qt.png"
        transform: Rotation { origin.x: 30; origin.y: 30; axis { x: 0; y: 1; z: 0 } angle: 54 }
    }
    Image {
        source: "pics/qt.png"
        transform: Rotation { origin.x: 30; origin.y: 30; axis { x: 0; y: 1; z: 0 } angle: 72 }
    }
}
Image non disponible