QtQuick Designer - not aligned in a grid layout

sajis997

Hello forum,

I am trying to follow the presentation hosted by Thomas Hartman that demonstrate the QtQuick Designer. I am creating the following layout( grid layout) using QtQuick Designer:

import QtQuick 2.5

Rectangle
{
    width:400
    height:400
    
    Grid {
        x: 74
        y: 68
        
        Rectangle {
            id: rectangle1
            width: 115
            height: 63
            color: "#a05252"
        }
        
        Rectangle {
            id: rectangle2
            width: 115
            height: 63
            gradient: Gradient {
                GradientStop {
                    position: 0
                    color: "#cd1c1c"
                }
                
                GradientStop {
                    position: 1
                    color: "#000000"
                }
            }
        }
        
        Rectangle {
            id: rectangle3
            width: 115
            height: 63
            color: "#52a056"
        }
        
        Rectangle {
            id: rectangle4
            width: 115
            height: 63
            gradient: Gradient {
                GradientStop {
                    position: 0
                    color: "#33b18e"
                }
                
                GradientStop {
                    position: 1
                    color: "#000000"
                }
            }
        }
    }
}

But in the design mode it shows the following(row layout) instead:

layout confusion

Any idea what is it that I am doing wrong here ?

Thanks

Julian Guarin

What are you trying to accomplish?

It seems right to me ....
The grid starts at 74,68....

Regards!

sajis997

Does it look right to you , the screen-shot I attached ? Does it not look like row layout instead ? I am using Grid layout , not row layout as you can see in the .qml file

Thanks

sajis997

I have declared 4 separate rectangle items and I want to put all of them in grid layout.

sajis997

Sorry for the misunderstanding! I wanted to match the output of the video I am watching

QtQuick Designer Tutorial

Then I define the number of columns to be 2 and then it matched the output as demonstrated in the video