What is the problem in this qml file?

CKurdu

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Window 2.15
import constants
import components.input_forms

Item {
    id: settingsDialog

    anchors.centerIn: parent
    visible: false

    property alias isBusyAddCamera: addCamera.isBusy
    property var camGridRef
    property var bottomBarRef
    property var restClient

    AddCamera {
        id: addCamera
        visible: false
        modal: true
        focus: true

        onChooseIPFromLANClicked: {
            console.log("Choose IP from LAN clicked")
        }

        onSelectLocalWebcamClicked: {
            console.log("Select local Webcam clicked")
        }

        onConnectClicked: {
            processUIData()
        }
        onCancelClicked: hide()
    }

    ListCameras {
        id: listCameras
        modal: true
        focus: true
        visible: false
        bottomMargin: bottomBarRef.height
    }

    VideoRecords {
        id: videoRecords
        visible: false
        modal: true
        focus: true

        Connections {
            target: videoRecords
            visible: false
            pageManager.show("videoRecordsPage")
        }
    }


    VideoPlayer {
        id: videoRecords
        visible: false
        modal: true
        focus: true

        Connections {
            target: videoRecords
            visible: false
            pageManager.show("videoPlayerPage")
        }
    }

    CameraSettings {
        id: cameraSettings
        visible: false
        modal: true
        focus: true
    
        onSubmitClicked: {
            processUIData()
        }
        onCancelClicked: hide()

    }

    states: [
        State {
            name: "hidden"
            PropertyChanges {
                target: settingsDialog
                visible: false
            }
            PropertyChanges {
                target: addCamera
                visible: false
            }
            PropertyChanges {
                target: listCameras
                visible: false
            }
            PropertyChanges {
                target: cameraSettings
                visible: false
            }
            PropertyChanges {
                target: camGridRef
                opacity: 1
                visible: true
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 1
            }
        },
        State {
            name: "refresh_camera"
            PropertyChanges {
                target: settingsDialog
                visible: false
            }
            PropertyChanges {
                target: addCamera
                visible: false
            }
            PropertyChanges {
                target: listCameras
                visible: false
            }
            PropertyChanges {
                target: cameraSettings
                visible: false
            }
            PropertyChanges {
                target: camGridRef
                opacity: 1
                visible: true
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 1
            }
        },

        State {
            name: "add_camera"
            PropertyChanges {
                target: settingsDialog
                visible: true
                width: 600
                height: 500
            }
            PropertyChanges {
                target: addCamera
                visible: true
            }
            PropertyChanges {
                target: camGridRef
                opacity: 0.3
                visible: true
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 0.3
            }
        },

        State {
            name: "list_cameras"
            PropertyChanges {
                target: settingsDialog
                width: camGridRef.width
                height: camGridRef.height
                visible: true
            }
            PropertyChanges {
                target: listCameras
                visible: true
            }
            PropertyChanges {
                target: camGridRef
                visible: false
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 0.3
            }
        },

        State {
            name: "camera_settings"
            PropertyChanges {
                target: settingsDialog
                visible: true
                width: 400
                height: 300
            }
            PropertyChanges {
                target: cameraSettings
                visible: true
            }
            PropertyChanges {
                target: camGridRef
                opacity: 0.3
                visible: true
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 0.3
            }
        },

        State {
            name: "video_records"
            PropertyChanges {
                target: settingsDialog
                width: 400
                height: 300
                visible: true
            }
            PropertyChanges {
                target: camGridRef
                visible: false
            }
            PropertyChanges {
                target: bottomBarRef
                opacity: 0.3
            }
        }
    ]

    transitions: Transition {
        NumberAnimation { properties: "opacity"; duration: 200 }
    }

    function changeState(newState) {
        state = newState
    }

    function showVideoRecords() {
        changeState("video_records");
    }

    function hide() { visible = false; state = "hidden" }
    function show() { visible = true }
    function toggle() { visible = !visible }

    function getAllCameras() {
        console.log("get_all_cameras")
        restClient.get_all_cameras()
    }

    function processUIData() {
        console.log("processUIData")
        var jsonData = "" // JSON data to be sent to the server
        if (state == "add_camera") {
            console.log("add_camera camera_id: ", addCamera.camera_id)

            var data = {}
            data["name"] = addCamera.camera_name
            data["xaddr"] = addCamera.camera_url
            data["port"] = addCamera.camera_port
            data["user"] = addCamera.camera_user
            data["password"] = addCamera.camera_password
            data["group"] = addCamera.camera_group
            data["enabled"] = addCamera.camera_enabled
            jsonData = JSON.stringify(data)
            restClient.create_camera(jsonData)
        } else if (state == "cameras") {
            console.log("cameras")
        } else if (state == "camera_settings") {
            console.log("camera_settings")
            restClient.get_camera_settings()
        }
    }

}

What is the problem in this qml file?

SGaist

Hi,

What problem do you have with it ?
Which version of Qt are you using ?
On which OS ?

CKurdu

pyside6.7.2
linux and windows
Can you look at the "Connections" part?

SGaist

You did not answer all of my questions.

CKurdu

Hi,

What problem do you have with it ?

The problem is that my coworker insists that the lines below are correct.

 Connections {
            target: videoRecords
            visible: false
            pageManager.show("videoRecordsPage")
        }

I am pretty sure we can't use "pagemanager.Show" like that. This isn't correct in qml language.
Also, my qt creator shows an error there. They are using the same version.

Which version of Qt are you using ?

Qt 6.7.2 from pyside6.

On which OS ?

Windows 11 and Debian 12 x64

I have been using qml from the beginning.
But my colleague says it works and doesn't provide any proper proof.

SGaist

Well, make him do.
When trying to load your example as is using the qml executable, it fails on the lines you are doubting works.
The documentation does not state that such construct may work.
And qmllinter seems to also be a bit angry (partly due to the fact that you have imports that cannot be resolved) but I think you will have a more usable result on your machine.

GrecKo

@CKurdu said in What is the problem in this qml file?:

The problem is that my coworker insists that the lines below are correct.
 Connections {
     target: videoRecords
     visible: false
     pageManager.show("videoRecordsPage")
 }

What is this even supposed to do?
Connections is meant to connect to signals declared in its target. Note that there is little reason to use a Connection inside the declaration on its target.
There's no visible property in Connections, it's not a visible item.
Writing pageManager.show("videoRecordsPage") here is syntactically incorrect in QML.
You also have a duplicate object id.

The correct syntax for Connections is :

Connections {
    target: object
    function onSignalName() {
        // do stuff
    }
}

Here you don't need Connections to handle a signal of videoRecords, you could do:

    VideoRecords {
        id: videoRecords
        visible: false
        modal: true
        on<YourSignalName>: pageManager.show("videoRecordsPage")
    }

This is assuming that you want to handle a signal in VideoRecords and show the videoRecordsPage after. You are the one knowing if it does make sense in your code.
As for the visible: false in Connections, maybe it was meant to be the enabled property? Your tell us (or your colleague tells you).