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. Window resize problem
Forum Updated to NodeBB v4.3 + New Features

Window resize problem

Scheduled Pinned Locked Moved Solved QML and Qt Quick
20 Posts 6 Posters 1.5k 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.
  • JonBJ JonB

    @Vijaykarthikeyan
    So in response to @SGaist's request for a "bare minimum" you have copied and pasted what you had already posted, right?

    V Offline
    V Offline
    Vijaykarthikeyan
    wrote on last edited by
    #7

    @JonB No..wrong..reduced the code to the atmost minimum..beyond that,you can't get the code structure correct..defining 2 rectangles..defining swapping function..called it in both rectangles..Besides that,how could one reduce as much as it is?

    JonBJ 1 Reply Last reply
    0
    • V Vijaykarthikeyan

      @JonB No..wrong..reduced the code to the atmost minimum..beyond that,you can't get the code structure correct..defining 2 rectangles..defining swapping function..called it in both rectangles..Besides that,how could one reduce as much as it is?

      JonBJ Offline
      JonBJ Offline
      JonB
      wrote on last edited by
      #8

      @Vijaykarthikeyan
      So I was wrong even though I compared the two, they were within one line of each other and the only difference I could see was the removal one one already commented-out line? And all those lines are required, without reducing it the problem does not happen?

      Anyway, good luck, perhaps someone will accept this.

      V 1 Reply Last reply
      0
      • JonBJ JonB

        @Vijaykarthikeyan
        So I was wrong even though I compared the two, they were within one line of each other and the only difference I could see was the removal one one already commented-out line? And all those lines are required, without reducing it the problem does not happen?

        Anyway, good luck, perhaps someone will accept this.

        V Offline
        V Offline
        Vijaykarthikeyan
        wrote on last edited by
        #9

        @JonB If Even I gave you your desired example. are you guys would help me? No..it is never going to happen since it was never happened before. I sorted out the problems on my own throughout these days. you guys only came here to find out the non-important errors claiming those are the essential one and blaming me to go and study go and study, go and study.

        JonBJ B 3 Replies Last reply
        0
        • V Vijaykarthikeyan

          @JonB If Even I gave you your desired example. are you guys would help me? No..it is never going to happen since it was never happened before. I sorted out the problems on my own throughout these days. you guys only came here to find out the non-important errors claiming those are the essential one and blaming me to go and study go and study, go and study.

          JonBJ Offline
          JonBJ Offline
          JonB
          wrote on last edited by
          #10

          @Vijaykarthikeyan
          Yes, you say the same each time. Everybody here is bad. Not much point asking if you never get any useful help and sort it out yourself.

          V 1 Reply Last reply
          0
          • V Vijaykarthikeyan

            @JonB If Even I gave you your desired example. are you guys would help me? No..it is never going to happen since it was never happened before. I sorted out the problems on my own throughout these days. you guys only came here to find out the non-important errors claiming those are the essential one and blaming me to go and study go and study, go and study.

            B Offline
            B Offline
            Bob64
            wrote on last edited by
            #11

            @Vijaykarthikeyan it's not a very active forum. There are only a couple of real experts who hang out here and I imagine they are busy. Unless an answer is obvious or you make it really easy to reproduce a problem - i.e. by providing a small example which can be run easily - it is unlikely that you will get a lot of help.

            I have asked a few questions here that have gone unanswered. That's the way it is. Nobody owes me anything.

            V 1 Reply Last reply
            0
            • V Vijaykarthikeyan

              @JonB If Even I gave you your desired example. are you guys would help me? No..it is never going to happen since it was never happened before. I sorted out the problems on my own throughout these days. you guys only came here to find out the non-important errors claiming those are the essential one and blaming me to go and study go and study, go and study.

              JonBJ Offline
              JonBJ Offline
              JonB
              wrote on last edited by
              #12

              @Vijaykarthikeyan
              Intended as a constructive suggestion: if you are not happy with the answers here, maybe post a question to https://stackoverflow.com/ ? If you get an answer there they tend to be more "formal", perhaps will give you a solution in the form you would like.

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

                Here's a screenshot of what I have when running your code : f47432c5-7371-46b1-8589-2ef114998f41-image.png

                Not really self explanatory. Why is it 100 lines long to swap 2 items?
                It also refers to variable not declared, root, map_x, map_y.

                Your original question is not very clear, next time you might want to include a visual schema of what you want, it will be easier to understand.

                Anyway, here's what I would do if I understood correctly what you want:

                import QtQuick 2.15
                import QtQuick.Window 2.15
                
                Window {
                    id: root
                
                    width: 640
                    height: 480
                    visible: true
                
                    property bool graphInCorner: true
                
                    Rectangle {
                        id: fullContainer
                        width: parent.width
                        height: parent.height
                        border.width: 1
                    }
                
                    Rectangle {
                        id: cornerContainer
                        width: 0.18 * parent.width
                        height: 0.24 * parent.height
                        border.width: 1
                    }
                    Text {
                        parent: root.graphInCorner ? fullContainer : cornerContainer
                        anchors.fill: parent
                        text: "MAP"
                        horizontalAlignment: Text.AlignHCenter
                        verticalAlignment: Text.AlignVCenter
                        MouseArea {
                            anchors.fill: parent
                            onClicked: root.graphInCorner = !root.graphInCorner
                        }
                    }
                    Text {
                        parent: root.graphInCorner ? cornerContainer : fullContainer
                        anchors.fill: parent
                        text: "GRAPH"
                        horizontalAlignment: Text.AlignHCenter
                        verticalAlignment: Text.AlignVCenter
                        MouseArea {
                            anchors.fill: parent
                            onClicked: root.graphInCorner = !root.graphInCorner
                        }
                    }
                }
                

                Have two container parents and swap the parent of the graph and map items to one of those.

                V 3 Replies Last reply
                3
                • GrecKoG GrecKo

                  Here's a screenshot of what I have when running your code : f47432c5-7371-46b1-8589-2ef114998f41-image.png

                  Not really self explanatory. Why is it 100 lines long to swap 2 items?
                  It also refers to variable not declared, root, map_x, map_y.

                  Your original question is not very clear, next time you might want to include a visual schema of what you want, it will be easier to understand.

                  Anyway, here's what I would do if I understood correctly what you want:

                  import QtQuick 2.15
                  import QtQuick.Window 2.15
                  
                  Window {
                      id: root
                  
                      width: 640
                      height: 480
                      visible: true
                  
                      property bool graphInCorner: true
                  
                      Rectangle {
                          id: fullContainer
                          width: parent.width
                          height: parent.height
                          border.width: 1
                      }
                  
                      Rectangle {
                          id: cornerContainer
                          width: 0.18 * parent.width
                          height: 0.24 * parent.height
                          border.width: 1
                      }
                      Text {
                          parent: root.graphInCorner ? fullContainer : cornerContainer
                          anchors.fill: parent
                          text: "MAP"
                          horizontalAlignment: Text.AlignHCenter
                          verticalAlignment: Text.AlignVCenter
                          MouseArea {
                              anchors.fill: parent
                              onClicked: root.graphInCorner = !root.graphInCorner
                          }
                      }
                      Text {
                          parent: root.graphInCorner ? cornerContainer : fullContainer
                          anchors.fill: parent
                          text: "GRAPH"
                          horizontalAlignment: Text.AlignHCenter
                          verticalAlignment: Text.AlignVCenter
                          MouseArea {
                              anchors.fill: parent
                              onClicked: root.graphInCorner = !root.graphInCorner
                          }
                      }
                  }
                  

                  Have two container parents and swap the parent of the graph and map items to one of those.

                  V Offline
                  V Offline
                  Vijaykarthikeyan
                  wrote on last edited by
                  #14

                  @GrecKo understood..can i have some question

                  1 Reply Last reply
                  0
                  • JonBJ JonB

                    @Vijaykarthikeyan
                    Yes, you say the same each time. Everybody here is bad. Not much point asking if you never get any useful help and sort it out yourself.

                    V Offline
                    V Offline
                    Vijaykarthikeyan
                    wrote on last edited by
                    #15

                    @JonB Whenever I asking any doubt,at the end of the day,the intend of the topic diverted as off your desire. Then.what's the purpose of asking question? When I came here for one small doubt, you guys totally diverting it to somewhere which is not important,indeed not relevant to the topic, finally leads to find the solution on my own

                    1 Reply Last reply
                    0
                    • B Bob64

                      @Vijaykarthikeyan it's not a very active forum. There are only a couple of real experts who hang out here and I imagine they are busy. Unless an answer is obvious or you make it really easy to reproduce a problem - i.e. by providing a small example which can be run easily - it is unlikely that you will get a lot of help.

                      I have asked a few questions here that have gone unanswered. That's the way it is. Nobody owes me anything.

                      V Offline
                      V Offline
                      Vijaykarthikeyan
                      wrote on last edited by
                      #16

                      @Bob64 I ready to give anything the speakers need to see..Perhaps,they are totally diverting the intent of the question. If I gave a code snippet,they didn't tell me to repost it or correct it but always insulting the needy like go and study the documrentation, go and study the documentation.. I go through the documentation many times before coming here, If the solution was there,why should I coming here to clear my doubt?

                      1 Reply Last reply
                      0
                      • GrecKoG GrecKo

                        Here's a screenshot of what I have when running your code : f47432c5-7371-46b1-8589-2ef114998f41-image.png

                        Not really self explanatory. Why is it 100 lines long to swap 2 items?
                        It also refers to variable not declared, root, map_x, map_y.

                        Your original question is not very clear, next time you might want to include a visual schema of what you want, it will be easier to understand.

                        Anyway, here's what I would do if I understood correctly what you want:

                        import QtQuick 2.15
                        import QtQuick.Window 2.15
                        
                        Window {
                            id: root
                        
                            width: 640
                            height: 480
                            visible: true
                        
                            property bool graphInCorner: true
                        
                            Rectangle {
                                id: fullContainer
                                width: parent.width
                                height: parent.height
                                border.width: 1
                            }
                        
                            Rectangle {
                                id: cornerContainer
                                width: 0.18 * parent.width
                                height: 0.24 * parent.height
                                border.width: 1
                            }
                            Text {
                                parent: root.graphInCorner ? fullContainer : cornerContainer
                                anchors.fill: parent
                                text: "MAP"
                                horizontalAlignment: Text.AlignHCenter
                                verticalAlignment: Text.AlignVCenter
                                MouseArea {
                                    anchors.fill: parent
                                    onClicked: root.graphInCorner = !root.graphInCorner
                                }
                            }
                            Text {
                                parent: root.graphInCorner ? cornerContainer : fullContainer
                                anchors.fill: parent
                                text: "GRAPH"
                                horizontalAlignment: Text.AlignHCenter
                                verticalAlignment: Text.AlignVCenter
                                MouseArea {
                                    anchors.fill: parent
                                    onClicked: root.graphInCorner = !root.graphInCorner
                                }
                            }
                        }
                        

                        Have two container parents and swap the parent of the graph and map items to one of those.

                        V Offline
                        V Offline
                        Vijaykarthikeyan
                        wrote on last edited by
                        #17

                        @GrecKo That is because of the relative positioning.These 2 components should swap with respect to the 3rd element in 3 different positions. each of these 3 components have 2 positions so,6 different fucntions are needed according to the positions

                        1 Reply Last reply
                        0
                        • GrecKoG GrecKo

                          Here's a screenshot of what I have when running your code : f47432c5-7371-46b1-8589-2ef114998f41-image.png

                          Not really self explanatory. Why is it 100 lines long to swap 2 items?
                          It also refers to variable not declared, root, map_x, map_y.

                          Your original question is not very clear, next time you might want to include a visual schema of what you want, it will be easier to understand.

                          Anyway, here's what I would do if I understood correctly what you want:

                          import QtQuick 2.15
                          import QtQuick.Window 2.15
                          
                          Window {
                              id: root
                          
                              width: 640
                              height: 480
                              visible: true
                          
                              property bool graphInCorner: true
                          
                              Rectangle {
                                  id: fullContainer
                                  width: parent.width
                                  height: parent.height
                                  border.width: 1
                              }
                          
                              Rectangle {
                                  id: cornerContainer
                                  width: 0.18 * parent.width
                                  height: 0.24 * parent.height
                                  border.width: 1
                              }
                              Text {
                                  parent: root.graphInCorner ? fullContainer : cornerContainer
                                  anchors.fill: parent
                                  text: "MAP"
                                  horizontalAlignment: Text.AlignHCenter
                                  verticalAlignment: Text.AlignVCenter
                                  MouseArea {
                                      anchors.fill: parent
                                      onClicked: root.graphInCorner = !root.graphInCorner
                                  }
                              }
                              Text {
                                  parent: root.graphInCorner ? cornerContainer : fullContainer
                                  anchors.fill: parent
                                  text: "GRAPH"
                                  horizontalAlignment: Text.AlignHCenter
                                  verticalAlignment: Text.AlignVCenter
                                  MouseArea {
                                      anchors.fill: parent
                                      onClicked: root.graphInCorner = !root.graphInCorner
                                  }
                              }
                          }
                          

                          Have two container parents and swap the parent of the graph and map items to one of those.

                          V Offline
                          V Offline
                          Vijaykarthikeyan
                          wrote on last edited by
                          #18

                          @GrecKo Untitled.png

                          As I explained the reason why I used a lot of lines for swapping ,this is the picture of what i want to achieve. Actually, these are the 3 components..each have to swap from their respective position to fill the window. But,their sizes and positions should be dynamically attached with the window for any resolution. So,according to the logics, the swapping must be bigger.

                          And in my updtaed swapping,there are only 10-15 lines of code for swappuing and it works..no issue with that

                          L 1 Reply Last reply
                          0
                          • V Vijaykarthikeyan

                            @GrecKo Untitled.png

                            As I explained the reason why I used a lot of lines for swapping ,this is the picture of what i want to achieve. Actually, these are the 3 components..each have to swap from their respective position to fill the window. But,their sizes and positions should be dynamically attached with the window for any resolution. So,according to the logics, the swapping must be bigger.

                            And in my updtaed swapping,there are only 10-15 lines of code for swappuing and it works..no issue with that

                            L Offline
                            L Offline
                            lemons
                            wrote on last edited by lemons
                            #19

                            @Vijaykarthikeyan
                            Instead of using x and y coordinates, I would place 3 of the same objects into the view and align them according to what you want in the end. Here you should apply all resizing and alignment constrains, so that they represent the final "wrapper" of your different views, which resize automatically with window changes.

                            Then add your components as children to those 3 objects. As each of your components now has the same type of parent object, you can simply swap the parents.

                            Here a very basic example of what I understood from your question.
                            Note: I would use anchors and layouts, so all resizing is managed automatically.

                            ApplicationWindow {
                                width: 860
                                height: 640
                                visible: true
                            
                                // switch parents
                                function switchParents(item1, item2) {
                                    let temp = item1.parent
                                    item1.parent = item2.parent
                                    item2.parent = temp
                                }
                            
                                // full screen view
                                // note: main view should use the same parent object as mini views
                                // to swap parents without issues
                                // in this example "ColumnLayout"
                                ColumnLayout {
                                    id: viewManager
                                    anchors.fill: parent
                                    Rectangle {
                                        id: map
                                        Layout.fillWidth: true
                                        Layout.fillHeight: true
                                        color: "red"
                                        Text {
                                            anchors.centerIn: parent
                                            text: "Map"
                                        }
                                        MouseArea {
                                            anchors.fill: parent
                                            onClicked: {
                                                switchParents(parent, viewManager.children[0])
                                            }
                                        }
                                    }
                                }
                                // mini views
                                Item {
                                    id: miniViews
                                    anchors.right: parent.right
                                    anchors.bottom: parent.bottom
                                    // adjust to your liking
                                    height: parent.height * 2 / 3
                                    width: height < 250 ? parent.width / 2 : parent.width / 4
                                    // use gridlayout to easily switch between vertical and horizontal
                                    // alignment of mini views
                                    GridLayout {
                                        anchors.fill: parent
                                        anchors.margins: 20
                                        // make the miniviews be shown next to each other
                                        // if the height is smaller than a breakpoint
                                        columns: height >= 250 ? 1 : 2
                                        columnSpacing: 20
                                        rowSpacing: 20
                                        ColumnLayout {
                                            Layout.fillWidth: true
                                            Layout.fillHeight: true
                                            Rectangle {
                                                id: cam
                                                color: "green"
                                                Layout.fillWidth: true
                                                Layout.fillHeight: true
                                                Text {
                                                    anchors.centerIn: parent
                                                    text: "Cam"
                                                }
                                                MouseArea {
                                                    anchors.fill: parent
                                                    onClicked: {
                                                        switchParents(parent, viewManager.children[0])
                                                    }
                                                }
                                            }
                                        }
                                        ColumnLayout {
                                            Layout.fillWidth: true
                                            Layout.fillHeight: true
                                            Rectangle {
                                                id: graph
                                                color: "yellow"
                                                Layout.fillWidth: true
                                                Layout.fillHeight: true
                                                Text {
                                                    anchors.centerIn: parent
                                                    text: "Graph"
                                                }
                                                MouseArea {
                                                    anchors.fill: parent
                                                    onClicked: {
                                                        switchParents(parent, viewManager.children[0])
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                            
                            V 1 Reply Last reply
                            1
                            • L lemons

                              @Vijaykarthikeyan
                              Instead of using x and y coordinates, I would place 3 of the same objects into the view and align them according to what you want in the end. Here you should apply all resizing and alignment constrains, so that they represent the final "wrapper" of your different views, which resize automatically with window changes.

                              Then add your components as children to those 3 objects. As each of your components now has the same type of parent object, you can simply swap the parents.

                              Here a very basic example of what I understood from your question.
                              Note: I would use anchors and layouts, so all resizing is managed automatically.

                              ApplicationWindow {
                                  width: 860
                                  height: 640
                                  visible: true
                              
                                  // switch parents
                                  function switchParents(item1, item2) {
                                      let temp = item1.parent
                                      item1.parent = item2.parent
                                      item2.parent = temp
                                  }
                              
                                  // full screen view
                                  // note: main view should use the same parent object as mini views
                                  // to swap parents without issues
                                  // in this example "ColumnLayout"
                                  ColumnLayout {
                                      id: viewManager
                                      anchors.fill: parent
                                      Rectangle {
                                          id: map
                                          Layout.fillWidth: true
                                          Layout.fillHeight: true
                                          color: "red"
                                          Text {
                                              anchors.centerIn: parent
                                              text: "Map"
                                          }
                                          MouseArea {
                                              anchors.fill: parent
                                              onClicked: {
                                                  switchParents(parent, viewManager.children[0])
                                              }
                                          }
                                      }
                                  }
                                  // mini views
                                  Item {
                                      id: miniViews
                                      anchors.right: parent.right
                                      anchors.bottom: parent.bottom
                                      // adjust to your liking
                                      height: parent.height * 2 / 3
                                      width: height < 250 ? parent.width / 2 : parent.width / 4
                                      // use gridlayout to easily switch between vertical and horizontal
                                      // alignment of mini views
                                      GridLayout {
                                          anchors.fill: parent
                                          anchors.margins: 20
                                          // make the miniviews be shown next to each other
                                          // if the height is smaller than a breakpoint
                                          columns: height >= 250 ? 1 : 2
                                          columnSpacing: 20
                                          rowSpacing: 20
                                          ColumnLayout {
                                              Layout.fillWidth: true
                                              Layout.fillHeight: true
                                              Rectangle {
                                                  id: cam
                                                  color: "green"
                                                  Layout.fillWidth: true
                                                  Layout.fillHeight: true
                                                  Text {
                                                      anchors.centerIn: parent
                                                      text: "Cam"
                                                  }
                                                  MouseArea {
                                                      anchors.fill: parent
                                                      onClicked: {
                                                          switchParents(parent, viewManager.children[0])
                                                      }
                                                  }
                                              }
                                          }
                                          ColumnLayout {
                                              Layout.fillWidth: true
                                              Layout.fillHeight: true
                                              Rectangle {
                                                  id: graph
                                                  color: "yellow"
                                                  Layout.fillWidth: true
                                                  Layout.fillHeight: true
                                                  Text {
                                                      anchors.centerIn: parent
                                                      text: "Graph"
                                                  }
                                                  MouseArea {
                                                      anchors.fill: parent
                                                      onClicked: {
                                                          switchParents(parent, viewManager.children[0])
                                                      }
                                                  }
                                              }
                                          }
                                      }
                                  }
                              }
                              
                              V Offline
                              V Offline
                              Vijaykarthikeyan
                              wrote on last edited by
                              #20

                              @lemons Thank you for the logic

                              1 Reply Last reply
                              0
                              • V Vijaykarthikeyan has marked this topic as solved on

                              • Login

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