Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Make a gridlayout item fullscreen / full height and width of gridlayout



  • Hey Guys

    I have camera viewer with an GridLayout and Repeater now I try to add a feature that user can double click on a camera and it goes to fullscreen (In the GridLayout).

    Here I strugle, when I try to modify the Repeater Model, other Grid Items eg camera Items are destroyed (Deconstructor is called)
    When I set columns and rows to 1 it has no effect because RowLayout dynamically allign Items.

    I am very new to QML so any help or tips would be great.

    GridLayout  {
       id: cameraViews
       anchors.fill: parent
       columns: 2
       columnSpacing : 1
       rowSpacing : 1
       rows: 2
    
       Repeater {
           model: cameraModel
           id: gridRepeater
           Rectangle {
               id: cameraPane
               property string paneId: model._id
               property string paneName: model.name
               Layout.fillHeight: true
               Layout.fillWidth: true
               color: drager.containsDrag ? "#090B10" : "#0F111A"
               DropArea {
                   id: drager
                   anchors.fill: parent
                   onDropped: function(drop){
                       paneText.text = drop.source.text
                       add_stream(drop.source.camera_id, pane, pane.paneId, drop.source.text)
                   }
                   Text {
                       id: paneText
                       anchors.fill: parent
                       text: pane.paneName
                       verticalAlignment: Text.AlignVCenter
                       horizontalAlignment: Text.AlignHCenter
                       color: "#ffffff"
                   }
               }
               
           }
       }                
    } 
    

    When I double click on the camera
    grid.PNG

    it should look like this
    cam2.PNG



  • After some hour's a found a way todo this.

    Worklfow:

    • DoubleClick on cameraPane (Expand)

    • cameraPane.Layout.preferredWidth and cameraPane.Layout.preferredHeight is set to parent w, h

    • other cameraPane opacity is set to 0

    • DoubleClick on cameraPane (Shrink)

    • cameraPane.Layout.preferredWidth and cameraPane.Layout.preferredHeight is set to 0

    • other cameraPane opacity is set to 1


Log in to reply