I'm trying to display custom listView with QQuickWidget. Since I need two listView: one for a search result, one for a queue, I used QTabWidget to switch between those two QQuickWidget.
I haven't finished making that listView (Because I'm a beginner at this) so I improvised my QML to test if it works as I typed above. When I run my app, QML that is inside QTabWidget is shown unexpectedly.
It should display a yellow rectangle and text like the QQuickWidget below, but it displays text aligned at the top left corner, without a yellow rectangle.
When the application is executed
[Things I've tried] I assumed this is because I put QQuickWidget inside QWidget at each Tab, so I promoted those QWidget as custom page that has QQuickWidget but nothing has changed.
main.py
import sys
from PyQt5.QtCore import *
from PyQt5.QtWidgets import *
from PyQt5 import uic
from PyQt5.QtQuickWidgets import QQuickWidget
from myresulttab import myResultTab
from myqueuetab import myQueueTab
#loading UI file
form_class = uic.loadUiType("mainWindowUI.ui")[0]
class WindowClass(QMainWindow, form_class) :
def __init__(self) :
super().__init__()
self.setupUi(self)
self.testQuickWidget.setSource(QUrl.fromLocalFile("resultTabQml.qml"))
if __name__ == "__main__" :
app = QApplication(sys.argv)
myWindow = WindowClass()
myWindow.show()
app.exec_()
mainWindowUI.ui
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow</class>
<widget class="QMainWindow" name="MainWindow">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>555</width>
<height>821</height>
</rect>
</property>
<property name="font">
<font>
<family>NanumGothic</family>
<pointsize>10</pointsize>
<weight>50</weight>
<italic>false</italic>
<bold>false</bold>
</font>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<widget class="QWidget" name="centralwidget">
<property name="styleSheet">
<string notr="true"/>
</property>
<layout class="QGridLayout" name="gridLayout" rowstretch="50,5,45,0" columnstretch="70,0">
<property name="verticalSpacing">
<number>15</number>
</property>
<item row="2" column="0" colspan="2">
<widget class="QQuickWidget" name="testQuickWidget">
<property name="resizeMode">
<enum>QQuickWidget::SizeRootObjectToView</enum>
</property>
</widget>
</item>
<item row="0" column="0" colspan="2">
<widget class="QTabWidget" name="tabWidget">
<property name="currentIndex">
<number>0</number>
</property>
<property name="elideMode">
<enum>Qt::ElideNone</enum>
</property>
<widget class="myResultTab" name="resultTab">
<property name="font">
<font>
<family>NanumGothic</family>
<pointsize>10</pointsize>
<weight>50</weight>
<italic>false</italic>
<bold>false</bold>
</font>
</property>
<attribute name="title">
<string>검색창</string>
</attribute>
</widget>
<widget class="myQueueTab" name="queueTab">
<property name="autoFillBackground">
<bool>false</bool>
</property>
<attribute name="title">
<string>QUEUE</string>
</attribute>
</widget>
</widget>
</item>
<item row="1" column="0">
<widget class="QLabel" name="console">
<property name="sizePolicy">
<sizepolicy hsizetype="Preferred" vsizetype="Minimum">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="font">
<font>
<family>NanumGothic</family>
<pointsize>10</pointsize>
<weight>50</weight>
<italic>false</italic>
<bold>false</bold>
</font>
</property>
<property name="toolTip">
<string extracomment="프로그램이 당신에게 보내는 편지입니다. 다정하게 대해주세요 :)"/>
</property>
<property name="text">
<string>resultTabQML.qml should be displayed like this!</string>
</property>
</widget>
</item>
</layout>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>555</width>
<height>20</height>
</rect>
</property>
<widget class="QMenu" name="menu_F">
<property name="title">
<string>파일(&F)</string>
</property>
</widget>
<widget class="QMenu" name="menu_E">
<property name="title">
<string>편집(&E)</string>
</property>
<addaction name="separator"/>
<addaction name="separator"/>
</widget>
<addaction name="menu_F"/>
<addaction name="menu_E"/>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<customwidgets>
<customwidget>
<class>QQuickWidget</class>
<extends>QWidget</extends>
<header location="global">QtQuickWidgets/QQuickWidget</header>
</customwidget>
<customwidget>
<class>myResultTab</class>
<extends>QWidget</extends>
<header>myresulttab.h</header>
<container>1</container>
</customwidget>
<customwidget>
<class>myQueueTab</class>
<extends>QWidget</extends>
<header>myqueuetab.h</header>
<container>1</container>
</customwidget>
</customwidgets>
<resources/>
<connections/>
<slots>
<slot>inquireDataBtnPressed()</slot>
<slot>insertDataBtnPressed()</slot>
<slot>deleteDataBtnPressed()</slot>
<slot>updateDataBtnPressed()</slot>
<slot>getDataFromApiBtnPressed()</slot>
</slots>
</ui>
myResultTab.py
from PyQt5.QtCore import *
from PyQt5.QtWidgets import *
from PyQt5.QtQuickWidgets import QQuickWidget
class myResultTab(QWidget):
def __init__(self):
super().__init__()
layout = QVBoxLayout(self)
resultQuickWidget = QQuickWidget(QUrl.fromLocalFile("resultTabQml.qml"))
layout.addWidget(resultQuickWidget)
self.setLayout(layout)
myQueueTab.py
from PyQt5.QtCore import *
from PyQt5.QtWidgets import *
from PyQt5.QtQuickWidgets import QQuickWidget
class myQueueTab(QWidget):
def __init__(self):
super().__init__()
layout = QVBoxLayout(self)
queueQuickWidget = QQuickWidget(QUrl.fromLocalFile("queueTabQml.qml"))
layout.addWidget(queueQuickWidget)
self.setLayout(layout)
resultTabQml.qml
import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 2.2
Item{
Rectangle{
id:rect1
color:"yellow"
anchors.fill: parent
Text {
id: sampleText1
text: qsTr("sampleText1")
font.family: "Arial"
font.pointSize: 50
anchors.rightMargin: 0
anchors.bottomMargin: 0
anchors.fill: parent
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
}
}
/*##^##
Designer {
D{i:0;autoSize:true;height:480;width:640}
}
##^##*/
