Use hovered and hoverEnabled in a TextField



  • Hi all,

    How to use these read-only features, hoverEnabled and hovered for a TextField in a QML project, please?

    Also, is it possible to use mouse selection or cut/copy/paste the text filed's text, too?


  • Moderators

    @tomy said in Use hovered and hoverEnabled in a TextField:

    How to use these read-only features, hoverEnabled and hovered for a TextField in a QML project, please?

    like so ?

    Item{
        TextField{
            anchors.fill: parent
            ...... 
       }
       MouseArea{
            anchors.fill: parent
            hoverEnabled: true
            propagateComposedEvents: true
    
            onClicked: mouse.accepted = false
            onPressed: mouse.accepted = false
            onReleased: mouse.accepted = false
            onPositionChanged: mouse.accepted = false
            onDoubleClicked: mouse.accepted = false
            onPressAndHold: mouse.accepted = false
            onContainsMouseChanged: if(containsMouse) console.log("Mouse over TextField")
        }
    }
    


  • @J.Hilk

    Do we always need a wrapper, like an Item, over a component to make use of a feature of it when it's in read-only?

    And, how to implement this, please?

    Item {
           id: item
    
           TextField {
               id: field
               placeholderText: qsTr("Enter Your Name")
           }
    
           MouseArea {
               anchors.fill: parent
               hoverEnabled: true
               propagateComposedEvents: true
           }
       }
    
    Button {
           text: "Next"
           anchors.top: item.bottom   // doesn't work!
           onClicked: // do sth
       }
    

  • Moderators

    @tomy maybe I misunderstood what you want to do,

    can you explain a bit more?



  • @J.Hilk

    In the first question I aimed to ask: In two of the links I sent there's text, read-only, on the right-hand side of the description of the feature for Textfield. Please see. I used those features without any wrapper like Item here, and they were marked as unrecognized, hence seemingly the wrapper is required and the read-only is saying that.

    In the second question: I wanted to share with you a snippedcode where such a wrapper is applied, there's a problem, the "doesn't work" comment, in it. And asked how to solve it, please.


  • Qt Champions 2018

    hoverEnabled is not read-only, hovered is.

    If you want to know if a TextField is hovered, set hoverEnabled to true, you will then be able to read the hovered property.



  • @GrecKo
    Like this?

    Window {
        visible: true
        width: 640; height: 480
        title: qsTr("Hello World")
    
            TextField {
                id: field
                visible: false
                placeholderText: qsTr("Enter Your Name")
                hoverEnabled: true
                hovered: true
            }
     }
    

    Invalid property assignment: "hovered" is a read-only property


  • Moderators

    @tomy
    close

    Window {
        visible: true
        width: 640; height: 480
        title: qsTr("Hello World")
    
            TextField {
                id: field
                visible: false
                placeholderText: qsTr("Enter Your Name")
                hoverEnabled: true
                onHoveredChanged: console.log("Hovered changed to", hovered)
            }
     }
    
    


  • @J.Hilk
    Thank you, but still can't find the hovered property used in this code!

    Let's clarify the issue originally.
    1- What is the meaning of read-only when it's used in a property description like hovered, except for its literal meaning?
    2- How to use them, if they are usable by the developer?



  • Hi @tomy , here is the sample code:-

     TextField {
                    id: field
                    placeholderText: qsTr("Enter Your Name")
                    color: hovered ? "red" : "black"
                    //                    hoverEnabled: true
                    onHoveredChanged: console.log("Hovered changed to", hovered,hoverEnabled)
                }
    

    @J-Hilk ,@GrecKo , i dont know but by default the hoverEnabled property is true, you dont need to set it.But when i look into the documentation[https://doc.qt.io/qt-5/qml-qtquick-controls2-textfield.html], it says by default it is false.

    0_1558074179254_8b25ed23-e8ff-47f6-b1fb-f53e77177ac9-image.png

    Does TextField behave differently in different versions?But i checked the code on both Qt5.9.2 and Qt5.12.2


  • Moderators

    @tomy said in Use hovered and hoverEnabled in a TextField:

    but still can't find the hovered property used in this code!

    ?

    onHoveredChanged: console.log("Hovered changed to", hovered)

    The hovered state changes and you get a console log about the change and a console log about the hovered current state


  • Qt Champions 2018

    @tomy said in Use hovered and hoverEnabled in a TextField:

    Thank you, but still can't find the hovered property used in this code!

    ctrl-f "hovered"

    1- What is the meaning of read-only when it's used in a property description like hovered, except for its literal meaning?

    No other meaning than its literal meaning, you can only read it, not write to it.
    So hovered: true can't work. It's the TextField that's telling you wether it is hovered, not you the developper that's telling it.

    2- How to use them, if they are usable by the developer?

    By reading it/reacting on its changes.

    https://doc.qt.io/qt-5/qtqml-syntax-objectattributes.html#read-only-properties


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.