Qml component

[jamesjara2]

Hi all
i am tryng to make a viewport, but when i put inside a component , the size is losted

i lost ViewPort size positions only when i instance in main, if i put directly no problem.

main.qml
ViewPort {
    height: 600
    width: 600
    n_visible:false
}


ViewPort.qml
import Qt 4.7

Item {
        width: 500
        height:10

        property visible n_visible: center.visible
        Loader { sourceComponent: redSquare  }

        Component {
                    id: redSquare
                    Item {
                            id: container

                            anchors.fill: parent
                            width: 50
                            height: 50

                            Rectangle {
                                id: norte
                                color: "black"
                                width: parent.width
                                height: 100
                                anchors { top: parent.top; }
                            }

                            Rectangle {
                                id: sur
                                color: "red"
                                width: parent.width
                                height: 100
                                anchors { bottom: parent.bottom;}
                            }

                            Rectangle {
                                id: este
                                color: "blue"
                                width:50
                                height: parent.height
                                anchors { left: parent.left;  }
                            }

                            Rectangle {
                                id: oeste
                                color: "gray"
                                width:50
                                height: parent.height
                                anchors { right : parent.right;  }
                            }

                            Rectangle {
                                id: center
                                color: "green"
                                width: parent.width - ( oeste.width + este.width  )
                                height:parent.height- ( norte.height + sur.height )
                                anchors { top: norte.bottom; left: este.right;  }
                            }
                        }

        }
}

[tliljend]

Comment out width and height from main.qml or to be more specific it might depend from your needs, that you probably should reconsider main.qml structure. e.g:

main.qml
Rectangle{
    height: 600
    width: 600
    color: "yellow"
    ViewPort {
          n_visible:false
    }
}