Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Update: Forum Guidelines & Code of Conduct

    Unsolved TextField and MouseArea

    QML and Qt Quick
    4
    10
    6469
    Loading More Posts
    • 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
      jimcad last edited by

      I have simple QML component where is text and textfield. Textfield should be editable when clicked it. But long pressing should do other operation. I tried to use MouseArea and propagateCompositeEvents but textfield is not activated for editing any more.

      Here is an example code:

      Rectangle {
        width: 200
        height: 50
        Text {
          anchors.fill: parent
          anchors.rightMargin: parent.width/2
          text: "Title"
        }
        TextField {
          id: textField
          anchors.fill: parent
          anchors.fill: parent
          anchors.leftMargin: parent.width/2
        }
        MouseArea {
          anchors.fill: parent
          propagateComposedEvents: true
          onClicked: { 
            mouse.accepted = false 
            textField.focus = true
            // textfield should be activated for editing...
          }
          onPressAndHold: {
             // do something....
          }
        }
      }
      

      Any ideas to fix this?

      1 Reply Last reply Reply Quote 0
      • J
        johnsmith last edited by

        I am unable to reproduce the issue:

        import QtQuick 2.3
        import QtQuick.Controls 1.2
        
        ApplicationWindow {
            visible: true
            width: 640
            height: 480
            title: qsTr("Hello World")
        
            Rectangle {
              width: 200
              height: 50
              Text {
                anchors.fill: parent
                anchors.rightMargin: parent.width/2
                text: "Title"
              }
              TextField {
                id: textField
                anchors.fill: parent
                anchors.leftMargin: parent.width/2
              }
              MouseArea {
                anchors.fill: parent
                propagateComposedEvents: true
                onClicked: {
                  mouse.accepted = false
                  textField.focus = true
                  // textfield should be activated for editing...
                }
                onPressAndHold: {
                   console.log("LOL")
                }
              }
            }
        }
        

        The above code works for me as I assume you want it to work: a short click makes the text field editable, and a long click does something else. But a long click does not turn the field into a non-editable one once it's been made editable.

        If the issue is that your first click is a long click and does not make the field editable in addition to whatever else you want long clicks to do, then simply do for the long click the same as you're doing for the short click.

        J benlau 2 Replies Last reply Reply Quote 0
        • J
          jimcad @johnsmith last edited by jimcad

          @johnsmith Thanks for testing. Sorry, my example was not completed. It indeed works using your example. But does not if component is inside the stackview page.

          Here is new example:

          import QtQuick 2.3
          import QtQuick.Controls 1.2
          import QtQuick.Layouts 1.1
          
          ApplicationWindow {
              visible: true
              width: 640
              height: 480
              title: qsTr("Hello World")
          
              StackView {
                  anchors.fill: parent
                  initialItem: page
              }
              Component {
                  id: page
                  Rectangle {
                      width: 200
                      height: 50
                      Text {
                          anchors.fill: parent
                          anchors.rightMargin: parent.width/2
                          text: "Title"
                      }
                      TextField {
                          id: textField
                          anchors.top: parent.top
                          anchors.right: parent.right
                          width: parent.width/2
                      }
                      MouseArea {
                          anchors.fill: parent
                          propagateComposedEvents: true
                          onClicked: {
                              mouse.accepted = false
                              textField.focus = true
                              // textfield should be activated for editing...
                          }
                          onPressAndHold: {
                              console.log("LOL")
                          }
                      }
                  }
              }
          }
          
          1 Reply Last reply Reply Quote 0
          • B
            Brocan last edited by Brocan

            You can replace

            textField.focus = true
            

            with

            textField.forceActiveFocus()
            

            It will properly set the focus, but it will still doesn't act like without MouseArea.

            1 Reply Last reply Reply Quote 0
            • benlau
              benlau Qt Champions 2016 @johnsmith last edited by

              @johnsmith Your code will disable click to change cursor position.

              J 1 Reply Last reply Reply Quote 0
              • J
                johnsmith @benlau last edited by

                @benlau But my code only adds an ApplicationWindow and a call to console.log()?

                J benlau 2 Replies Last reply Reply Quote 0
                • J
                  jimcad @johnsmith last edited by

                  @johnsmith @benlau Thanks, now it works. Is it possible allow to change cursor position? I can't even calculate position because TextField doesn't contain postionAt() function...

                  J benlau 2 Replies Last reply Reply Quote 0
                  • J
                    johnsmith @jimcad last edited by

                    @jimcad TextField has a cursorPosition property.

                    1 Reply Last reply Reply Quote 0
                    • benlau
                      benlau Qt Champions 2016 @johnsmith last edited by

                      @johnsmith ah yes, so the problem is on original code.

                      1 Reply Last reply Reply Quote 0
                      • benlau
                        benlau Qt Champions 2016 @jimcad last edited by

                        @jimcad I write a custom MouseArea which will by pass any mouse event but it could still generate pressAndHold signal.

                        That is my code:
                        quickandroid/TextField.qml at master · benlau/quickandroid
                        quickandroid/qamousesensor.cpp at master · benlau/quickandroid

                        I also want to know is there any alternative way available..

                        1 Reply Last reply Reply Quote 1
                        • First post
                          Last post