Find the Best Demos and Examples

Check out this quick tour to find the best demos and examples for you, and to see how the Felgo SDK can help you to develop your next app or game!

Forums

OverviewFelgo 2 Support (Qt 5) › AppTextEdit resets cursor location when character limit is reached

Tagged: 

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #19363

    Eric

    Hello,

    I’m using AppTextEdit for user input. I am also using Javascript to limit the number of characters allowed. However, once the character limit is passed, the Javascript code reverts the text to the previous value and when it does so, the cursor in the text area resets to the beginning of the text. Below is my code:

     

           Rectangle {
                width: parent.width
                height: dp(200)
                border.width: dp(1)
                border.color: "#000000"
                radius: dp(10)
    
                AppFlickable {
                    id: flick
    
                    anchors.top: parent.top
                    anchors.topMargin: dp(10)
                    anchors.right: parent.right
                    anchors.rightMargin: dp(10)
    
                    width: parent.width - dp(20)
                    height: parent.height - dp(20)
                    contentWidth: comment_text.paintedWidth
                    contentHeight: comment_text.paintedHeight
                    clip: true
    
                    function ensureVisible(r) {
                        if (contentX >= r.x)
                            contentX = r.x;
                        else if (contentX + width <= r.x + r.width)
                            contentX = r.x + r.width - width;
                        if (contentY >= r.y)
                            contentY = r.y
                        else if (contentY + height <= r.y + r.height)
                            contentY = r.y + r.height - height;
                    }
    
                    function limitLength() {
                        if (comment_text.text.length <= app.max_comment_length) {
                            comment_text.temp_text = comment_text.text.slice(0);
                        } else {
                            comment_text.text = comment_text.temp_text.slice(0)
                        }
                    }
    
                    AppTextEdit {
                        id: comment_text
                        property string temp_text
                        width: flick.width
                        height: flick.height
                        verticalAlignment: AppTextEdit.AlignTop
                        focus: true
                        wrapMode: TextEdit.Wrap
                        onCursorRectangleChanged: flick.ensureVisible(cursorRectangle)
                        onTextChanged: flick.limitLength()
                        placeholderText: "Enter notes here..."
                    }
                }
            }

    I’ve tried multiple methods of limiting the character length allowed but they all do the same thing to the cursor. It seems that any time the text is changed via a Javascript function, QML interprets this as possibly removing the text then setting it again, which causes the cursor to reset.

     

    Any help with this would be greatly appreciated.

     

    Thank you,
    Eric Schmidt

    #19365

    Alex
    Felgo Team

    Hi Eric,

    have you tried setting the cursor position manually after changing the text?

    Cheers,
    Alex

    #19367

    Eric

    Thank you, Alex. Not sure how I missed that. But in case anybody else is interested, I made two changes to my code, first I changed the else {} section of the limitLength() function to

     

    } else {
      var cursor_pos = getCursorPosition() // This function is defined below
      comment_text.text = comment_text.temp_text.slice(0)
      comment_text.cursorPosition = cursor_pos
    }

     

    Then I added the getCursorPosition() function:

     

    function getCursorPosition() {
      for (var i = 0; i < comment_text.temp_text.length; i++) {
      if (comment_text.temp_text[i] !== comment_text.text[i])
        break
      }
      return i
    }

     

    The only somewhat strange behavior is that if a character is entered by the user that is the same as the character located at the current cursor position, the character is replaced and the cursor moves forward one spot.

     

    The main problem with this that I can see is the iteration in getCursorPosition() in that if the allowed character count is very large, the code may have to iterate through a large string to get the cursor position.

     

    So, if anybody sees this and has a better/cleaner/more efficient way of doing this, please let me know.

     

    Thank you,
    Eric

Viewing 3 posts - 1 through 3 (of 3 total)

RSS feed for this thread

You must be logged in to reply to this topic.