Qt/QML: WebEngineView adjusting height

Question

I have a bunch of WebEngineViews in a ListView. For example:

ListView 
{
    model: myModel
    delegate: Component 
    {
        Item 
        {
            WebEngineView 
            {
                id: myWebView
                Component.onCompleted: loadHtml(model.modelData.htmlText, baseURL)
            }
        }
    }
}

How can I adjust the height of the Item once the html is loaded? The HTML in question may include images, so I want to resize the WebEngineView once everything is loaded. I suspect I can do something like:

ListView 
{
    model: myModel
    delegate: Component 
    {
        Item 
        {
            WebEngineView 
            {
                id: myWebView
                Component.onCompleted: loadHtml(model.modelData.htmlText, baseURL)
                onLoadingChanged: 
                { 
                    if (!loading && loadRequest.status == WebEngineView.LoadSucceededStatus)
                    {
                        height = ???? 
                    }
                }
            }
        }
    }
}

But I'm not sure to what I should set height.

Assign to what value? Anyway you should set size to parent item since now its height/width is zero and so set achors.fill: parent to myWebView. Btw, Item is excessive here. — folibis
Just a small sidenote: to wrap the WebEngineView inside a Component is completely unnecessary in your case. I can't se any reason to wrap it in an Item either (unless WebEngineView is no Item itself, and therefore might not be used as delegate?) — derM
Thank you for the suggestion about removing Item. It's probably excessive in this example but in my actual code I have other objects inside the delegate. I will update the question to better reflect what I'm trying to do. — Addy
I have not tried it, but you might be looking for contentSize — derM

Addy Addy · Accepted Answer · 2017-03-23T23:16:22

I was able to do what I wanted with `onContentsSizeChaged' like so:

ListView 
{
    model: myModel
    delegate: Component 
    {
        Item 
        {
            WebEngineView 
            {
                id: myWebView
                Component.onCompleted: loadHtml(model.modelData.htmlText, baseURL)

                onContentsSizeChanged:
                {
                    myWebView.height = contentsSize.height;
                }
            }
        }
    }
}

Qt/QML: WebEngineView adjusting height

1 Answers