ScrollView QML Type

Vista desplazable. Más...

• Lista de todos los miembros, incluidos los heredados

Propiedades

• contentChildren : list<Item>
• contentData : list<QtObject>
• effectiveScrollBarHeight : real (since 6.6)
• effectiveScrollBarWidth : real (since 6.6)

Descripción detallada

ScrollView proporciona desplazamiento para contenido definido por el usuario. Puede utilizarse para reemplazar un Flickable, o para decorar uno existente.

El primer ejemplo muestra el uso más sencillo de ScrollView.

ScrollView {
    width: 200
    height: 200

    Label {
        text: "ABC"
        font.pixelSize: 224
    }
}

El segundo ejemplo ilustra el uso de un Flickable existente, es decir, un ListView.

ScrollView {
    width: 200
    height: 200

    ListView {
        model: 20
        delegate: ItemDelegate {
            text: "Item " + index

            required property int index
        }
    }
}

Tamaño

Al igual que con Flickable, hay varias cosas a tener en cuenta cuando se utiliza ScrollView:

• Si sólo se utiliza un único elemento dentro de un ScrollView, el tamaño del contenido se calcula automáticamente basándose en el tamaño implícito de su elemento contenido. Sin embargo, si se utiliza más de un elemento (o no se proporciona un tamaño implícito), las propiedades contentWidth y contentHeight deben ajustarse al tamaño combinado de sus elementos contenidos.
• Si el tamaño del contenido es menor o igual que el tamaño del ScrollView, éste no será desplazable.
• Si desea que el ScrollView sólo se desplace verticalmente, puede vincular contentWidth a availableWidth (y viceversa para contentHeight). Esto permitirá que el contenido llene todo el espacio disponible horizontalmente dentro del ScrollView, teniendo en cuenta cualquier relleno o barras de desplazamiento.

Barras de desplazamiento

Las barras de desplazamiento horizontal y vertical pueden ser accedidas y personalizadas utilizando las propiedades adjuntas ScrollBar.horizontal y ScrollBar.vertical. El siguiente ejemplo ajusta las políticas de las barras de desplazamiento para que la barra de desplazamiento horizontal esté siempre desactivada, y la barra de desplazamiento vertical esté siempre activada.

ScrollView {
    // ...
    ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
    ScrollBar.vertical.policy: ScrollBar.AlwaysOn
}

Interacción Táctil vs. Ratón

Cuando es táctil, ScrollView activa el desplazamiento y hace que las barras de desplazamiento no sean interactivas.

Cuando se interactúa con un dispositivo de ratón, el desplazamiento se desactiva y las barras de desplazamiento son interactivas.

Las barras de desplazamiento pueden hacerse interactivas al tacto, o no interactivas cuando se interactúa con un dispositivo de ratón, estableciendo la propiedad interactive explícitamente a true o false, respectivamente.

ScrollView {
    // ...
    ScrollBar.horizontal.interactive: true
    ScrollBar.vertical.interactive: true
}

Variación del tamaño de los delegados

Los tamaños variables de los delegados pueden hacer que ScrollBar "salte" a medida que se cargan nuevos delegados en la vista. Por esta razón, se recomienda tener delegados de igual tamaño. Para más información, consulte Variable Delegate Size and Section Labels.

Ver también ScrollBar, ScrollIndicator, Personalización de ScrollView, Controles Contenedores y Gestión del Enfoque en Qt Quick Controls.

Documentación de Propiedades

contentChildren : list<Item>

Esta propiedad contiene la lista de hijos del contenido.

La lista contiene todos los elementos que han sido declarados en QML como hijos de la vista.

Véase también Item::children y contentData.

contentData : list<QtObject> [default]

Esta propiedad contiene la lista de datos de contenido.

La lista contiene todos los objetos que han sido declarados en QML como hijos de la vista.

Véase también Item::data y contentChildren.

effectiveScrollBarHeight : real [since 6.6]

Esta propiedad contiene la altura efectiva de la barra de desplazamiento horizontal. Cuando la barra de desplazamiento está visible, esta propiedad es la altura actual de la barra de desplazamiento. Cuando la barra de desplazamiento no es visible o su política está establecida en QQuickScrollBar::AlwaysOff, esta propiedad es 0.

Esta propiedad se introdujo en Qt 6.6.

Véase también ScrollBar::policy.

effectiveScrollBarWidth : real [since 6.6]

Esta propiedad contiene el ancho efectivo de la barra de desplazamiento vertical. Cuando la barra de desplazamiento está visible, esta propiedad es la anchura actual de la barra de desplazamiento. Cuando la barra de desplazamiento no está visible o su política está establecida en QQuickScrollBar::AlwaysOff, esta propiedad es 0.

Esta propiedad se introdujo en Qt 6.6.

Véase también ScrollBar::policy.