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. How to set the focus on mouse click on the rectangle

How to set the focus on mouse click on the rectangle

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 2.0k Views
  • 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.
  • J Offline
    J Offline
    JennyAug13
    wrote on 2 Dec 2018, 15:21 last edited by
    #1

    Hello, I am learning some thing over qt qml and here is a small example for youir reference.

    import QtQuick 2.6
    import QtQuick.Window 2.2
    import QtQuick 2.0
    import QtQml 2.2 // or later
    
    Window {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
        Rectangle{
            id: rec1
            color: "blue"
            width: 200;height: 200
            anchors.centerIn: parent
            focus: true
            Keys.onPressed: {
                if(event.key === Qt.Key_A){
                   console.log("Key A is pressed");
                   event.accepted = true;
                }
            }
            KeyNavigation.down: rec2
        }
        Rectangle {
            id: rec2
            color: "red"
            width: 100; height: 100
            anchors.centerIn: rec1
            Keys.onPressed: {
                if(event.key === Qt.Key_B){
                   console.log("Key B is pressed");
                   event.accepted = true;
                }
            }
        }
        Keys.onPressed: focus?rec1 :rec2
    }
    
    

    I want to do the same example using mouse click. When mouse is clicked on rec2, then focus should be given to rec2 and "Key B is pressed" is to be printed. How can i solve this?

    1 Reply Last reply
    0
    • J Offline
      J Offline
      JennyAug13
      wrote on 2 Dec 2018, 16:54 last edited by
      #2

      Yes, this is working. Small change has to be done.

      import QtQuick 2.6
      import QtQuick.Window 2.2
      import QtQuick 2.0
      import QtQml 2.2 // or later
      
      Window {
          visible: true
          width: 640
          height: 480
          title: qsTr("Hello World")
          Rectangle{
              id: rec1
              color: "blue"
              width: 200;height: 200
              anchors.centerIn: parent
              focus: true
              Keys.onPressed: {
                  if(event.key === Qt.Key_A){
                     console.log("Key A is pressed");
                     event.accepted = true;
                  }
              }
      //        KeyNavigation.down: rec2
              MouseArea{
                  anchors.fill: rec1
                  onClicked:
                  {
                      rec2.forceActiveFocus()
                  }
              }
          }
          Rectangle {
              id: rec2
              color: "red"
              width: 100; height: 100
              anchors.left: rec1.right
              anchors.verticalCenter:rec1.verticalCenter
              Keys.onPressed: {
                  if(event.key === Qt.Key_B){
                     console.log("Key B is pressed");
                     event.accepted = true;
                  }
              }
          }
          Keys.onPressed: focus?rec1 :rec2
      }
      
      
      1 Reply Last reply
      0

      1/2

      2 Dec 2018, 15:21

      • Login

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