Having trouble with a mouse over menu

[cataback2]

I am attempting to make a mouse over menu that when I hover over my hex based icons there will be a wheel of icons around it that I can select from. I tried retracing the code from Hover Hub (https://www.reddit.com/r/Rainmeter/comments/2qgp77/oc_hover_hub_simple_mouseover_menu/) but I can't seem to figure out the relationship between the mousing over the icon and the creation of the menu so I'm hoping that someone could explain it to me.

[balala]

Create the icons as you want and hide them (add a Hidden=1 option to all of those meters). Include all of them into a group, let's name that group as Icons (add a Group=Icons option to all of those meters). Add to the [Rainmeter] section the following options:

Code: Select all

[Rainmeter]
MouseOverAction=[!ShowMeterGroup "Icons"][!Redraw]
MouseLeaveAction=[!HideMeterGroup "Icons"][!Redraw]

These options show / hide the Icons group when you're hovering the mouse over the skin, or leaving it.
Depending on how that skin is built, maybe the following options also should have to be added to the same [Rainmeter] section:

Code: Select all

[Rainmeter]
MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]
BackgroundMode=2
SolidColor=0,0,0,1

The above SolidColor option creates an invisible background to the skin, which reacts to the mouse hovering.

[cataback2]

That worked great but even with adding the

BackgroundMode=2
SolidColor=0,0,0,1

the icons go away as I take the mouse off the original icon to move to the others. Do I have to create a background image to cover all the icons while they are there or is there another way to do this?

Also on a side note I noticed I had trouble adding images to the left of the main image, do I also have to add a background that is bigger than the main image for that as well? I thought

DynamicWindowSize=1

was supposed to fix this but it doesn't seem to work.

[balala]

the icons go away as I take the mouse off the original icon to move to the others. Do I have to create a background image to cover all the icons while they are there or is there another way to do this?

The SolidColor option, along with BackgroundMode creates an invisible background, No need to create an image as well.

Also on a side note I noticed I had trouble adding images to the left of the main image, do I also have to add a background that is bigger than the main image for that as well? I thought

Depends where the new image is positioned. If it goes outside of the skin to left, there is no possibility to make it visible.
But best would be to post the whole code or, if the skin uses more resources (images for example) pack the whole config and upload it.

[cataback2]

I attached the code, hope it works it was my first time packaging

I believe the

Code: Select all

SolidColor=0,0,0,1
BackgroundMode=2

wasn't working because I have a small gap between the images, do they have to be touching?

Also thanks for the really fast responses i'm amazed!

[balala]

The BackgroundMode option (along with SolidColor) can be used ONLY on the [Rainmeter] section, no way on meters. So, move both options there.
Another issue is that if you add the MouseOverAction and MouseLeaveAction options to each meter, when you're trying to move from one to the other, for a short moment the mouse leaves the current icon, before it goes over the next one. In this moment the icons are hidden. As hidden, they don't react to mouse hovering. That's why the icons are going away immediately you're leaving the main icon ([MeterButtonOriginal]).
That's why I also would move the MouseOverAction and MouseLeaveAction options to the [Rainmeter] section (be careful, not just add them to [Rainmeter], but move them, removing them from each meter!):

Code: Select all

[Rainmeter]
Update=1000
AccurateText=1
DynamicWindowSize=1
SolidColor=0,0,0,1
BackgroundMode=2
MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]

[MeterButtonOriginal]
Meter=Button
ButtonImage=#@#Images\SteamHexButton.png

[MeterButton2]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=75r
Y=45r
;MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
;MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]

[MeterButton3]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=-75r
Y=45r
;MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
;MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]

[MeterButton4]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=-75r
Y=-45r
;MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
;MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]

Eventually you also could try to remove the DynamicWindowSize=1 option, from the same [Rainmeter] section.
As I guessed the icons going outside to left from the skin can't be made visible. No way. To make it visible, you have to move the [MeterButton4] meter to right, increasing its X value.

[cataback2]

So just curious what technically does putting something in the main Rainmeter field do, does it apply it to each field after?

Is there some way of getting the same background effect but have it a shape other than a rectangle?

Do you think it might be possible to avoid the "can't place images to the left" problem by having the subicons be created in a separate file that is called on by the main icon? I ask because I haven't done anything like that yet so it would probably take me while.

[eclectic-tech]

So just curious what technically does putting something in the main Rainmeter field do, does it apply it to each field after?

These apply to the entire skin; the meters define the size of the skin which always start at the upper left corner 0,0 and expand down and to the right, never up or left of 0,0.

Is there some way of getting the same background effect but have it a shape other than a rectangle?

Skins are always rectangles. With your mouse over the skin, hold down the "Ctrl"+"Alt" keys and press the left mouse button to see the entire skin size (red haze). It will always be rectangular.

skinsize.png

Do you think it might be possible to avoid the "can't place images to the left" problem by having the subicons be created in a separate file that is called on by the main icon? I ask because I haven't done anything like that yet so it would probably take me while.

The simplest solution is to move your original meter to a centered position then set the other icons meters relative to that; I set the X and Y values of [MeterButtonOriginal] to 75 and now all the other meters with negative relative positions can be seen.

Code: Select all

[Rainmeter]
Update=1000
AccurateText=1
DynamicWindowSize=1
SolidColor=0,0,0,1
BackgroundMode=2
MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]

[MeterButtonOriginal]
Meter=Button
ButtonImage=#@#Images\SteamHexButton.png
X=75
Y=75

[MeterButton2]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=75r
Y=45r
; MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
; MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]
; SolidColor=0,0,0,1
; BackgroundMode=2

[MeterButton3]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=-75r
Y=45r
; MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
; MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]
; SolidColor=0,0,0,1
; BackgroundMode=2

[MeterButton4]
Meter=Button
Hidden=1
Group=Menu
ButtonImage=#@#Images\SkyrimHexButton.png
X=-75r
Y=-45r
; MouseOverAction=[!ShowMeterGroup "Menu"][!Redraw]
; MouseLeaveAction=[!HideMeterGroup "Menu"][!Redraw]
; SolidColor=0,0,0,1
; BackgroundMode=2

[balala]

Do you think it might be possible to avoid the "can't place images to the left" problem by having the subicons be created in a separate file that is called on by the main icon?

It is somehow possible, but definitely not desired. What eclectic-tech had described, is the simplest solution.
You can create a subfolder of the config, place a second skin there, then create options on the main skin to load the second one when the main skin is refreshed, but just a problem: in a such case, if you're moving the main skin, the child skin won't follow it. Plus to showing their meters is not impossible, but nor easy isn't. I recommend eclectic-tech's much simpler solution.