Conceptos - Coordenadas visuales en Qt Quick

Coordenadas de elemento

El sistema por defecto de coordenadas visuales utilizado en Qt Quick es el de coordenadas de ítem. Este es un sistema de coordenadas cartesianas con (0,0) en la esquina superior izquierda del ítem. El eje x crece hacia la derecha y el eje y hacia abajo, de modo que la esquina inferior derecha del elemento se encuentra en las coordenadas (anchura, altura).

La posición de un elemento individual se especifica en términos del sistema de coordenadas de su padre. Esto significa que la lectura de los valores x,y de elementos no hermanos puede requerir una conversión para convertirlos al mismo sistema de coordenadas. Las coordenadas de la escena se utilizan a menudo como sistema de coordenadas intermedio cuando esto ocurre.

Coordenadas de la escena

Las coordenadas de escena son las coordenadas donde (0,0) corresponde a la esquina superior izquierda de la ventana en la que se está renderizando la escena. Las coordenadas de la escena suelen ser las mismas que las coordenadas del elemento raíz de la ventana.

Puedes convertir de coordenadas de elemento a coordenadas de escena utilizando las funciones del elemento cuyo sistema de coordenadas te interese. Consulte Item::mapFromItem y Item::mapToItem para convertir a coordenadas de escena, o a coordenadas de otro elemento.

Ejemplo práctico

El siguiente código QML crea un arreglo de cuadrados, con puntos añadidos para la identificación de puntos:

Rectangle {
    width: 200
    height: 200
    color: "red"

    Rectangle {
        x: 100
        y: 100
        width: 100
        height: 100
        color: "blue"

        Rectangle {
            width: 50
            height: 50
            color: "green"
        }
    }
}

En esta imagen el punto negro se sitúa en (0,0) dentro de las coordenadas del elemento del rectángulo rojo. Si el rectángulo rojo fuera el elemento raíz de la escena, entonces el punto negro también estaría situado en (0,0) en las coordenadas de la escena.

El rectángulo azul está posicionado en el punto blanco, (100,100), relativo a la esquina superior izquierda del rectángulo rojo.

El rectángulo verde no tiene especificadas las coordenadas x,y, por lo que su posición por defecto es (0,0). Como está en (0,0) en las coordenadas de su padre, el rectángulo azul, se posiciona en la esquina superior izquierda de ese rectángulo. Este es el mismo punto que el punto blanco en (100,100) en las coordenadas del rectángulo rojo.