Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Found interesting problem with childrenRect.height or childrenRect in general.
Forum Updated to NodeBB v4.3 + New Features

Found interesting problem with childrenRect.height or childrenRect in general.

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
6 Posts 2 Posters 1.1k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • fcarneyF Offline
    fcarneyF Offline
    fcarney
    wrote on last edited by
    #1

    Apparently childrenRect does not get updated when deleting children and I think it is a Column within a Column where this occurs, but I cannot be sure. I noticed this when I was creating QQuickItems in C++. I thought I might be missing a call or signal. However it turns out I can reproduce this in QML only.

    import QtQuick 2.12
    import QtQuick.Window 2.12
    import QtQuick.Controls 2.12
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Column Resize Testing")
    
        Component {
            id: dynamic_item
    
            Rectangle {
                width: text.width
                height: text.height
    
                color: "yellow"
    
                Text {
                    id: text
                    text: "text info"
                }
            }
        }
    
        function create_dynamic_item(){
            dynamic_item.createObject(resized_subcolumn, {x: 20, y: 100});
        }
        function deleteall_dynamic_items(){
            var index
            console.log(resized_subcolumn.children)
            console.log(resized_subcolumn.children.length)
            for(index=0; index<resized_subcolumn.children.length; ++index){
                console.log("deleting:",index, resized_subcolumn.children[index])
                var child = resized_subcolumn.children[index]
                child.destroy(100)
            }
            console.log(resized_subcolumn.children.length)
        }
    
        Column {
            Button {
                height: 20
                width: 100
                text: "add item"
    
                onClicked: {
                    create_dynamic_item()
                }
            }
            Button {
                height: 20
                width: 100
                text: "remove items"
    
                onClicked: {
                    deleteall_dynamic_items()
                }
            }
    
            Item {
                id: resized_parent
    
                width: 200
                //height: resized_column.height
                height: childrenRect.height
    
                onHeightChanged: {
                    console.log(height)
                }
    
                Rectangle {
                    anchors.fill: parent
    
                    color: "blue"
                }
    
                Column {
                    id: resized_column
    
                    Text {
                        //width: 100
                        height: 20
                        text: "dynamic items:"
                    }
    
                    Column {
                        id: resized_subcolumn
                    }
                }
            }
        }
    }
    

    Has anyone else dealt with this? Is there something obvious missing here?

    The solution is to use the height of the column and only have the column as a child of the item.

    C++ is a perfectly valid school of magic.

    1 Reply Last reply
    0
    • GrecKoG Offline
      GrecKoG Offline
      GrecKo
      Qt Champions 2018
      wrote on last edited by
      #2

      I've never had the need to use childrenRect.

      In your case use height: resized_column.implicitHeight for your resized_parent.

      Also don't manage manually the instanciation of dynamic objects with Component.createObject

      Use a model with a ListView or Column + Repeater.

      I've rewrote your code to something I prefer :

      import QtQuick 2.12
      import QtQuick.Window 2.12
      import QtQuick.Controls 2.12
      
      Window {
          visible: true
          width: 640
          height: 480
          title: qsTr("Column Resize Testing")
      
          ListModel {
              id: listModel
          }
      
          Column {
              Button {
                  text: "add item"
                  onClicked: listModel.append({})
              }
              Button {
                  text: "remove items"
                  onClicked: listModel.clear()
              }
      
              Rectangle {
                  width: 200
                  height: column.implicitHeight
                  color: "blue"
                  onHeightChanged: console.log(height)
                  Column {
                      id: column
                      anchors.fill: parent
                      spacing: 5
                      Text {
                          text: "dynamic items:"
                          color: "white"
                          padding: 8
                      }
                      Repeater {
                          model: listModel
                          delegate: Rectangle {
                              width: text.implicitWidth
                              height: text.implicitHeight
                              x: 20
                              color: "yellow"
                              Text {
                                  id: text
                                  text: "text info"
                                  padding: 8
                              }
                          }
                      }
                  }
              }
          }
      }
      
      fcarneyF 1 Reply Last reply
      2
      • fcarneyF Offline
        fcarneyF Offline
        fcarney
        wrote on last edited by
        #3

        The code I posted just shows the problem. The actual code I had issues with was creating QtQuickItems in C++ and managing the lifetime in C++. I created the above code to illustrate the resize problem. Which is related to childrenRect not getting updated.

        Your code is very interesting though. I will have to play with it to understand what it is doing. Thanks!

        C++ is a perfectly valid school of magic.

        GrecKoG 1 Reply Last reply
        0
        • GrecKoG GrecKo

          I've never had the need to use childrenRect.

          In your case use height: resized_column.implicitHeight for your resized_parent.

          Also don't manage manually the instanciation of dynamic objects with Component.createObject

          Use a model with a ListView or Column + Repeater.

          I've rewrote your code to something I prefer :

          import QtQuick 2.12
          import QtQuick.Window 2.12
          import QtQuick.Controls 2.12
          
          Window {
              visible: true
              width: 640
              height: 480
              title: qsTr("Column Resize Testing")
          
              ListModel {
                  id: listModel
              }
          
              Column {
                  Button {
                      text: "add item"
                      onClicked: listModel.append({})
                  }
                  Button {
                      text: "remove items"
                      onClicked: listModel.clear()
                  }
          
                  Rectangle {
                      width: 200
                      height: column.implicitHeight
                      color: "blue"
                      onHeightChanged: console.log(height)
                      Column {
                          id: column
                          anchors.fill: parent
                          spacing: 5
                          Text {
                              text: "dynamic items:"
                              color: "white"
                              padding: 8
                          }
                          Repeater {
                              model: listModel
                              delegate: Rectangle {
                                  width: text.implicitWidth
                                  height: text.implicitHeight
                                  x: 20
                                  color: "yellow"
                                  Text {
                                      id: text
                                      text: "text info"
                                      padding: 8
                                  }
                              }
                          }
                      }
                  }
              }
          }
          
          fcarneyF Offline
          fcarneyF Offline
          fcarney
          wrote on last edited by fcarney
          #4

          @GrecKo What about instancing Windows? I have been using createObject to create custom dialogs.

          C++ is a perfectly valid school of magic.

          1 Reply Last reply
          0
          • fcarneyF fcarney

            The code I posted just shows the problem. The actual code I had issues with was creating QtQuickItems in C++ and managing the lifetime in C++. I created the above code to illustrate the resize problem. Which is related to childrenRect not getting updated.

            Your code is very interesting though. I will have to play with it to understand what it is doing. Thanks!

            GrecKoG Offline
            GrecKoG Offline
            GrecKo
            Qt Champions 2018
            wrote on last edited by GrecKo
            #5

            The code I posted just shows the problem. The actual code I had issues with was creating QtQuickItems in C++ and managing the lifetime in C++.

            Don't do that, expose a model with your data in C++ and handle it in QML (with views, repeater, ...). Still, you should not really use childrenRect.

            @fcarney said in Found interesting problem with childrenRect.height or childrenRect in general.:

            @GrecKo What about instancing Windows? I have been using createObject to create custom dialogs.

            For instantiating non-Item from a model, you can use Instantiator.
            Component {} and createObject may be used when reacting to a signal, for example for displaying a popup when an error occured.

            Don't create QtQuick stuff from C++, just expose your data and signals / slots.

            fcarneyF 1 Reply Last reply
            0
            • GrecKoG GrecKo

              The code I posted just shows the problem. The actual code I had issues with was creating QtQuickItems in C++ and managing the lifetime in C++.

              Don't do that, expose a model with your data in C++ and handle it in QML (with views, repeater, ...). Still, you should not really use childrenRect.

              @fcarney said in Found interesting problem with childrenRect.height or childrenRect in general.:

              @GrecKo What about instancing Windows? I have been using createObject to create custom dialogs.

              For instantiating non-Item from a model, you can use Instantiator.
              Component {} and createObject may be used when reacting to a signal, for example for displaying a popup when an error occured.

              Don't create QtQuick stuff from C++, just expose your data and signals / slots.

              fcarneyF Offline
              fcarneyF Offline
              fcarney
              wrote on last edited by
              #6

              @GrecKo I don't understand this. I have tried to use the TreeView from controls 1 and it will not do what I want. I don't see how I can make a tree view type control using repeaters. There are a lot of things quick will not do that I have to do in C++.

              C++ is a perfectly valid school of magic.

              1 Reply Last reply
              0

              • Login

              • Login or register to search.
              • First post
                Last post
              0
              • Categories
              • Recent
              • Tags
              • Popular
              • Users
              • Groups
              • Search
              • Get Qt Extensions
              • Unsolved