Here's how I did it.
Figure 1. Do the Page Configuration.
Figure 2. Create the menu structure in text. I do this in the actual application. Note the use of the '|' pipe character to separate the menu and URL.
Bind the tree's items property to the text and apply a script transform on it:
The 'items' binding script transform.
def transform(self, value, quality, timestamp):
# Update the test tree with the structure.
# Anchors and path URLs to be provided in form shown below using '|' (vertical bar) as separator.
# A001 |/Home
# A001/B001 |/Area/1/Bath/1
# A001/B001/C001 |/Area/1/Bath/1/Clamp1
# 2023-06-29 Transistor
items = []
treeExpand = self.view.params.treeExpand
for line in value.splitlines():
if line.strip(): # Ignore empty lines.
if line[0] != "#": # Lines can be commented out with #.
current = items
branch, url = line.split('|')
for part in branch.strip().split("/"): # Strip off leading and trailing spaces.
folderExists = False # Check if the current folder exists in our items list.
for itemsPointerItem in current:
if part == itemsPointerItem['label']:
folderExists = True
current = itemsPointerItem['items']
if not folderExists:
item = {
"label": part,
"expanded": treeExpand,
"items": [],
"data": {"url": url.strip()}
}
current.append(item)
current = item['items']
return items
The selected item is available in selectionData.0.value.url
[
{
"itemPath": "3/0",
"value": {
"url": "/machine/Sealer03"
}
}
]
On the menu tree add an onItemClicked event, Script:
def runAction(self, event):
pagePath = self.props.selectionData[0].value.url
system.perspective.navigate(pagePath)
Note that I've used a script to do the navigation. If found that if I used a navigation event that the navigation happened before selectionData[0].value.url had been updated and so a second click was required each time.
Have fun!