QML MouseArea

actionking

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

sierdzio

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

actionking

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

actionking

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

sierdzio

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
// [...]
}
}
@

actionking

@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
}
}
}
}@

sierdzio

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.

actionking

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

actionking

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

sierdzio

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

sierdzio

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

actionking

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