Qt Quick Ejemplos - Posicionadores

Posicionadores es una colección de pequeños ejemplos QML relacionados con posicionadores. Cada ejemplo es un pequeño archivo QML que enfatiza un tipo o característica particular. Para más información, visite Conceptos Importantes en Qt Quick - Posicionadores.

Ejecutar el ejemplo

Para ejecutar el ejemplo desde Qt Creatorabra el modo Welcome y seleccione el ejemplo de Examples. Para más información, consulte Qt Creator: Tutorial: Construir y ejecutar.

Transiciones

Transitions muestra transiciones animadas al mostrar u ocultar elementos en un posicionador. Consiste en una escena poblada con elementos en una variedad de posicionadores: Column, Row, Grid, y Flow. Cada posicionador tiene animaciones descritas como Transiciones.

move: Transition {
    NumberAnimation {
        properties: "x,y"
        easing.type: Easing.OutBounce
    }
}

La transición mover especifica cómo se animarán los elementos dentro de un posicionador cuando sean desplazados por la aparición o desaparición de otros elementos.

add: Transition {
    NumberAnimation {
        properties: "x,y"
        easing.type: Easing.OutBounce
    }
}

La transición de añadir especifica cómo aparecerán los elementos cuando se añadan a un posicionador.

populate: Transition {
    NumberAnimation {
        properties: "x,y"
        from: 200
        duration: 100
        easing.type: Easing.OutBounce
    }
}

La transición poblar especifica cómo aparecerán los elementos cuando se cree por primera vez su posicionador padre.

Propiedades adjuntas

Propiedades adjuntas muestra cómo se puede utilizar la propiedad adjunta del posicionador para determinar dónde se encuentra un elemento dentro de un posicionador.

Rectangle {
    id: green
    color: "#80c342"
    width: 100 * page.ratio
    height: 100 * page.ratio

    Text {
      anchors.left: parent.right
      anchors.leftMargin: 20
      anchors.verticalCenter: parent.verticalCenter
      text: qsTr("Index: %1%2%3").arg(parent.Positioner.index)
                .arg(parent.Positioner.isFirstItem ? qsTr(" (First)") : "")
                .arg(parent.Positioner.isLastItem ? qsTr(" (Last)") : "")
    }

    // When mouse is clicked, display the values of the positioner
    MouseArea {
        anchors.fill: parent
        onClicked: column.showInfo(green.Positioner)
    }
}

Proyecto de ejemplo @ code.qt.io