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

Qtcreator ui design and runtime display not same



  • i cant found problem here
    i put 3 button on RowLlayout and expect it look like below (is in qtcreator design mode preview)
    1_1552287646978_Screenshot from 2019-03-11 14-00-34.png
    but runtime it look like this
    0_1552287646977_Screenshot from 2019-03-11 13-59-44.png

    here the code i using:

     Rectangle {
            id: toolbar
            height: 40
            color: "red" //"#cdf8ac"
            anchors.right: parent.right
            anchors.rightMargin: 0
            anchors.left: parent.left
            anchors.leftMargin: 0
            anchors.top: topAccent.bottom
            RowLayout {
                anchors.topMargin: 0
                spacing: 0
                anchors.fill: parent
                height: 40
                ComboBox {
                    id: displayType
                    model: ["NvUniq", "Unknow", "NV"]
                    Layout.fillHeight: true
                    Layout.alignment: Qt.AlignHCenter
                    height: 40
                    }
                }
                Button {
                    id: fromDate
                    property date day: new Date()
                    text: "from"
                }
                Button {
                    id: toDate
                    property date day: new Date()
                    text: "to"
                }
            }
        }
    


  • Hi @RyuShai , i dont know how you are even getting the way you have displayed it in the runtime look as you are closing the RowLayout after the Combox box only, and then creating the other Buttons which will be by default aligned on the topLeft of the rectangle(id:toolbar or red color rectangle).

    Have made few changes to meet your expected output please have a look:-

       Rectangle {
        id: toolbar
    
        anchors.right: parent.right
        anchors.left: parent.left
        anchors.top: topAccent.bottom
        height: 40
        color: "red" //"#cdf8ac"
    
        RowLayout {
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.leftMargin: 40
            anchors.rightMargin: 40
            height: parent.height
            spacing: 40
    
            ComboBox {
                id: displayType
                model: ["NvUniq", "Unknow", "NV"]
                Layout.fillHeight: true
                Layout.fillWidth: true
            }
    
            Button {
                id: fromDate
                property date day: new Date()
                text: "from"
                Layout.fillHeight: true
                Layout.fillWidth: true
            }
    
            Button {
                id: toDate
                property date day: new Date()
                text: "to"
                Layout.fillHeight: true
                Layout.fillWidth: true
            }
        }
    }


  • @Shrinidhi-Upadhyaya said in Qtcreator ui design and runtime display not same:

    anchors.left: parent.left
    anchors.right: parent.right
    anchors.leftMargin: 40
    anchors.rightMargin: 40
    height: parent.height

    still not working, i throught some bug on qtcreator or personal machine. to night i will test on other machine



  • Hi @RyuShai , can you copy paste my complete code and run it, and if possible can you attach the screenshot of the output.



  • @Shrinidhi-Upadhyaya
    my mistake, complete code is worked, likke i expected

    any idea why my code failed ?

    edit again: i set from and to button filllheight and problem solved



  • Hi @RyuShai , please have a look at my comments below:-

        Rectangle {
        id: toolbar
    
        //####Not Needed as by default the value of margins is 0
        //        anchors.rightMargin: 0
        //        anchors.leftMargin: 0
        anchors.right: parent.right
        anchors.left: parent.left
        anchors.top: topAccent.bottom
        height: 40
        color: "red" //"#cdf8ac"
    
        RowLayout {
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.leftMargin: 40
            anchors.rightMargin: 40
            height: parent.height
            spacing: 40
    
            ComboBox {
                id: displayType
                model: ["NvUniq", "Unknow", "NV"]
                Layout.fillHeight: true
                Layout.fillWidth: true
    
                //####Will not work because you need to use Layout.preferredHeight: 40
                //                height: 40
    
            }
            //####You are closing the RowLayout here which is the biggest problem,thats why you are not getting the UI properly
     //        }
    
            Button {
                id: fromDate
                property date day: new Date()
                text: "from"
                //####Every component needs a height and width,so you need to set that
                Layout.fillHeight: true
                Layout.fillWidth: true
            }
    
            Button {
                id: toDate
                property date day: new Date()
                text: "to"
                //####Every component needs a height and width,so you need to set that
                Layout.fillHeight: true
                Layout.fillWidth: true
            }
        }
    }


  • hi !@Shrinidhi-Upadhyaya
    i dont want create topic so could i ask you thing ?

    i have

    Struct T{
    int i;
    }
    T t;
    t.i =1;
    QList<T> list;
    list.push_back(t);
    

    how can i change t.i in list from 1 to 2 ?



  • Hi @RyuShai , there is a replace function available, you can have a look into QList Documentation.
    And for further doubts etc you can follow me and ping me anytime.


Log in to reply