Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. using Connections with my component
Forum Updated to NodeBB v4.3 + New Features

using Connections with my component

Scheduled Pinned Locked Moved Solved QML and Qt Quick
6 Posts 3 Posters 987 Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Offline
    M Offline
    mzimmers
    wrote on 25 Sept 2023, 00:11 last edited by
    #1

    Hi all -

    I need to send a signal from one of my components. The documentation is brief, but it seems like I'm doing everything necessary:

    // Signaler.qml
    import QtQuick
    import QtQuick.Controls
    
    Rectangle {
        id: rect
        signal rectClicked
        height: 100
        width: 100
        color: 'lightBlue'
        MouseArea {
            id: mouseArea
            anchors.fill: parent
            onClicked: {
                console.log("emitting rectClicked().")
                rect.rectClicked()
            }
        }
    }
    

    and

    // Main.qml
    import QtQuick
    import QtQuick.Window
    import QtQml
    
    Window {
        width: 640
        height: 480
        visible: true
        title: qsTr("Hello World")
        Connections {
            target: Signaler // is this what's wrong?
            function onRectClicked() { console.log("signal received.")}
        }
        Signaler {}
    }
    

    No runtime errors. Can someone see why my connection isn't getting the signal?

    Thanks...

    J 1 Reply Last reply 25 Sept 2023, 00:27
    0
    • M mzimmers
      25 Sept 2023, 02:10

      @JKSH OK, thank you for that...it works.

      My real use of this is a bit more complicated -- the signal is coming from a component that is loaded through a StackView push.

      ColumnLayout {
          Connections {
              target: activitySelector
              function onSaveClicked (activity) {
                  console.log("ScheduleDetails.qml: received signal from activitySelector!")
              }
          }
      
      	UtilityButton {
      		id: activitySelectorButton
      		onClicked: {
      			scheduleDetailsDrawer.open()
      			scheduleDetailsStackView.push("ActivitySelector.qml",
      										  { "id": "activitySelector" }
      										  )
      		}
      	}
      
          Drawer {
              id: scheduleDetailsDrawer
              }
              StackView {
                  id: scheduleDetailsStackView
                  anchors.fill: parent
              }
      	}
      }
      

      The signal "saveClicked" comes from within ActivitySelector.qml.

      When I try this, I get similar error messages:

      qrc:/qt/qml/nga_demo/ScheduleDetails.qml:17:5: QML Connections: Detected function "onSaveClicked" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
      qrc:/qt/qml/nga_demo/ScheduleDetails.qml:18: ReferenceError: activitySelector is not defined
      qrc:/qt/qml/nga_demo/ScheduleDetails.qml:86: Error: Cannot assign to non-existent property "id"
      
      J Offline
      J Offline
      JKSH
      Moderators
      wrote on 25 Sept 2023, 05:34 last edited by
      #6

      @mzimmers said in using Connections with my component:

      My real use of this is a bit more complicated -- the signal is coming from a component that is loaded through a StackView push.

      You'll get errors if your Connections object is created before its target even exists.

      Also, id is not a property so you can't assign it like { "id": "activitySelector" }.

      You could create your Connections object dynamically (at the same time as when you call push()). Or, even better, you could do without a Connections at all:

      Component {
          id: activitySelectorComp
          ActivitySelector {
              onSaveClicked: console.log("ScheduleDetails.qml: received signal from activitySelector!")
          }
      }
      Button {
          onClicked: scheduleDetailsStackView.push(activitySelectorComp)
      }
      

      Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

      1 Reply Last reply
      2
      • M mzimmers
        25 Sept 2023, 00:11

        Hi all -

        I need to send a signal from one of my components. The documentation is brief, but it seems like I'm doing everything necessary:

        // Signaler.qml
        import QtQuick
        import QtQuick.Controls
        
        Rectangle {
            id: rect
            signal rectClicked
            height: 100
            width: 100
            color: 'lightBlue'
            MouseArea {
                id: mouseArea
                anchors.fill: parent
                onClicked: {
                    console.log("emitting rectClicked().")
                    rect.rectClicked()
                }
            }
        }
        

        and

        // Main.qml
        import QtQuick
        import QtQuick.Window
        import QtQml
        
        Window {
            width: 640
            height: 480
            visible: true
            title: qsTr("Hello World")
            Connections {
                target: Signaler // is this what's wrong?
                function onRectClicked() { console.log("signal received.")}
            }
            Signaler {}
        }
        

        No runtime errors. Can someone see why my connection isn't getting the signal?

        Thanks...

        J Offline
        J Offline
        johngod
        wrote on 25 Sept 2023, 00:27 last edited by
        #2

        @mzimmers Hi

        target should be the id of Signaler

        Window {
            width: 640
            height: 480
            visible: true
            title: qsTr("Hello World")
            Connections {
                target: sig
                function onRectClicked() { console.log("signal received.")}
            }
            Signaler {
                id: sig
            }
        }
        
        M 1 Reply Last reply 25 Sept 2023, 01:33
        0
        • J johngod
          25 Sept 2023, 00:27

          @mzimmers Hi

          target should be the id of Signaler

          Window {
              width: 640
              height: 480
              visible: true
              title: qsTr("Hello World")
              Connections {
                  target: sig
                  function onRectClicked() { console.log("signal received.")}
              }
              Signaler {
                  id: sig
              }
          }
          
          M Offline
          M Offline
          mzimmers
          wrote on 25 Sept 2023, 01:33 last edited by
          #3

          @johngod I tried that:

          import QtQuick
          import QtQuick.Window
          import QtQml
          
          Window {
              width: 640
              height: 480
              visible: true
              title: qsTr("Hello World")
              Connections {
                  target: sig
                  function onRectClicked() { console.log("signal received.")}
              }
              Signaler {}
          }
          

          and:

          import QtQuick
          import QtQuick.Controls
          
          Rectangle {
              id: sig
              signal rectClicked
              height: 100
              width: 100
              color: 'lightBlue'
              MouseArea {
                  id: mouseArea
                  anchors.fill: parent
                  onClicked: {
                      console.log("emitting rectClicked().")
                      sig.rectClicked()
                  }
              }
          }
          

          but that gives me a runtime error (actually, two):

          qrc:/qt/qml/connections/Main.qml:10:5: QML Connections: Detected function "onRectClicked" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
          qrc:/qt/qml/connections/Main.qml:11: ReferenceError: sig is not defined
          QML debugging is enabled. Only use this in a safe environment.
          
          J 1 Reply Last reply 25 Sept 2023, 01:45
          0
          • M mzimmers
            25 Sept 2023, 01:33

            @johngod I tried that:

            import QtQuick
            import QtQuick.Window
            import QtQml
            
            Window {
                width: 640
                height: 480
                visible: true
                title: qsTr("Hello World")
                Connections {
                    target: sig
                    function onRectClicked() { console.log("signal received.")}
                }
                Signaler {}
            }
            

            and:

            import QtQuick
            import QtQuick.Controls
            
            Rectangle {
                id: sig
                signal rectClicked
                height: 100
                width: 100
                color: 'lightBlue'
                MouseArea {
                    id: mouseArea
                    anchors.fill: parent
                    onClicked: {
                        console.log("emitting rectClicked().")
                        sig.rectClicked()
                    }
                }
            }
            

            but that gives me a runtime error (actually, two):

            qrc:/qt/qml/connections/Main.qml:10:5: QML Connections: Detected function "onRectClicked" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
            qrc:/qt/qml/connections/Main.qml:11: ReferenceError: sig is not defined
            QML debugging is enabled. Only use this in a safe environment.
            
            J Offline
            J Offline
            JKSH
            Moderators
            wrote on 25 Sept 2023, 01:45 last edited by
            #4

            @mzimmers said in using Connections with my component:

            qrc:/qt/qml/connections/Main.qml:11: ReferenceError: sig is not defined
            

            Here is your problem. Main.qml cannot see the ID sig. You must add an ID to your object in Main.qml

            Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

            M 1 Reply Last reply 25 Sept 2023, 02:10
            1
            • J JKSH
              25 Sept 2023, 01:45

              @mzimmers said in using Connections with my component:

              qrc:/qt/qml/connections/Main.qml:11: ReferenceError: sig is not defined
              

              Here is your problem. Main.qml cannot see the ID sig. You must add an ID to your object in Main.qml

              M Offline
              M Offline
              mzimmers
              wrote on 25 Sept 2023, 02:10 last edited by
              #5

              @JKSH OK, thank you for that...it works.

              My real use of this is a bit more complicated -- the signal is coming from a component that is loaded through a StackView push.

              ColumnLayout {
                  Connections {
                      target: activitySelector
                      function onSaveClicked (activity) {
                          console.log("ScheduleDetails.qml: received signal from activitySelector!")
                      }
                  }
              
              	UtilityButton {
              		id: activitySelectorButton
              		onClicked: {
              			scheduleDetailsDrawer.open()
              			scheduleDetailsStackView.push("ActivitySelector.qml",
              										  { "id": "activitySelector" }
              										  )
              		}
              	}
              
                  Drawer {
                      id: scheduleDetailsDrawer
                      }
                      StackView {
                          id: scheduleDetailsStackView
                          anchors.fill: parent
                      }
              	}
              }
              

              The signal "saveClicked" comes from within ActivitySelector.qml.

              When I try this, I get similar error messages:

              qrc:/qt/qml/nga_demo/ScheduleDetails.qml:17:5: QML Connections: Detected function "onSaveClicked" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
              qrc:/qt/qml/nga_demo/ScheduleDetails.qml:18: ReferenceError: activitySelector is not defined
              qrc:/qt/qml/nga_demo/ScheduleDetails.qml:86: Error: Cannot assign to non-existent property "id"
              
              J 1 Reply Last reply 25 Sept 2023, 05:34
              0
              • M mzimmers
                25 Sept 2023, 02:10

                @JKSH OK, thank you for that...it works.

                My real use of this is a bit more complicated -- the signal is coming from a component that is loaded through a StackView push.

                ColumnLayout {
                    Connections {
                        target: activitySelector
                        function onSaveClicked (activity) {
                            console.log("ScheduleDetails.qml: received signal from activitySelector!")
                        }
                    }
                
                	UtilityButton {
                		id: activitySelectorButton
                		onClicked: {
                			scheduleDetailsDrawer.open()
                			scheduleDetailsStackView.push("ActivitySelector.qml",
                										  { "id": "activitySelector" }
                										  )
                		}
                	}
                
                    Drawer {
                        id: scheduleDetailsDrawer
                        }
                        StackView {
                            id: scheduleDetailsStackView
                            anchors.fill: parent
                        }
                	}
                }
                

                The signal "saveClicked" comes from within ActivitySelector.qml.

                When I try this, I get similar error messages:

                qrc:/qt/qml/nga_demo/ScheduleDetails.qml:17:5: QML Connections: Detected function "onSaveClicked" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
                qrc:/qt/qml/nga_demo/ScheduleDetails.qml:18: ReferenceError: activitySelector is not defined
                qrc:/qt/qml/nga_demo/ScheduleDetails.qml:86: Error: Cannot assign to non-existent property "id"
                
                J Offline
                J Offline
                JKSH
                Moderators
                wrote on 25 Sept 2023, 05:34 last edited by
                #6

                @mzimmers said in using Connections with my component:

                My real use of this is a bit more complicated -- the signal is coming from a component that is loaded through a StackView push.

                You'll get errors if your Connections object is created before its target even exists.

                Also, id is not a property so you can't assign it like { "id": "activitySelector" }.

                You could create your Connections object dynamically (at the same time as when you call push()). Or, even better, you could do without a Connections at all:

                Component {
                    id: activitySelectorComp
                    ActivitySelector {
                        onSaveClicked: console.log("ScheduleDetails.qml: received signal from activitySelector!")
                    }
                }
                Button {
                    onClicked: scheduleDetailsStackView.push(activitySelectorComp)
                }
                

                Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

                1 Reply Last reply
                2
                • M mzimmers has marked this topic as solved on 25 Sept 2023, 17:19

                1/6

                25 Sept 2023, 00:11

                • Login

                • Login or register to search.
                1 out of 6
                • First post
                  1/6
                  Last post
                0
                • Categories
                • Recent
                • Tags
                • Popular
                • Users
                • Groups
                • Search
                • Get Qt Extensions
                • Unsolved