QML MouseArea



  • Hello guys,
    I I'm beginner to Qml....I have been working in that for just 12 days..And now i have learnt some basic things...And i have been working in that mouse event area for some days...Let i will be clear about my problem..In a full screen, i have created icon for update and delete(delete icon and update icon).My task is to show the names of delete and update in the bottom of those icons,whenever i enters into that delete icon and update icon.If i enters in to that means ,its size is increasing and its ok...but i want to show the name of those icons below those icons..Please help me guys.I will be so much thankful


  • Moderators

    Just add a Text element and make it's "visible" property conditional depending on your mouse enter and leave events.



  • Thank you very much.Could you please tell me in an example



  • Within a mouseArea how will we add text concept..I have tried it out,but it is showing error..Please help me


  • Moderators

    Show me your code, then. Do you expect me to write your app for you?

    A quick example:
    @
    Image {
    id: yourImage

    MouseArea {
    id: mouseArea
    hoverEnabled: true
    anchors.fill: parent

    onEntered: myText.visible = true;
    onExited: myText.visible = false; 
    

    }

    Text {
    id: myText
    // [...]
    }
    }
    @



  • @import QtQuick 1.0
    Image{
    width:1300
    height:800
    id:original
    source:"img/originalblue.png"
    anchors.fill:parent
    Image{
    id:view
    width:350
    height:60
    source:"img/g5.png"
    anchors.top:parent.top
    anchors.topMargin: 10
    anchors.horizontalCenter: parent.horizontalCenter
    Text {
    id: view1
    text: qsTr("View/Modify Speciality")
    font.pixelSize: 30
    anchors.centerIn: parent
    }
    }
    Image{
    id:delete1
    source:"img/deleticon.png"
    width:80
    height:80
    anchors.left:parent.left
    anchors.leftMargin: 70
    anchors.bottom:parent.bottom
    anchors.bottomMargin: 60
    MouseArea{
    id:del
    hoverEnabled: true
    anchors.fill:parent
    onEntered:
    {
    delete1.width=80
    delete1.height=100
    }
    onExited:
    {
    delete1.width=80
    delete1.height=80
    }
    }
    }
    }@


  • Moderators

    Use '@' tags and format your code so that it's readable.

    You just need to anchor the Text element properly (like anchors.bottom: parent.bottom) and it will work.



  • boss i just need to know,can we use text inside the mouse event....



  • when i enters the deleticon.png , i want to show the delete name below the deleticon..please tell me in code.i will be so much thankful to you


  • Moderators

    Yes, I have already shown you how in my first snippet.


  • Moderators

    @
    Text {
    id: view2
    text: qsTr("Delete")
    font.pixelSize: 30
    anchors.top: delete1.bottom
    anchors.horizontalCenter: delete1.horizontalCenter
    }
    @



  • Thank you very much bosss...Almost its worked...
    With regards,
    mohanakannan


Log in to reply
 

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