<div dir="ltr">I'm reparenting a TextArea into a ScrollView - somewhat unsuccessfully, because the said ScrollView then refuses to scroll.<br><br>What is the right way to go about it? I've stripped the problem down to a small, reproducible usecase here: <a href="https://transfer.sh/rYfth/dodgy-scrollview.zip" target="_blank">https://transfer.sh/rYfth/dodgy-scrollview.zip</a><br><br><div>And here is the qml file inside that zip in full. I was told that '<code class="gmail-m_6271644861649278711gmail-language-js gmail-m_6271644861649278711gmail-hljs gmail-m_6271644861649278711gmail-javascript">parent: <code class="gmail-m_6271644861649278711gmail-hljs gmail-m_6271644861649278711gmail-css">addResourceScrollView</code></code><code class="gmail-m_6271644861649278711gmail-language-js gmail-m_6271644861649278711gmail-hljs gmail-m_6271644861649278711gmail-javascript"><code class="gmail-m_6271644861649278711gmail-hljs gmail-m_6271644861649278711gmail-css">'<span style="font-family:times new roman,serif"> <span style="font-family:arial,sans-serif">is the issue, but changing </span></span><span style="font-family:arial,sans-serif">that just lead to a host of issues that lead down a rabbit hole.</span><br></code></code></div><div><br></div><div><pre class="m_6271644861649278711gmail-markdown-highlight"><code class="m_6271644861649278711gmail-language-js m_6271644861649278711gmail-hljs m_6271644861649278711gmail-javascript"><span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick <span class="m_6271644861649278711gmail-hljs-number">2.7</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Controls <span class="m_6271644861649278711gmail-hljs-number">2.5</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Controls.Material <span class="m_6271644861649278711gmail-hljs-number">2.0</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Window <span class="m_6271644861649278711gmail-hljs-number">2.10</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Controls.Universal <span class="m_6271644861649278711gmail-hljs-number">2.12</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Layouts <span class="m_6271644861649278711gmail-hljs-number">1.12</span>
<span class="m_6271644861649278711gmail-hljs-keyword">import</span> QtQuick.Dialogs <span class="m_6271644861649278711gmail-hljs-number">1.3</span>

ApplicationWindow {
    id: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>
    visible: <span class="m_6271644861649278711gmail-hljs-literal">true</span>
    width: <span class="m_6271644861649278711gmail-hljs-number">640</span>; height: <span class="m_6271644861649278711gmail-hljs-number">480</span>
    minimumWidth: <span class="m_6271644861649278711gmail-hljs-number">550</span>; minimumHeight: <span class="m_6271644861649278711gmail-hljs-number">300</span>
    title: qsTr(<span class="m_6271644861649278711gmail-hljs-string">"Hammer"</span>)

    Page {
        id: addResourcesPage
        width: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>.width
        height: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>.height - buttonsRow.height


        ScrollView {
            id: addResourceScrollView
            height: parent.height; width: parent.width;
            visible: textArea.state === <span class="m_6271644861649278711gmail-hljs-string">"EXPANDED"</span>
            clip: <span class="m_6271644861649278711gmail-hljs-literal">true</span>

            onContentHeightChanged: <span class="m_6271644861649278711gmail-hljs-built_in">console</span>.log(<span class="m_6271644861649278711gmail-hljs-string">`content height changed`</span>)
            onContentChildrenChanged: <span class="m_6271644861649278711gmail-hljs-built_in">console</span>.log(<span class="m_6271644861649278711gmail-hljs-string">`children changed; now have: <span class="m_6271644861649278711gmail-hljs-subst">${children.length}</span>`</span>)
            onChildrenRectChanged: <span class="m_6271644861649278711gmail-hljs-built_in">console</span>.log(<span class="m_6271644861649278711gmail-hljs-string">`children rect changed`</span>)
        }

        Label {
            id: hammerLabel
            anchors.horizontalCenter: parent.horizontalCenter
            y: <span class="m_6271644861649278711gmail-hljs-number">120</span>
            text: qsTr(<span class="m_6271644861649278711gmail-hljs-string">"🔨 Hammer"</span>)
            font.bold: <span class="m_6271644861649278711gmail-hljs-literal">true</span>
            opacity: <span class="m_6271644861649278711gmail-hljs-number">0.6</span>
            font.pointSize: <span class="m_6271644861649278711gmail-hljs-number">36</span>
            font.family: <span class="m_6271644861649278711gmail-hljs-string">"Apple Color Emoji"</span>
            visible: textArea.state === <span class="m_6271644861649278711gmail-hljs-string">"MINIMAL"</span>
        }

        Row {
            id: loadResourcesRow
            y: hammerLabel.y + <span class="m_6271644861649278711gmail-hljs-number">80</span>
            anchors.horizontalCenter: parent.horizontalCenter
            spacing: <span class="m_6271644861649278711gmail-hljs-number">10</span>

            Button {
                id: loadResourceButton
                text: qsTr(<span class="m_6271644861649278711gmail-hljs-string">"Button"</span>)
                visible: textArea.state === <span class="m_6271644861649278711gmail-hljs-string">"MINIMAL"</span>
            }

            TextArea {
                id: textArea
                placeholderText: qsTr(<span class="m_6271644861649278711gmail-hljs-string">"or load it here"</span>)
                renderType: Text.NativeRendering
                <span class="m_6271644861649278711gmail-hljs-comment">// ensure the tooltip isn't monospace, only the text</span>
                font.family: text ? <span class="m_6271644861649278711gmail-hljs-string">"Ubuntu Mono"</span> : <span class="m_6271644861649278711gmail-hljs-string">"Ubuntu"</span>
                selectByMouse: <span class="m_6271644861649278711gmail-hljs-literal">true</span>
                wrapMode: <span class="m_6271644861649278711gmail-hljs-string">"WrapAtWordBoundaryOrAnywhere"</span>

                <span class="m_6271644861649278711gmail-hljs-comment">// ensure focus remains when the area is reparented</span>
                onWidthChanged: textArea.forceActiveFocus()
                <span class="m_6271644861649278711gmail-hljs-comment">// it doesn't have focus on startup</span>
                Component.onCompleted: textArea.focus = <span class="m_6271644861649278711gmail-hljs-literal">false</span>

                states: [
                    State {
                        name: <span class="m_6271644861649278711gmail-hljs-string">"MINIMAL"</span>; when: !textArea.text
                        ParentChange {
                            target: textArea
                            parent: loadResourcesRow
                            width: <span class="m_6271644861649278711gmail-hljs-number">300</span>
                            height: <span class="m_6271644861649278711gmail-hljs-literal">undefined</span>
                        }
                    },
                    State {
                        name: <span class="m_6271644861649278711gmail-hljs-string">"EXPANDED"</span>; when: textArea.text
                        ParentChange {
                            target: textArea
                            parent: <code class="m_6271644861649278711gmail-hljs m_6271644861649278711gmail-css">addResourceScrollView</code>
                            x: <span class="m_6271644861649278711gmail-hljs-number">0</span>; y: <span class="m_6271644861649278711gmail-hljs-number">0</span>
                            width: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>.width
                            height: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>.height
                        }
                    }
                ]
                state: <span class="m_6271644861649278711gmail-hljs-string">"MINIMAL"</span>

                transitions: Transition {
                    ParentAnimation {
                        NumberAnimation { properties: <span class="m_6271644861649278711gmail-hljs-string">"x,y,width,height"</span>;  easing.type: Easing.InCubic; duration: <span class="m_6271644861649278711gmail-hljs-number">600</span> }
                    }
                }
            }

        }

        Text {
            id: experimentalText
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            text: qsTr(<span class="m_6271644861649278711gmail-hljs-string">"Experimental"</span>)
            enabled: <span class="m_6271644861649278711gmail-hljs-literal">false</span>
            z: <span class="m_6271644861649278711gmail-hljs-number">0</span>
            rotation: <span class="m_6271644861649278711gmail-hljs-number">-45</span>
            opacity: <span class="m_6271644861649278711gmail-hljs-number">0.1</span>
            font.pixelSize: <span class="m_6271644861649278711gmail-hljs-number">96</span>
        }

    }

    RowLayout {
        id: buttonsRow
        x: <span class="m_6271644861649278711gmail-hljs-number">0</span>
        y: parent.height - height
        width: <span class="m_6271644861649278711gmail-hljs-built_in">window</span>.width

        Button {
            id: settingsButton
            text: <span class="m_6271644861649278711gmail-hljs-string">"☰"</span>

            onClicked: addResourcesPage.state = <span class="m_6271644861649278711gmail-hljs-string">"EDITING_SETTINGS"</span>
        }

        Button {
            id: actionButton
            text: <span class="m_6271644861649278711gmail-hljs-string">"stuff"</span>
            visible: textArea.text || addResourcesPage.state === <span class="m_6271644861649278711gmail-hljs-string">"EDITING_SETTINGS"</span>
            Layout.fillWidth: <span class="m_6271644861649278711gmail-hljs-literal">true</span>
        }
    }
}</code></pre></div></div>