Solved QML ListView with Variable Height Delegate

[scotryder]

Hi there,

I tried all day but kept failing miserably to design a variable item height delegate for QML based ListView.
I want to make a Facebook Newsfeed like item delegate which has its height based on its content.

I started with column layout but failed.

Please advise how should i approach this.

Thanks

[scotryder]

Here is the delegate diagram in my mind, as you can see item has to be variable height size so if title text take 2 or 3 or more lines it increases height automatically.

So looking at this, please advise how should i proceed with layout, thanks

[GrecKo]

Show your code.

It's pretty straightforward to do it with a ColumnLayout or Column as the root of your delegate.

[scotryder]

Thanks for the help :)
So i'm currently using following code and when i go to Design View its still not word wraping and resizing height.

import QtQuick 2.0
import QtQuick.Layouts 1.3

ColumnLayout{

    id: delegate
    width: 400
    spacing: 8

    Text {
        id: descriptionText

        text: qsTr("Qt 5.7 is an application development framework that provides a great user experience and develops full-capability applications with Qt Widgets, QML, and even Qt 3D.

This book will address challenges in successfully developing cross-platform applications with the Qt framework. Cross-platform development needs a well-organized project. Using this book, you will have a better understanding of the Qt framework and the tools to resolve serious issues such as linking, debugging, and multithreading. Your journey will start with the new Qt 5 features. Then you will explore different platforms and learn to tame them. Every chapter along the way is a logical step that you must take to master Qt. The journey will end in an application that has been tested and is ready to be shipped.")


        width: parent.width
        wrapMode: Text.WordWrap
        font.pixelSize: 14
        textFormat: Text.StyledText
        horizontalAlignment: Qt.AlignLeft
    }

}