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. Make a gridlayout item fullscreen / full height and width of gridlayout
Forum Updated to NodeBB v4.3 + New Features

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

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 743 Views
  • 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.
  • A Offline
    A Offline
    Acs Chris
    wrote on last edited by Acs Chris
    #1

    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

    1 Reply Last reply
    0
    • A Offline
      A Offline
      Acs Chris
      wrote on last edited by
      #2

      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

      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