Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct
GUI looks different and weird on different machines (Qt Creator 4.3.0)
-
Hi. I am a new Qt Creator user. I made a simple GUI using Qt Creator, which mainly includes QLabels and QTextEdits (basically user types some inputs and after clicking calculate, some outputs appear). I defined functionalities using PyQt 5 and made exe file using CX_freeze. The problem I have is that while GUI looks fine on my laptop, some font sizes and QLabel dimensions change on other machines and make the GUI look weird. In Qt Creator, I tried different size policies for QLabel and QTextEdit (expanding, fixed, etc) but did not fix the problem. I will be grateful to hear any suggestion. Thanks.
-
Hi, and welcome to the Qt forum. Can you please post a screenshot of the weird looking window?
-
Thank you! Sure, here is a picture of it running on another machine (while on my laptop it looks nice).
-
I noticed different OS's have different default fonts and sizes.
Fonts are larger on linux (ubuntu 16.04 LTS) vs windows if I have been a little lazy to not specify dimensions properly.I've found if I have my font pixels calculated it works better, as opposed to just unset or point size.
Try specifying dimensions not just a points size (is my guess) - something like:
font.pixelSize: ( parent.height / 2 );- you can set it to literally anything you like. It's just another QtObject/Item.
Anyhow, I don't have a perfect system myself - but this might give you an idea on how to fix yours.
-
Hi @Akzmn
Welcome to Qt world.
Using fixed sizes in GUI design is not recommended, inorder to use for multiple screen sizes.
Based on "const QRect QDesktopWidget::screenGeometry()" sizes of internal widgets should be rearranged.
-
Hi,
@Akzmn , welcome to Qt,
Make use of the below code to get width and height :
QRect m_ScreenSize = qApp->primaryScreen()->geometry();
int width = m_ScreenSize .width();
int height = m_ScreenSize .height();So make use of width and height values for all visual ui elements , so it will fit to all platforms.
make use of the width and height values.Thanks,
-
Hi @Pradeep-Kumar ! Many thanks for your response. Just to make things more clear and to make sure I understood correctly, I am explaining the workflow I have been following:
To design the UI I used "design" mode in QT Creator , and then using "> pyuic5 -x firstF.ui -o firstF.py" I convert it to python file.
and then I have a python code program.py in which I import the designed UI and define the functions:
firstF.py:from PyQt5 import QtCore, QtGui, QtWidgets class Ui_myfirstgui(object): def setupUi(self, myfirstgui): myfirstgui.setObjectName("myfirstgui") myfirstgui.resize(851, 779) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Preferred, QtWidgets.QSizePolicy.Preferred) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(myfirstgui.sizePolicy().hasHeightForWidth()) myfirstgui.setSizePolicy(sizePolicy) icon = QtGui.QIcon() icon.addPixmap(QtGui.QPixmap("logo_fZG_icon.ico"), QtGui.QIcon.Normal, QtGui.QIcon.On) myfirstgui.setWindowIcon(icon) self.buttonBox = QtWidgets.QDialogButtonBox(myfirstgui) self.buttonBox.setGeometry(QtCore.QRect(750, 700, 81, 51)) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Expanding) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(self.buttonBox.sizePolicy().hasHeightForWidth()) self.buttonBox.setSizePolicy(sizePolicy) font = QtGui.QFont() font.setPointSize(9) self.buttonBox.setFont(font) self.buttonBox.setOrientation(QtCore.Qt.Horizontal) self.buttonBox.setStandardButtons(QtWidgets.QDialogButtonBox.Close) self.buttonBox.setObjectName("buttonBox") self.label = QtWidgets.QLabel(myfirstgui) self.label.setGeometry(QtCore.QRect(770, 10, 71, 81)) self.label.setText("") self.label.setPixmap(QtGui.QPixmap("logo.png")) self.label.setScaledContents(True) self.label.setObjectName("label") self.label_2 = QtWidgets.QLabel(myfirstgui) self.label_2.setGeometry(QtCore.QRect(10, 400, 651, 351)) self.label_2.setText("") self.label_2.setPixmap(QtGui.QPixmap("PlanGrey.JPG")) self.label_2.setScaledContents(True) self.label_2.setObjectName("label_2") self.label_3 = QtWidgets.QLabel(myfirstgui) self.label_3.setGeometry(QtCore.QRect(30, 170, 81, 16)) font = QtGui.QFont() font.setFamily("Century Gothic") font.setPointSize(14) font.setBold(True) font.setWeight(75) self.label_3.setFont(font) self.label_3.setObjectName("label_3") self.label_4 = QtWidgets.QLabel(myfirstgui) self.label_4.setGeometry(QtCore.QRect(30, 200, 131, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_4.setFont(font) self.label_4.setObjectName("label_4") self.label_5 = QtWidgets.QLabel(myfirstgui) self.label_5.setGeometry(QtCore.QRect(32, 230, 101, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_5.setFont(font) self.label_5.setObjectName("label_5") self.label_6 = QtWidgets.QLabel(myfirstgui) self.label_6.setGeometry(QtCore.QRect(430, 170, 81, 16)) font = QtGui.QFont() font.setFamily("Century Gothic") font.setPointSize(14) font.setBold(True) font.setWeight(75) self.label_6.setFont(font) self.label_6.setObjectName("label_6") self.label_7 = QtWidgets.QLabel(myfirstgui) self.label_7.setGeometry(QtCore.QRect(430, 200, 161, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_7.setFont(font) self.label_7.setObjectName("label_7") self.label_8 = QtWidgets.QLabel(myfirstgui) self.label_8.setGeometry(QtCore.QRect(30, 10, 291, 31)) font = QtGui.QFont() font.setFamily("Century Gothic") font.setPointSize(14) font.setBold(True) font.setWeight(75) self.label_8.setFont(font) self.label_8.setObjectName("label_8") self.label_9 = QtWidgets.QLabel(myfirstgui) self.label_9.setGeometry(QtCore.QRect(30, 50, 651, 31)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_9.setFont(font) self.label_9.setWordWrap(True) self.label_9.setObjectName("label_9") self.Clear = QtWidgets.QPushButton(myfirstgui) self.Clear.setGeometry(QtCore.QRect(751, 680, 79, 26)) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Expanding) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(self.Clear.sizePolicy().hasHeightForWidth()) self.Clear.setSizePolicy(sizePolicy) font = QtGui.QFont() font.setPointSize(9) self.Clear.setFont(font) self.Clear.setObjectName("Clear") self.label_10 = QtWidgets.QLabel(myfirstgui) self.label_10.setGeometry(QtCore.QRect(32, 260, 191, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_10.setFont(font) self.label_10.setObjectName("label_10") self.label_11 = QtWidgets.QLabel(myfirstgui) self.label_11.setGeometry(QtCore.QRect(30, 290, 201, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_11.setFont(font) self.label_11.setObjectName("label_11") self.label_12 = QtWidgets.QLabel(myfirstgui) self.label_12.setGeometry(QtCore.QRect(430, 230, 161, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_12.setFont(font) self.label_12.setObjectName("label_12") self.label_19 = QtWidgets.QLabel(myfirstgui) self.label_19.setGeometry(QtCore.QRect(430, 260, 191, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_19.setFont(font) self.label_19.setObjectName("label_19") self.label_21 = QtWidgets.QLabel(myfirstgui) self.label_21.setGeometry(QtCore.QRect(430, 290, 221, 20)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_21.setFont(font) self.label_21.setObjectName("label_21") self.calcButton = QtWidgets.QPushButton(myfirstgui) self.calcButton.setGeometry(QtCore.QRect(751, 645, 79, 26)) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Expanding) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(self.calcButton.sizePolicy().hasHeightForWidth()) self.calcButton.setSizePolicy(sizePolicy) font = QtGui.QFont() font.setPointSize(9) self.calcButton.setFont(font) self.calcButton.setObjectName("calcButton") self.label_27 = QtWidgets.QLabel(myfirstgui) self.label_27.setGeometry(QtCore.QRect(400, 420, 361, 331)) self.label_27.setText("") self.label_27.setPixmap(QtGui.QPixmap("3D.png")) self.label_27.setScaledContents(True) self.label_27.setObjectName("label_27") self.label_28 = QtWidgets.QLabel(myfirstgui) self.label_28.setGeometry(QtCore.QRect(30, 70, 711, 31)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_28.setFont(font) self.label_28.setObjectName("label_28") self.label_29 = QtWidgets.QLabel(myfirstgui) self.label_29.setGeometry(QtCore.QRect(30, 110, 721, 31)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_29.setFont(font) self.label_29.setObjectName("label_29") self.label_30 = QtWidgets.QLabel(myfirstgui) self.label_30.setGeometry(QtCore.QRect(30, 90, 691, 31)) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_30.setFont(font) self.label_30.setObjectName("label_30") self.verticalLayoutWidget = QtWidgets.QWidget(myfirstgui) self.verticalLayoutWidget.setGeometry(QtCore.QRect(270, 190, 160, 131)) self.verticalLayoutWidget.setObjectName("verticalLayoutWidget") self.verticalLayout = QtWidgets.QVBoxLayout(self.verticalLayoutWidget) self.verticalLayout.setContentsMargins(0, 0, 0, 0) self.verticalLayout.setObjectName("verticalLayout") self.label_13 = QtWidgets.QLabel(self.verticalLayoutWidget) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_13.setFont(font) self.label_13.setObjectName("label_13") self.verticalLayout.addWidget(self.label_13) self.label_14 = QtWidgets.QLabel(self.verticalLayoutWidget) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_14.setFont(font) self.label_14.setObjectName("label_14") self.verticalLayout.addWidget(self.label_14) self.label_15 = QtWidgets.QLabel(self.verticalLayoutWidget) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_15.setFont(font) self.label_15.setObjectName("label_15") self.verticalLayout.addWidget(self.label_15) self.label_16 = QtWidgets.QLabel(self.verticalLayoutWidget) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_16.setFont(font) self.label_16.setObjectName("label_16") self.verticalLayout.addWidget(self.label_16) self.label_24 = QtWidgets.QLabel(self.verticalLayoutWidget) self.label_24.setEnabled(True) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_24.setFont(font) self.label_24.setScaledContents(True) self.label_24.setObjectName("label_24") self.verticalLayout.addWidget(self.label_24) self.verticalLayoutWidget_2 = QtWidgets.QWidget(myfirstgui) self.verticalLayoutWidget_2.setGeometry(QtCore.QRect(670, 190, 160, 118)) self.verticalLayoutWidget_2.setObjectName("verticalLayoutWidget_2") self.verticalLayout_2 = QtWidgets.QVBoxLayout(self.verticalLayoutWidget_2) self.verticalLayout_2.setContentsMargins(0, 0, 0, 0) self.verticalLayout_2.setObjectName("verticalLayout_2") self.label_17 = QtWidgets.QLabel(self.verticalLayoutWidget_2) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(10) self.label_17.setFont(font) self.label_17.setObjectName("label_17") self.verticalLayout_2.addWidget(self.label_17) self.label_18 = QtWidgets.QLabel(self.verticalLayoutWidget_2) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(9) self.label_18.setFont(font) self.label_18.setObjectName("label_18") self.verticalLayout_2.addWidget(self.label_18) self.label_20 = QtWidgets.QLabel(self.verticalLayoutWidget_2) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(9) self.label_20.setFont(font) self.label_20.setObjectName("label_20") self.verticalLayout_2.addWidget(self.label_20) self.label_22 = QtWidgets.QLabel(self.verticalLayoutWidget_2) font = QtGui.QFont() font.setFamily("Verdana") font.setPointSize(9) self.label_22.setFont(font) self.label_22.setObjectName("label_22") self.verticalLayout_2.addWidget(self.label_22) self.output_totalTime = QtWidgets.QTextEdit(myfirstgui) self.output_totalTime.setEnabled(True) self.output_totalTime.setGeometry(QtCore.QRect(580, 190, 87, 31)) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Preferred, QtWidgets.QSizePolicy.Expanding) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(self.output_totalTime.sizePolicy().hasHeightForWidth()) self.output_totalTime.setSizePolicy(sizePolicy) self.output_totalTime.setReadOnly(True) self.output_totalTime.setObjectName("output_totalTime") self.output_concreteVol = QtWidgets.QTextEdit(myfirstgui) self.output_concreteVol.setGeometry(QtCore.QRect(580, 220, 87, 31)) self.output_concreteVol.setReadOnly(True) self.output_concreteVol.setObjectName("output_concreteVol") self.output_extrusionRate = QtWidgets.QTextEdit(myfirstgui) self.output_extrusionRate.setGeometry(QtCore.QRect(580, 250, 87, 31)) self.output_extrusionRate.setReadOnly(True) self.output_extrusionRate.setObjectName("output_extrusionRate") self.output_concreteCost = QtWidgets.QTextEdit(myfirstgui) self.output_concreteCost.setGeometry(QtCore.QRect(580, 280, 87, 31)) self.output_concreteCost.setReadOnly(True) self.output_concreteCost.setObjectName("output_concreteCost") self.input_wallThickness = QtWidgets.QTextEdit(myfirstgui) self.input_wallThickness.setGeometry(QtCore.QRect(190, 200, 70, 31)) sizePolicy = QtWidgets.QSizePolicy(QtWidgets.QSizePolicy.Expanding, QtWidgets.QSizePolicy.Expanding) sizePolicy.setHorizontalStretch(0) sizePolicy.setVerticalStretch(0) sizePolicy.setHeightForWidth(self.input_wallThickness.sizePolicy().hasHeightForWidth()) self.input_wallThickness.setSizePolicy(sizePolicy) self.input_wallThickness.setMinimumSize(QtCore.QSize(70, 30)) font = QtGui.QFont() font.setPointSize(9) self.input_wallThickness.setFont(font) self.input_wallThickness.setObjectName("input_wallThickness") self.input_wallHeight = QtWidgets.QTextEdit(myfirstgui) self.input_wallHeight.setGeometry(QtCore.QRect(190, 230, 71, 31)) self.input_wallHeight.setMinimumSize(QtCore.QSize(70, 30)) font = QtGui.QFont() font.setPointSize(9) self.input_wallHeight.setFont(font) self.input_wallHeight.setObjectName("input_wallHeight") self.input_layerHeight = QtWidgets.QTextEdit(myfirstgui) self.input_layerHeight.setGeometry(QtCore.QRect(190, 260, 71, 31)) self.input_layerHeight.setObjectName("input_layerHeight") self.input_timeGap = QtWidgets.QTextEdit(myfirstgui) self.input_timeGap.setGeometry(QtCore.QRect(190, 290, 71, 31)) self.input_timeGap.setObjectName("input_timeGap") self.retranslateUi(myfirstgui) self.buttonBox.accepted.connect(myfirstgui.accept) self.buttonBox.rejected.connect(myfirstgui.reject) self.Clear.clicked.connect(self.input_wallHeight.clear) self.Clear.clicked.connect(self.input_wallThickness.clear) self.Clear.clicked.connect(self.input_layerHeight.clear) self.Clear.clicked.connect(self.input_timeGap.clear) self.Clear.clicked.connect(self.output_totalTime.clear) self.Clear.clicked.connect(self.output_extrusionRate.clear) self.Clear.clicked.connect(self.output_concreteVol.clear) self.Clear.clicked.connect(self.output_concreteCost.clear) QtCore.QMetaObject.connectSlotsByName(myfirstgui) def retranslateUi(self, myfirstgui): _translate = QtCore.QCoreApplication.translate myfirstgui.setWindowTitle(_translate("myfirstgui", "ABCD")) self.label_3.setText(_translate("myfirstgui", "INPUTS")) self.label_4.setText(_translate("myfirstgui", "Parameter A")) self.label_5.setText(_translate("myfirstgui", "Parameter B")) self.label_6.setText(_translate("myfirstgui", "OUTPUTS")) self.label_7.setText(_translate("myfirstgui", "Output 1")) self.label_8.setText(_translate("myfirstgui", "Simplifying Assumptions")) self.label_9.setText(_translate("myfirstgui", "► Symplifying assumption symplifying assumption symplifying assumption symplifying assumption ")) self.Clear.setText(_translate("myfirstgui", "Clear")) self.label_10.setText(_translate("myfirstgui", "Parameter C")) self.label_11.setText(_translate("myfirstgui", "Parameter D")) self.label_12.setText(_translate("myfirstgui", "Output 2")) self.label_19.setText(_translate("myfirstgui", "Output 3")) self.label_21.setText(_translate("myfirstgui", "Output 4")) self.calcButton.setText(_translate("myfirstgui", "Calculate")) self.label_28.setText(_translate("myfirstgui", "► Symplifying assumption symplifying assumption symplifying assumption symplifying assumption ")) self.label_29.setText(_translate("myfirstgui", "► Symplifying assumption symplifying assumption symplifying assumption symplifying assumption ")) self.label_30.setText(_translate("myfirstgui", "► Symplifying assumption symplifying assumption symplifying assumption symplifying assumption ")) self.label_13.setText(_translate("myfirstgui", "in")) self.label_14.setText(_translate("myfirstgui", "in")) self.label_15.setText(_translate("myfirstgui", "in")) self.label_16.setText(_translate("myfirstgui", "in")) self.label_24.setText(_translate("myfirstgui", "in")) self.label_17.setText(_translate("myfirstgui", "hr")) self.label_18.setText(_translate("myfirstgui", "<html><head/><body><p>hr</p></body></html>")) self.label_20.setText(_translate("myfirstgui", "<html><head/><body><p>hr</p></body></html>")) self.label_22.setText(_translate("myfirstgui", "<html><head/><body><p>hr</p></body></html>")) if __name__ == "__main__": import sys app = QtWidgets.QApplication(sys.argv) myfirstgui = QtWidgets.QDialog() ui = Ui_myfirstgui() ui.setupUi(myfirstgui) myfirstgui.show() sys.exit(app.exec_())import sys import encodings import PyQt5 from PyQt5 import QtCore, QtGui, QtWidgets from firstF import Ui_myfirstgui class MyFirstGuiProgram(Ui_myfirstgui): def __init__(self, dialog): Ui_myfirstgui.__init__(self) self.setupUi(dialog) # Connect "calcButton" button with a custom function (CalculateTime) self.calcButton.clicked.connect(self.calculateTime) def calculateTime(self): #I define the relations and functions here if __name__ == '__main__': app = QtWidgets.QApplication(sys.argv) dialog = QtWidgets.QDialog() program = MyFirstGuiProgram(dialog) dialog.show() sys.exit(app.exec_())So the code which you kindly suggested should be included in firstF.py, right? If yes, could you please give me a hint about which part should be modified?
Thanks again for all your help and I apologize again if this trivial, I am just a beginner :)
-
@Akzmn Instead of positioning/sizing the GUI elements manually you should really consider using layouts. Layouts are usually used for that. See http://doc.qt.io/qt-5.9/layout.html
-
This post is deleted!
