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. QML OUTFOCUS DETECTION
Forum Updated to NodeBB v4.3 + New Features

QML OUTFOCUS DETECTION

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
8 Posts 3 Posters 3.0k Views 1 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
    Madesh R
    wrote on last edited by
    #1

    Hi ,
    Is there some way that I can detect mouse click outside any focussed element.So that I can do some thing when such an event occurs. Say for example , I have a Text input field, when it's in active state, the users clicks outside the textInput field ,anywhere on the screen ,other than inside of that text field.How to handle this situation.

    Thanks in Advance

    1 Reply Last reply
    0
    • dheerendraD Offline
      dheerendraD Offline
      dheerendra
      Qt Champions 2022
      wrote on last edited by
      #2

      For outside area you can define the MouseArea and handle the appropriate signals.

      Dheerendra
      @Community Service
      Certified Qt Specialist
      http://www.pthinks.com

      1 Reply Last reply
      0
      • M Offline
        M Offline
        Madesh R
        wrote on last edited by
        #3

        Thank You sir.
        Will try the same.
        there is a signal called onExited, I think that should solve my problem.

        1 Reply Last reply
        0
        • dheerendraD Offline
          dheerendraD Offline
          dheerendra
          Qt Champions 2022
          wrote on last edited by
          #4

          if you want to catch the mouseHover then onExited will help you. For this you need to set hoverEnabled to true in MouseArea.

          Dheerendra
          @Community Service
          Certified Qt Specialist
          http://www.pthinks.com

          1 Reply Last reply
          1
          • M Offline
            M Offline
            Madesh R
            wrote on last edited by
            #5

            This is the code that I'm using .
            The problem with using mouse area is that , If mouse area is set to entire screen i'm not able to edit TextField.
            When I'm editing text, on clicking anywhere on the screen other than than text Input Field, I want my timer to restart.Not able to achieve this

            import QtQuick 2.9
            import QtQuick.Window 2.3
            import QtQuick.Controls 2.2
            Window {
            id:root
            visible: true
            width: 640
            height: 480
            title: qsTr("Timer")
            property bool blink:false
            property int blinkInterval:10000

            TextField {
            
                id:textField
                width:100
                height:100
                text: "test"
                onTextChanged:
                {
                    reset()
                }
                background: Rectangle{
                    id:back
                    color: "white"
                    width:100
                    height:100
                    //anchors.fill: parent
                    ColorAnimation on color{
                        from: "blue"
                        to: "white"
                        duration: 500
                        running:root.blink
                        loops: 30
                        onStopped:
                        {
                            console.log("Focus value:" + textField.focus);
                            textField.focus=false ;
                        }
            
                    }
                }
            
            }
            
            function reset(){
                timer.restart()
                root.blink=false
                back.color="white"
            }
            
            Timer{
                id:timer
                running: textField.focus
                repeat: false
                interval: root.blinkInterval
                onTriggered: {
                    root.blink=true
                }
            }
            
            MouseArea{
                anchors.fill:parent
                onClicked: {
                    console.log("Mouse Clicked")
                    if(textField.focus === true)
                    {
                        //If clicked anywhere ,other than textinput field(Not handled the textInput area yet)
                       //then reset the timer
                        
                        reset();
                    }
                }
            }
            

            }

            1 Reply Last reply
            0
            • dheerendraD Offline
              dheerendraD Offline
              dheerendra
              Qt Champions 2022
              wrote on last edited by
              #6

              I'm giving you some sample piece handle the mouse events appropriately. Check and adjust the same to your program.

              Rectangle {
                  width: 400;height: 400;color:"red"
              
                  MouseArea{
                      anchors.fill: parent
                      //enabled: false
                      hoverEnabled: true
                      onClicked: {
                          console.log("Go to hell")
                      }
                      onEntered:{
              
                      }
                      onPositionChanged:{
                          //console.log(" Pos changed ="+mouse.x + " Y ="+mouse.y)
                          var point = Qt.point(mouse.x,mouse.y)
                          if (t.contains(point)) {
                              console.log("I am inside the text field")
                          }
                      }
                  }
                  TextField{
                      id : t
                      text: "Welcome"
                      hoverEnabled: true
                  }
              }
              

              Dheerendra
              @Community Service
              Certified Qt Specialist
              http://www.pthinks.com

              1 Reply Last reply
              2
              • dheerendraD Offline
                dheerendraD Offline
                dheerendra
                Qt Champions 2022
                wrote on last edited by
                #7

                Did the solution worked for you ? If it worked move the issue to SOLVED state. It helps others.

                Dheerendra
                @Community Service
                Certified Qt Specialist
                http://www.pthinks.com

                1 Reply Last reply
                0
                • Shrinidhi UpadhyayaS Offline
                  Shrinidhi UpadhyayaS Offline
                  Shrinidhi Upadhyaya
                  wrote on last edited by
                  #8

                  Hi @Madesh-R , sorry for the late answer,but if instead of handling the cordinates and the position in the mouseArea,i guess the below code is a more optimal way,

                  TextField  {
                      id:textField
                      width:100
                      height:100
                      z: 1
                      focus: activeFocus
                     }
                  
                   MouseArea {
                   anchors.fill: parent
                  z:0
                  onClicked: {
                      console.log("Hello")
                      forceActiveFocus()
                  }
                  

                  }

                  Shrinidhi Upadhyaya.
                  Upvote the answer(s) that helped you to solve the issue.

                  1 Reply Last reply
                  2

                  • Login

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