pythonqmlpyside2
PySide2/QML append actions to ToolBar and navigate hierarchical
I'm trying to achieve same thing as mentioned in below post with QML.
Breadcrumbs navigation using QToolBar and QListView
I'm not able to figure out, How to append ToolButton via PySide2 to QML ToolBar and update Gridview relatively (based on given hierarchical data).
main.qml
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import QtQuick.Controls.Styles 1.4
ApplicationWindow {
id: mainWindowId
visible: true
width: 960
height: 540
title: qsTr("Breadcrumbs Test")
Rectangle {
width: parent.width
height: parent.height
ColumnLayout {
width: parent.width
height: parent.height
spacing: 6
TextField {
id: filterTextFieldId
Layout.fillWidth: true
Layout.preferredHeight: 40
font {
family: "SF Pro Display"
pixelSize: 22
}
placeholderText: "Type Filter Expression"
color: "dodgerblue"
}
ToolBar {
background: Rectangle {
color: "transparent"
}
RowLayout {
anchors.fill: parent
spacing: 10
ToolButton {
Layout.preferredHeight: 20
contentItem: Text {
text: qsTr('Home')
color: "#FFFFFF"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
background: Rectangle {
radius: 12
color: "#40e0d0"
}
onClicked: crumbsNavigation.on_buttonTriggered()
}
ToolButton {
Layout.preferredHeight: 20
contentItem: Text {
text: qsTr('About')
color: "#FFFFFF"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
background: Rectangle {
radius: 12
color: "#40e0d0"
}
onClicked: crumbsNavigation.on_buttonTriggered()
}
ToolButton {
Layout.preferredHeight: 20
contentItem: Text {
text: qsTr('Contact')
color: "#FFFFFF"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
background: Rectangle {
radius: 12
color: "#40e0d0"
}
onClicked: crumbsNavigation.on_buttonTriggered()
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.fillHeight: true
color: "dodgerblue"
GridView {
id: crumbsViewId
width: parent.width
height: parent.height
anchors.fill: parent
anchors.margins: 12
cellWidth: 130
cellHeight: 130
model: crumbsNavigation.model
delegate: Text {text:qsTr('Hello'); color:"white"}
focus: true
}
}
}
}
}
qmlBreadcrumbs.py
from PySide2 import QtCore, QtQuick, QtGui, QtWidgets, QtQml
import os
import sys
import re
crumbs_data = {"books":{
"web":{
"front-end":{
"html":["the missing manual", "core html5 canvas"],
"css":["css pocket reference", "css in depth"],
"js":["you don't know js", "eloquent javascript"]
},
"back-end":{
"php":["modern php", "php web services"],
"python":["dive into python", "python for everybody",
"Think Python", "Effective Python", "Fluent Python"]
}
},
"database":{
"sql":{
"mysql":["mysql in a nutshell", "mysql cookbook"],
"postgresql":["postgresql up and running", "practical postgresql"]
},
"nosql":{
"mongodb":["mongodb in action", "scaling mongodb"],
"cassandra":["practical cassandra", "mastering cassandra"]
}}}}
def dict_to_model(item, d):
if isinstance(d, dict):
for k, v in d.items():
it = QtGui.QStandardItem(k)
item.appendRow(it)
dict_to_model(it, v)
elif isinstance(d, list):
for v in d:
dict_to_model(item, v)
else:
item.appendRow(QtGui.QStandardItem(str(d)))
class crumbsNavigation(QtCore.QObject):
clicked = QtCore.Signal(QtCore.QModelIndex)
def __init__(self, json_data, parent=None):
super(crumbsNavigation, self).__init__(parent)
self.model = QtGui.QStandardItemModel(self)
dict_to_model(self.model.invisibleRootItem(), json_data)
it = self.model.item(0, 0)
ix = self.model.indexFromItem(it)
@QtCore.Slot(QtCore.QModelIndex)
def on_clicked(self, index):
if not self.model.hasChildren(index):
self.clicked.emit(index)
return
action = self.toolbar.addAction(index.data())
action.setData(QtCore.QPersistentModelIndex(index))
self.listview.setRootIndex(index)
@QtCore.Slot(QtWidgets.QAction)
def on_actionTriggered(self, action):
ix = action.data()
model = ix.model()
self.listview.setRootIndex(QtCore.QModelIndex(ix))
self.toolbar.clear()
ixs = []
while ix.isValid():
ixs.append(ix)
ix = ix.parent()
for ix in reversed(ixs):
action = self.toolbar.addAction(ix.data())
action.setData(ix)
@QtCore.Slot()
def on_buttonTriggered(self):
print('Toolbutton Triggered')
if __name__ == "__main__":
app = QtWidgets.QApplication(sys.argv)
engine = QtQml.QQmlApplicationEngine()
crumbObject = crumbsNavigation(crumbs_data)
engine.rootContext().setContextProperty("crumbsNavigation", crumbObject)
engine.load(QtCore.QUrl.fromLocalFile('E:/Tech/main.qml'))
if not engine.rootObjects():
sys.exit(-1)
engine.quit.connect(app.quit)
sys.exit(app.exec_())
Solution
The logic in QML is the same in Qt Widgets but not with the same elements since for example neither QAction nor QToolBar exist in QML.
I will summarize the logic in the following:
The rootIndex of the view (ListView/QListView) must be updated when an item in the view or the ToolBar/QToolBar is pressed.
ToolBar/QToolBar items must be rootIndex and its parents.
On the other hand, the ListView does not allow to establish a rootIndex unlike QListView, so to implement the same functionality you must use DelegateModel.
On the python side I implement a class that handles navigation, having for this the properties:
- model: It has the information in a hierarchical way.
- headers: It has the information of the text and the QModelIndex of the ToolBar.
- rootIndex.
main.py
from PySide2 import QtCore, QtGui, QtWidgets, QtQml
crumbs_data = # ...
def dict_to_model(item, d):
if isinstance(d, dict):
for k, v in d.items():
it = QtGui.QStandardItem(k)
item.appendRow(it)
dict_to_model(it, v)
elif isinstance(d, list):
for v in d:
dict_to_model(item, v)
else:
item.appendRow(QtGui.QStandardItem(str(d)))
class NavigationManager(QtCore.QObject):
headersChanged = QtCore.Signal()
rootIndexChanged = QtCore.Signal("QModelIndex")
def __init__(self, json_data, parent=None):
super().__init__(parent)
self.m_model = QtGui.QStandardItemModel(self)
dict_to_model(self.m_model.invisibleRootItem(), json_data)
self.m_headers = []
self.m_rootindex = QtCore.QModelIndex()
self.rootIndexChanged.connect(self._update_headers)
self.rootIndex = self.m_model.index(0, 0)
def _update_headers(self, ix):
self.m_headers = []
while ix.isValid():
self.m_headers.insert(0, [ix, ix.data()])
ix = ix.parent()
self.headersChanged.emit()
@QtCore.Property(QtCore.QObject, constant=True)
def model(self):
return self.m_model
@QtCore.Property("QVariantList", notify=headersChanged)
def headers(self):
return self.m_headers
def get_root_index(self):
return self.m_rootindex
def set_root_index(self, ix):
if self.m_rootindex != ix:
self.m_rootindex = ix
self.rootIndexChanged.emit(ix)
rootIndex = QtCore.Property(
"QModelIndex", fget=get_root_index, fset=set_root_index, notify=rootIndexChanged
)
if __name__ == "__main__":
import os
import sys
navigation_manager = NavigationManager(crumbs_data)
model = QtGui.QStandardItemModel()
app = QtWidgets.QApplication(sys.argv)
engine = QtQml.QQmlApplicationEngine()
engine.rootContext().setContextProperty("navigation_manager", navigation_manager)
current_dir = os.path.dirname(os.path.realpath(__file__))
filename = os.path.join(current_dir, "main.qml")
engine.load(QtCore.QUrl.fromLocalFile(filename))
if not engine.rootObjects():
sys.exit(-1)
engine.quit.connect(app.quit)
sys.exit(app.exec_())
main.qml
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import QtQml.Models 2.13
ApplicationWindow {
id: mainWindowId
visible: true
width: 960
height: 540
title: qsTr("Breadcrumbs Test")
Rectangle {
width: parent.width
height: parent.height
ColumnLayout {
width: parent.width
height: parent.height
spacing: 6
TextField {
id: filterTextFieldId
Layout.fillWidth: true
Layout.preferredHeight: 40
font {
family: "SF Pro Display"
pixelSize: 22
}
placeholderText: "Type Filter Expression"
color: "dodgerblue"
}
ToolBar {
background: Rectangle {
color: "transparent"
}
RowLayout {
anchors.fill: parent
spacing: 10
Repeater{
model: navigation_manager.headers
ToolButton {
Layout.preferredHeight: 20
contentItem: Text {
text: model.modelData[1]
color: "#FFFFFF"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
background: Rectangle {
radius: 12
color: "#40e0d0"
}
onClicked: navigation_manager.rootIndex = model.modelData[0]
}
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.fillHeight: true
color: "dodgerblue"
ListView{
id: view
anchors.fill: parent
anchors.margins: 12
model: DelegateModel {
model: navigation_manager.model
rootIndex: navigation_manager.rootIndex
delegate: Rectangle {
height: 25
color:"transparent"
Text {
text: model.display
color:"white"
MouseArea{
anchors.fill: parent
onClicked: {
if (model.hasModelChildren)
navigation_manager.rootIndex = view.model.modelIndex(index)
}
}
}
}
}
}
}
}
}
}
- Python method chaining in functional programming style
- flask-jwt-extended: Fake Authorization Header during testing (pytest)
- For loop through the list unless empty?
- Polars make all groups the same size
- Is there a way to specify a default base-template for all templates in django?
- How to tackle time limit exceeded error in leetcode
- Is pd.get_dummies() updated in newer versions of Pandas making it default to Booleans (True/False) instead of (0/1)?
- What's the function like sum() but for multiplication? product()?
- How to type hint a dynamically-created dataclass
- Issue with pulling the data with EIA API with Python
- 403 Forbidden Error when scraping a site, user-agents already used and updated. Any ideas?
- Fullstack web-hosting services
- How to handle an AnalysisException on Spark SQL?
- Python requests is slow and takes very long to complete HTTP or HTTPS request
- Is there a way to modify an element in a Numpy array based on the value of other elements?
- Tkinter grid manager height/width nonconsistent
- Sql Alchemy Insert Statement failing to insert, but no error
- How can I create a Polars struct while eval-ing a list?
- Excel using win32com and python
- django: on pypy, psyco, unladen swallow or cpython, which one is the fastest?
- How convert a list into multiple columns and a dataframe?
- Name not defined in type annotation
- Static type checkers and Language Servers not recognizing attributes of objects that are subclasses
- How do I get multiple OID values in PySNMP?
- how to log a file in Django
- Is there a simple and efficient way to evaluate Elementary Symmetric Polynomials in Python?
- Iterating over two lists one after another
- Python -i flag for production
- What is PyCompilerFlags in Python C API?
- How to make Python check whether a variable is a number or letter