Sur cette page

ScrollView QML Type

Affichage défilable. Plus...

Import Statement: import QtQuick.Controls
Inherits:

Pane

Propriétés

Description détaillée

ScrollView permet de faire défiler du contenu défini par l'utilisateur. Il peut être utilisé soit pour remplacer un Flickable, soit pour agrémenter un élément existant.

Vue de défilement contenant du contenu défilable

Le premier exemple illustre l'utilisation la plus simple de ScrollView.

ScrollView {
    width: 200
    height: 200

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

Le deuxième exemple illustre l'utilisation d'un Flickable existant, c'est-à-dire un ListView.

ScrollView {
    width: 200
    height: 200

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

            required property int index
        }
    }
}

Remarque : à partir de Qt 6.0, ScrollView découpe automatiquement son contenu si vous n’utilisez pas de Flickable comme enfant. Si vous ne le souhaitez pas, vous pouvez définir votre propre Flickable comme enfant et contrôler explicitement la propriété « clip » du Flickable.

Dimensionnement

Comme pour Flickable, plusieurs points sont à garder à l’esprit lors de l’utilisation de ScrollView :

  • Si un seul élément est utilisé au sein d’un ScrollView, la taille du contenu est automatiquement calculée en fonction de la taille implicite de l’élément qu’il contient. Cependant, si plusieurs éléments sont utilisés (ou si aucune taille implicite n’est fournie), les propriétés contentWidth et contentHeight doivent être définies sur la taille combinée des éléments qu’il contient.
  • Si la taille du contenu est inférieure ou égale à celle du ScrollView, celui-ci ne sera pas défilable.
  • Si vous souhaitez que le ScrollView ne défile que verticalement, vous pouvez lier contentWidth à availableWidth (et inversement pour contentHeight). Cela permettra au contenu de remplir tout l’espace disponible horizontalement à l’intérieur du ScrollView, en tenant compte des marges et des barres de défilement.

Barres de défilement

Les barres de défilement horizontales et verticales sont accessibles et personnalisables à l'aide des propriétés associées ScrollBar.horizontal et ScrollBar.vertical. L'exemple suivant ajuste les règles des barres de défilement de manière à ce que la barre de défilement horizontale soit toujours désactivée et que la barre de défilement verticale soit toujours activée.

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

Interaction tactile vs interaction à la souris

En mode tactile, ScrollView active le défilement par effleurement et désactive les barres de défilement.

Lors d’une interaction avec une souris, le défilement par effleurement est désactivé et les barres de défilement sont interactives.

Les barres de défilement peuvent être rendues interactives lors d’une interaction tactile, ou non interactives lors d’une interaction avec une souris, en définissant explicitement la propriété ` interactive ` sur ` true ` ou ` false`, respectivement.

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

Tailles variables des délégués

Des tailles de délégués variables peuvent entraîner des « sauts » de l’ ScrollBar lorsque de nouveaux délégués sont chargés dans la vue. Il est donc recommandé d’utiliser des délégués de taille égale. Voir Variable Delegate Size and Section Labels pour plus d’informations.

Voir également ScrollBar, ScrollIndicator, Personnalisation de ScrollView, des contrôles conteneurs et de la gestion du focus dans Qt Quick Controls.

Documentation sur les propriétés

contentChildren : list<Item>

Cette propriété contient la liste des éléments enfants de contenu.

Cette liste contient tous les éléments qui ont été déclarés en QML comme enfants de la vue.

Remarque : contrairement à ` contentData`, ` contentChildren ` n'inclut pas les objets QML non visuels.

Voir également Item::children et contentData.

contentData : list<QtObject> [default]

Cette propriété contient la liste des données de contenu.

Cette liste contient tous les objets qui ont été déclarés en QML en tant qu'enfants de la vue.

Remarque : contrairement à ` contentChildren`, ` contentData ` inclut les objets QML non visuels.

Voir également Item::data et contentChildren.

effectiveScrollBarHeight : real [since 6.6]

Cette propriété contient la hauteur effective de la barre de défilement horizontale. Lorsque la barre de défilement est visible, cette propriété correspond à la hauteur actuelle de la barre. Lorsque la barre de défilement n’est pas visible ou que sa politique est définie sur « QQuickScrollBar::AlwaysOff », cette propriété prend la valeur « 0 ».

Cette propriété a été introduite dans Qt 6.6.

Voir également ScrollBar::policy.

effectiveScrollBarWidth : real [since 6.6]

Cette propriété contient la largeur effective de la barre de défilement verticale. Lorsque la barre de défilement est visible, cette propriété correspond à sa largeur actuelle. Lorsque la barre de défilement n'est pas visible ou que sa politique est définie sur « QQuickScrollBar::AlwaysOff », cette propriété prend la valeur « 0 ».

Cette propriété a été introduite dans Qt 6.6.

Voir également ScrollBar::policy.

© 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.