QML Listview spazio gli elementi per riempire la larghezza

Question 1

Ho una ListView (orientamento orizzontale) nel mio qml contenente alcune di dimensioni fisse elementi. Voglio gli elementi per essere distanziati per riempire il entiew larghezza dell'elemento ListView. Quindi, se ci sono meno elementi voglio essere distanziata di più. Fondamentalmente quello che mi serve è esattamente come Layout.fillWidth = true proprietà di RowLayout ma per ListView.

Posso contare il numero di elementi che ho, quindi sottrarre totale di elementi di larghezza da ListView larghezza, dividere per il conteggio elementi e assegnare la maglia ma mi sembra troppo stupido per fare. C'è un modo per farlo automaticamente come in RowLayout?

O forse ho bisogno di usare qualcosa di diverso da ListView per questo? Qualcosa di simile RowLayout, ma che posso cedere la mia lista di dati modello?

Question 2

Si può realizzare ciò che si desidera con un ListView- hai solo bisogno di regolare la spaziatura in modo dinamico in base a quanti delegati si hanno. Questo esempio si rompe se i vostri ospiti sono di varie dimensioni, (come questo si basa solo sulla larghezza del primo delegato), o se i delegati cumulativamente superare la larghezza della ListView.

ListView {
    width: 500
    orientation: Qt.Horizontal
    model: 6
    spacing: {
        if (count > 0) {
            return (width - (itemAtIndex(0).width * count))/(count - 1)
        } else {
            return 0
        }
    }

    delegate: Rectangle {
        implicitHeight: 50
        implicitWidth: 50
        color: "red"
        border.width: 1
    }
}

ListView non può essere il più appropriato contenitore per questo compito. Dico questo perché ha un built in ScrollView e altri comportamenti che suoni come non è necessario. Se tutto ciò che serve è una semplice riga di una qualche misura identica delegati, sono d'accordo con scopchanov e credo che un Repeater all'interno di un RowLayout sarebbe l'opzione migliore. Ecco un semplice esempio:

RowLayout {
    width: 500

    Repeater {
        model: 6
        delegate: Rectangle {
            implicitHeight: 50
            implicitWidth: 50
            color: "tomato"
            border.width: 1
            Layout.alignment: Qt.AlignHCenter // must be set to align the rectangles within their empty space
        }
    }
}

Si può notare che questo presenta lacune a destra e a sinistra, se queste lacune sono inaccettabili, potrebbe essere necessario impostare il spacing sul RowLayout allo stesso modo il ListView esempio invece.

fallerd · Answer 1 · 2021-11-16T18:17:48

Si può realizzare ciò che si desidera con un ListView- hai solo bisogno di regolare la spaziatura in modo dinamico in base a quanti delegati si hanno. Questo esempio si rompe se i vostri ospiti sono di varie dimensioni, (come questo si basa solo sulla larghezza del primo delegato), o se i delegati cumulativamente superare la larghezza della ListView.

ListView {
    width: 500
    orientation: Qt.Horizontal
    model: 6
    spacing: {
        if (count > 0) {
            return (width - (itemAtIndex(0).width * count))/(count - 1)
        } else {
            return 0
        }
    }

    delegate: Rectangle {
        implicitHeight: 50
        implicitWidth: 50
        color: "red"
        border.width: 1
    }
}

ListView non può essere il più appropriato contenitore per questo compito. Dico questo perché ha un built in ScrollView e altri comportamenti che suoni come non è necessario. Se tutto ciò che serve è una semplice riga di una qualche misura identica delegati, sono d'accordo con scopchanov e credo che un Repeater all'interno di un RowLayout sarebbe l'opzione migliore. Ecco un semplice esempio:

RowLayout {
    width: 500

    Repeater {
        model: 6
        delegate: Rectangle {
            implicitHeight: 50
            implicitWidth: 50
            color: "tomato"
            border.width: 1
            Layout.alignment: Qt.AlignHCenter // must be set to align the rectangles within their empty space
        }
    }
}

Si può notare che questo presenta lacune a destra e a sinistra, se queste lacune sono inaccettabili, potrebbe essere necessario impostare il spacing sul RowLayout allo stesso modo il ListView esempio invece.

QML Listview spazio gli elementi per riempire la larghezza

Domanda

Migliore risposta

In altre lingue

Questa pagina è in altre lingue

Popolare in questa categoria

Domande popolari in questa categoria