Column QML Type

Positionne ses enfants dans une colonne. Plus d'informations...

• Liste de tous les membres, y compris les membres hérités

Propriétés

• add : Transition
• bottomPadding : real
• leftPadding : real
• move : Transition
• padding : real
• populate : Transition
• rightPadding : real
• spacing : real
• topPadding : real

Signaux

• positioningComplete()

Méthodes

• void forceLayout()

Description détaillée

Column est un type qui positionne ses éléments enfants le long d'une seule colonne. Il peut être utilisé comme un moyen pratique de positionner verticalement une série d'éléments sans utiliser d'ancres.

Voici une colonne qui contient trois rectangles de tailles différentes :

Column {
    spacing: 2

    Rectangle { color: "red"; width: 50; height: 50 }
    Rectangle { color: "green"; width: 20; height: 50 }
    Rectangle { color: "blue"; width: 50; height: 20 }
}

La colonne positionne automatiquement ces éléments dans une formation verticale, comme ceci :

Si un élément d'une colonne n'est pas visible, ou si sa largeur ou sa hauteur est égale à 0, l'élément ne sera pas disposé et ne sera pas visible dans la colonne. De même, étant donné qu'une colonne positionne automatiquement ses enfants verticalement, un élément enfant dans une colonne ne doit pas définir sa position y ou s'ancrer verticalement à l'aide des ancres top, bottom, anchors.verticalCenter, fill ou centerIn. Si vous devez effectuer ces actions, envisagez de positionner les éléments sans utiliser de colonne.

Notez que les éléments d'une colonne peuvent utiliser la propriété Positioner attached pour obtenir davantage d'informations sur leur position dans la colonne.

Pour plus d'informations sur l'utilisation des colonnes et d'autres types de positionneurs, voir Positionneurs d'éléments.

Utilisation de transitions

Une colonne anime les éléments à l'aide de transitions spécifiques lorsque des éléments sont ajoutés à la colonne ou déplacés à l'intérieur de celle-ci.

Par exemple, la colonne ci-dessous définit la propriété move à une valeur spécifique Transition:

Column {
    spacing: 2

    Rectangle { color: "red"; width: 50; height: 50 }
    Rectangle { id: greenRect; color: "green"; width: 20; height: 50 }
    Rectangle { color: "blue"; width: 50; height: 20 }

    move: Transition {
        NumberAnimation { properties: "x,y"; duration: 1000 }
    }

    focus: true
    Keys.onSpacePressed: greenRect.visible = !greenRect.visible
}

Lorsque vous appuyez sur la touche Espace, la valeur visible de la propriété verte Rectangle est modifiée. Lorsqu'il apparaît et disparaît, le Rectangle bleu se déplace dans la colonne et la transition move est automatiquement appliquée au Rectangle bleu :

Voir aussi Row, Grid, Flow, Positioner, ColumnLayout, et Qt Quick Exemples - Positionneurs.

Documentation sur les propriétés

add : Transition

Cette propriété contient la transition à exécuter pour les éléments qui sont ajoutés à ce positionneur. Pour un positionneur, cela s'applique aux éléments suivants

• aux éléments qui sont créés ou reparentés en tant qu'enfant du positionneur après la création de ce dernier
• Les éléments enfants dont la propriété Item::visible passe de false à true, et qui sont donc désormais visibles.

La transition peut utiliser la propriété ViewTransition pour accéder à plus de détails sur l'élément qui est ajouté. Voir la documentation de ViewTransition pour plus de détails et d'exemples sur l'utilisation de ces transitions.

Voir aussi populate, ViewTransition, et Qt Quick Exemples - Positionneurs.

Ces propriétés définissent le remplissage autour du contenu.

move : Transition

Cette propriété définit la transition à exécuter pour les éléments qui se sont déplacés dans le positionneur. Pour un positionneur, cela s'applique aux éléments suivants

• aux éléments enfants qui se déplacent suite à l'ajout, à la suppression ou à la réorganisation d'autres éléments dans le positionneur
• Les éléments enfants qui sont repositionnés en raison du redimensionnement d'autres éléments dans le positionneur.

La transition peut utiliser la propriété ViewTransition pour accéder à plus de détails sur l'élément qui est déplacé. Notez toutefois que pour cette transition de déplacement, les listes ViewTransition.targetIndexes et ViewTransition.targetItems ne sont définies que lorsque cette transition est déclenchée par l'ajout d'autres éléments dans le positionneur ; dans les autres cas, ces listes seront vides. Voir la documentation de ViewTransition pour plus de détails et d'exemples sur l'utilisation de ces transitions.

Voir aussi add, populate, ViewTransition, et Qt Quick Exemples - Positionneurs.

populate : Transition

Cette propriété définit la transition à exécuter pour les éléments qui font partie de ce positionneur au moment de sa création. La transition est exécutée lors de la première création du positionneur.

La transition peut utiliser la propriété ViewTransition pour accéder à plus de détails sur l'élément qui est ajouté. Voir la documentation ViewTransition pour plus de détails et d'exemples sur l'utilisation de ces transitions.

Voir aussi add, ViewTransition, et Qt Quick Exemples - Positionneurs.

spacing : real

L'espacement est la quantité de pixels laissés vides entre les éléments adjacents. L'espacement par défaut est de 0.

Voir également Grid::spacing.

Documentation sur les signaux

positioningComplete()

Ce signal est émis lorsque le positionnement est terminé.

Documentation de la méthode

void forceLayout()

La colonne positionne généralement ses enfants une fois par image. Cela signifie qu'à l'intérieur des blocs de script, il est possible que les enfants sous-jacents aient changé, mais que la colonne n'ait pas encore été mise à jour en conséquence.

Cette méthode oblige la colonne à répondre immédiatement à tout changement en cours dans ses enfants.

Remarque: en général, les méthodes ne doivent être appelées qu'une fois le composant terminé.