It is currently December 7th, 2023, 6:19 am

Help with Mouse Over

Get help with creating, editing & fixing problems with skins
User avatar
balala
Rainmeter Sage
Posts: 15823
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Help with Mouse Over

Post by balala »

TroVo05 wrote: March 3rd, 2023, 2:38 pm Here is an update......attached is my code and also a video of the skin working.....
Looks good, however I probably would tend to add some icons / images for the Discord, Edge and Photoshop buttons as well, instead of having such an image only for iTunes. If you've did it for iTunes, similarly you can add images for the other buttons as well, altering the ImageName option of the [MeterItunes_ICON] meter, when you're hovering the mouse over any of those button meters ([MeterITUNES_BUTTON], [MeterDiscord_BUTTON], [MeterEdge_BUTTON] or [MeterPhotoshop_BUTTON]), besides showing the [MeterItunes_ICON] meter up.
For instance:

Code: Select all

[MeterItunes_ICON]
Meter=IMAGE
X=200
Y=300
H=300
W=300
Hidden=1
;ImageName=#@#ItunesLogo.png

...

[MeterITUNES_BUTTON]
Meter=BUTTON
X=-300R
Y=200
ButtonImage=#@#ItunesMusic2.png
ButtonCommand=["#LINKS#iTunes.lnk""]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#ItunesLogo.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterDiscord_BUTTON]
Meter=BUTTON
X=-300R
Y=249
ButtonImage=#@#Discord.png
ButtonCommand=["#LINKS#Discord.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Discord.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterEdge_BUTTON]
Meter=BUTTON
X=-300R
Y=298
ButtonImage=#@#Edge.png
ButtonCommand=["#LINKS#Microsoft Edge.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Edge.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterPhotoshop_BUTTON]
Meter=BUTTON
X=-300R
Y=347
ButtonImage=#@#Photoshop.png
ButtonCommand=["#LINKS#Photoshop.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Photoshop.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]
As you can see I added a MouseOverAction / MouseLeaveAction option pair to each of those Button meters, which set the appropriate image to the ButtonImage option of the [MeterItunes_ICON] meter, update it and finally show it. And I did one more, I removed (in fact I just commented out so far, but can be removed as well) the ImageName option of the meter, because since this images are set dynamically by the !Setoption bangs of the MouseOverAction options, the image doesn't have to be set specifically on the meter (however there is nothing wrong, even if you leave it there either).
I hope it's obvious that you have to have the appropriate images in the @Resource folder (Discord.png, Edge.png and Photoshop.png, besides the existing ItunesLogo.png).
Obviously this can be ignored, however in my opinion it looks much better to have images for all of those buttons.
TroVo05
Posts: 10
Joined: March 1st, 2023, 9:04 pm

Re: Help with Mouse Over

Post by TroVo05 »

balala wrote: March 3rd, 2023, 5:03 pm Looks good, however I probably would tend to add some icons / images for the Discord, Edge and Photoshop buttons as well, instead of having such an image only for iTunes. If you've did it for iTunes, similarly you can add images for the other buttons as well, altering the ImageName option of the [MeterItunes_ICON] meter, when you're hovering the mouse over any of those button meters ([MeterITUNES_BUTTON], [MeterDiscord_BUTTON], [MeterEdge_BUTTON] or [MeterPhotoshop_BUTTON]), besides showing the [MeterItunes_ICON] meter up.
For instance:

Code: Select all

[MeterItunes_ICON]
Meter=IMAGE
X=200
Y=300
H=300
W=300
Hidden=1
;ImageName=#@#ItunesLogo.png

...

[MeterITUNES_BUTTON]
Meter=BUTTON
X=-300R
Y=200
ButtonImage=#@#ItunesMusic2.png
ButtonCommand=["#LINKS#iTunes.lnk""]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#ItunesLogo.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterDiscord_BUTTON]
Meter=BUTTON
X=-300R
Y=249
ButtonImage=#@#Discord.png
ButtonCommand=["#LINKS#Discord.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Discord.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterEdge_BUTTON]
Meter=BUTTON
X=-300R
Y=298
ButtonImage=#@#Edge.png
ButtonCommand=["#LINKS#Microsoft Edge.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Edge.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]

[MeterPhotoshop_BUTTON]
Meter=BUTTON
X=-300R
Y=347
ButtonImage=#@#Photoshop.png
ButtonCommand=["#LINKS#Photoshop.lnk"]
MouseOverAction=[!SetOption MeterItunes_ICON ImageName "#@#Photoshop.png"][!UpdateMeter "MeterItunes_ICON"][!ShowMeter "MeterItunes_ICON"][!Redraw]
MouseLeaveAction=[!HideMeter "MeterItunes_ICON"][!Redraw]
As you can see I added a MouseOverAction / MouseLeaveAction option pair to each of those Button meters, which set the appropriate image to the ButtonImage option of the [MeterItunes_ICON] meter, update it and finally show it. And I did one more, I removed (in fact I just commented out so far, but can be removed as well) the ImageName option of the meter, because since this images are set dynamically by the !Setoption bangs of the MouseOverAction options, the image doesn't have to be set specifically on the meter (however there is nothing wrong, even if you leave it there either).
I hope it's obvious that you have to have the appropriate images in the @Resource folder (Discord.png, Edge.png and Photoshop.png, besides the existing ItunesLogo.png).
Obviously this can be ignored, however in my opinion it looks much better to have images for all of those buttons.
Yeah, i will be doing icons for each just like the itunes. i am trying to decide if i want to make icons myself or find something online. thats the hold up at the moment. after that, next will be adding a time, day, month, above the words. one hopefully one day, understand how to do the audio side of things :)
User avatar
balala
Rainmeter Sage
Posts: 15823
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Help with Mouse Over

Post by balala »

TroVo05 wrote: March 3rd, 2023, 5:12 pm Yeah, i will be doing icons for each just like the itunes. i am trying to decide if i want to make icons myself or find something online.
I recommend to find some icons out there and use those ones. Just for tryout. If you are enough satisfied, you can try to creat your own icons, but probably doesn't worth to start with this.
TroVo05 wrote: March 3rd, 2023, 5:12 pm after that, next will be adding a time, day, month, above the words. one hopefully one day, understand how to do the audio side of things :)
Not sure where you want to add the time, day and month and what kind of words you need, but if further questions arise, please feel free to come back with them. Also not sure I understand what you mean by "do the audio side of things", unless you intend to play some audio when you're hovering the mouse over the icons / buttons or when you're leaving them.
TroVo05
Posts: 10
Joined: March 1st, 2023, 9:04 pm

Re: Help with Mouse Over

Post by TroVo05 »

balala wrote: March 3rd, 2023, 6:31 pm I recommend to find some icons out there and use those ones. Just for tryout. If you are enough satisfied, you can try to creat your own icons, but probably doesn't worth to start with this.

Not sure where you want to add the time, day and month and what kind of words you need, but if further questions arise, please feel free to come back with them. Also not sure I understand what you mean by "do the audio side of things", unless you intend to play some audio when you're hovering the mouse over the icons / buttons or when you're leaving them.
i want to complete a whole suite so i want to have the audio meters when spotify/itunes is playing and show the bars bouncing etc.....
User avatar
balala
Rainmeter Sage
Posts: 15823
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Help with Mouse Over

Post by balala »

TroVo05 wrote: March 3rd, 2023, 6:54 pm i want to complete a whole suite so i want to have the audio meters when spotify/itunes is playing and show the bars bouncing etc.....
For this you have to add AudioLevel plugin measures and have to reduce the Update. Better would be in my opinion, to place these two things into two different skin, one with the default Update=1000 for the launcher (with the existing code) and the other with a reduced Update for the bouncing bars.