En esta página

SwipeView QML Type

Permite al usuario navegar por las páginas deslizando el dedo hacia los lados. Más...

Import Statement: import QtQuick.Controls
Inherits:

Container

Propiedades

  • horizontal : bool (since QtQuick.Controls 2.3 (Qt 5.10))
  • interactive : bool (since QtQuick.Controls 2.1 (Qt 5.8))
  • orientation : enumeration (since QtQuick.Controls 2.2 (Qt 5.9))
  • vertical : bool (since QtQuick.Controls 2.3 (Qt 5.10))

Propiedades anexas

Descripción detallada

SwipeView proporciona un modelo de navegación basado en swipe.

SwipeView se rellena con un conjunto de páginas. Una página es visible a la vez. El usuario puede navegar entre las páginas deslizando el dedo hacia los lados. Tenga en cuenta que SwipeView en sí mismo es totalmente no visual. Se recomienda combinarlo con PageIndicator, para dar al usuario una pista visual de que hay varias páginas.

SwipeView {
    id: view

    currentIndex: 1
    anchors.fill: parent

    Item {
        id: firstPage
    }
    Item {
        id: secondPage
    }
    Item {
        id: thirdPage
    }
}

PageIndicator {
    id: indicator

    count: view.count
    currentIndex: view.currentIndex

    anchors.bottom: view.bottom
    anchors.horizontalCenter: parent.horizontalCenter
}

Como se muestra arriba, SwipeView se rellena normalmente con un conjunto estático de páginas que se definen en línea como hijas de la vista. También es posible crear páginas add, insert, move, y remove dinámicamente en tiempo de ejecución.

Cuando SwipeView se empareja con otro contenedor como TabBar, es necesario realizar un enlace bidireccional entre la propiedad currentIndex de cada control. Para hacer esto sin romper los enlaces, evite establecer currentIndex directamente, y en su lugar utilice setCurrentIndex(), por ejemplo. Para más información, consulte Managing the Current Index.

Para realizar una acción cuando cambia currentIndex, utilice el manejador de señales de cambio de propiedad onCurrentIndexChanged:

onCurrentIndexChanged: {
    print("currentIndex changed to", currentIndex)
    // ...
}

Generalmente no es aconsejable añadir una cantidad excesiva de páginas a un SwipeView. Sin embargo, cuando la cantidad de páginas aumenta, o las páginas individuales son relativamente complejas, puede ser conveniente liberar recursos descargando páginas que están fuera del alcance inmediato del usuario. El siguiente ejemplo presenta cómo utilizar Loader para mantener un máximo de tres páginas instanciadas simultáneamente.

SwipeView {
    Repeater {
        model: 6
        Loader {
            active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
            sourceComponent: Text {
                text: index
                Component.onCompleted: console.log("created:", index)
                Component.onDestruction: console.log("destroyed:", index)
            }
        }
    }
}

Nota: SwipeView se encarga de la gestión de la geometría de los elementos añadidos a la vista. No se admite el uso de anclajes en los elementos, y cualquier asignación de width o height será anulada por la vista. Tenga en cuenta que esto sólo se aplica a la raíz del elemento. Especificar anchura y altura, o usar anclas para sus hijos funciona como se espera.

Véase también TabBar, PageIndicator, Personalización de SwipeView, Controles de Navegación, Controles Contenedores y Gestión del Enfoque en Qt Quick Controls.

Documentación de Propiedades

horizontal : bool [read-only, since QtQuick.Controls 2.3 (Qt 5.10)]

Esta propiedad mantiene si la vista swipe es horizontal.

Esta propiedad se introdujo en QtQuick.Controls 2.3 (Qt 5.10).

Véase también orientation.

interactive : bool [since QtQuick.Controls 2.1 (Qt 5.8)]

Esta propiedad describe si el usuario puede interactuar con la SwipeView. El usuario no puede deslizar una vista que no sea interactiva.

El valor por defecto es true.

Esta propiedad se introdujo en QtQuick.Controls 2.1 (Qt 5.8).

orientation : enumeration [since QtQuick.Controls 2.2 (Qt 5.9)]

Esta propiedad contiene la orientación.

Valores posibles:

ConstanteDescripción
Qt.HorizontalHorizontal (por defecto)
Qt.VerticalVertical

Esta propiedad se introdujo en QtQuick.Controls 2.2 (Qt 5.9).

Ver también horizontal y vertical.

vertical : bool [read-only, since QtQuick.Controls 2.3 (Qt 5.10)]

Esta propiedad indica si la vista deslizante es vertical.

Esta propiedad se introdujo en QtQuick.Controls 2.3 (Qt 5.10).

Ver también orientation.

Documentación de la propiedad Attached

SwipeView.index : int [read-only]

Esta propiedad adjunta contiene el índice de cada elemento hijo en SwipeView.

Se adjunta a cada elemento secundario de SwipeView.

SwipeView.isCurrentItem : bool [read-only]

Esta propiedad adjunta es true si este elemento hijo es el elemento actual.

Se adjunta a cada elemento hijo de SwipeView.

SwipeView.isNextItem : bool [read-only, since QtQuick.Controls 2.1 (Qt 5.8)]

Esta propiedad adjunta es true si este hijo es el siguiente elemento.

Se adjunta a cada elemento hijo de SwipeView.

Esta propiedad se introdujo en QtQuick.Controls 2.1 (Qt 5.8).

SwipeView.isPreviousItem : bool [read-only, since QtQuick.Controls 2.1 (Qt 5.8)]

Esta propiedad adjunta es true si este hijo es el elemento anterior.

Se adjunta a cada elemento hijo de SwipeView.

Esta propiedad se introdujo en QtQuick.Controls 2.1 (Qt 5.8).

SwipeView.view : SwipeView [read-only]

Esta propiedad adjunta contiene la vista que gestiona este elemento hijo.

Se adjunta a cada elemento secundario de SwipeView.

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.