It is currently March 29th, 2024, 6:52 am

Image Changes with mouse click, but does not change until the mouse moves. [solved]

Get help with creating, editing & fixing problems with skins
User avatar
Mor3bane
Posts: 943
Joined: May 7th, 2016, 7:32 am

Image Changes with mouse click, but does not change until the mouse moves. [solved]

Post by Mor3bane »

Hi So I have this set of images. They overlap each other to achieve different visual effects - to highlight a button and its current state.

The ShuffleLight.png and the ContinuousLight.png specifically. I'll post the relevant meters so that they can be easily found in the attached rmskin.

The issue is that these images do not appear until the mouse moves (even one pixel - so close but not there all the way as desired).
Music Control_0xx,xx.rmskin

Code: Select all


[MeterShuffle]
Meter=Image
MeasureName=MeasureShuffle
ImageName=#@#\Continuous.png
ImageTint=#MySepiaTint#
X=123
Y=241
W=35
H=35
Antialias=1
MouseOverAction=[!SetOption "MeterShuffleOver" "Hidden" "0"][!SetOption "MeterContinuousLight" "Hidden" "0"][!Update]
MouseLeaveAction=[!SetOption "MeterShuffleOver" "Hidden" "1"][!SetOption "MeterContinuousLight" "Hidden" "1"][!Update]
DynamicVariables=1
Group=buttons
Hidden=0

[MeterContinuousLight]
Meter=Image
ImageName=#@#ShuffleLight.png
ImageTint=210,170,90,188
X=r
Y=r 
W=35
H=35
LeftMouseDownAction=[!CommandMeasure "MeasureShuffle" "SetShuffle 0"][!SetOption "MeterShuffle" "Hidden" "1"][!SetOption "ShuffleOn" "Hidden" "0"][!Redraw][!Update]
DynamicVariables=1
Group=buttons
Hidden=1

[ShuffleOn]
Meter=Image
MeasureName=MeasureShuffle
ImageName=#@#\Shuffle.png
ImageTint=#MySepiaTint#
X=r
Y=r
W=35
H=35
MouseOverAction=[!SetOption "MeterShuffleOver" "Hidden" "0"][!SetOption "MeterShuffleLight" "Hidden" "0"][!Update]
MouseLeaveAction=[!SetOption "MeterShuffleOver" "Hidden" "1"][!SetOption "MeterShuffleLight" "Hidden" "1"][!Update]
DynamicVariables=1
Group=buttons
Hidden=1

[MeterShuffleLight]
Meter=Image
ImageName=#@#ContinuousLight.png
ImageTint=210,170,90,188
X=r
Y=r 
W=35
H=35
LeftMouseDownAction=[!CommandMeasure "MeasureShuffle" "SetShuffle -1"][!SetOption "MeterShuffle" "Hidden" "0"][!SetOption "ShuffleOn" "Hidden" "1"][!Redraw][!Update]
DynamicVariables=1
Group=buttons
Hidden=1

[MeterShuffleOver]
Meter=Shape
Shape=Rectangle 127,246,27,27,13 | Fill Color 0,0,0,1 | StrokeWidth 1 | Stroke Color 177,133,78,185
DynamicVariables=1
Antialias=1
Hidden=1
The desired effect would be an instant change in image.

Thanks.
You do not have the required permissions to view the files attached to this post.
Last edited by Mor3bane on June 29th, 2020, 1:20 am, edited 1 time in total.
My DevArt Gallery

There are many ways to be different - there is only one way to be yourself - be amazing at it

The law of averages says what it means; even if you get everything right, you will get something wrong. Therefore; self managing error trapping initiates another set of averages - amongst the errors, some of them will not be errors, instead those instances will appear to be "luck". One cannot complain of the 'appearance' of 'infinite regress of causation', even if it does not have a predictable pattern, only that it requires luck to achieve.
User avatar
Active Colors
Moderator
Posts: 1251
Joined: February 16th, 2012, 3:32 am
Location: Berlin, Germany

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by Active Colors »

Mor3bane,
There are two logic errors going on. #1 is caused by not hiding meter that is clicked, and #2 is caused by not showing the meter that should be shown.

#1. For example, MeterShuffleLight is a part of the ON state. Apparently when you click on it in order to hide the ON state and show the meters of the OFF state it should hide iteself as well but in your skin it hides only the base ShuffleOn. Thus, it should hide both ShuffleOn and MeterShuffleLight. And the same is for the OFF state.

#2. I somewhat agree with you here but this part is a bit tricky. Since you show the meter with MouseOverAction when the mouse is already on the meter it can't register that the mouse is already over. The fix would be, for example, when I have the shuffle state ON and when I click MeterShuffleLight it will show both meters of the OFF state which are MeterShuffle and MeterContinuousLight. It is logical to show the two meters right away since the mouse is over those meters already.

Altogether it would look like this.

Code: Select all

[MeterContinuousLight]
LeftMouseDownAction=[!CommandMeasure "MeasureShuffle" "SetShuffle 0"][!SetOption "MeterShuffle" "Hidden" "1"][!SetOption MeterContinuousLight Hidden 1][!SetOption "ShuffleOn" "Hidden" "0"][!SetOption MeterShuffleLight Hidden 0][!Update][!Redraw]

[MeterShuffleLight]
LeftMouseDownAction=[!CommandMeasure "MeasureShuffle" "SetShuffle -1"][!SetOption "ShuffleOn" "Hidden" "1"][!SetOption MeterShuffleLight Hidden 1][!SetOption "MeterShuffle" "Hidden" "0"][!SetOption MeterContinuousLight Hidden 0][!Update][!Redraw]
User avatar
balala
Rainmeter Sage
Posts: 16110
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by balala »

Mor3bane wrote: June 28th, 2020, 1:27 pm The desired effect would be an instant change in image.
In addition to Active Colors's reply, if you want to hide or show a meter, even if it's working to set its Hidden option to 1 or 0, a much better and natural approach is to use the !HideMeter or !ShowMeter bangs. For instance the MouseOverAction option of the [MeterShuffle] meter should be MouseOverAction=[!ShowMeter "MeterShuffleOver"][!ShowMeter "MeterContinuousLight"][!Redraw] instead of the original MouseOverAction=[!SetOption "MeterShuffleOver" "Hidden" "0"][!SetOption "MeterContinuousLight" "Hidden" "0"][!Update].
Again: the original bangs have nothing wrong and they definitely work. But the !ShowMeter / !HideMeter bangs are much more natural to be used, at least in my opinion.
Two other comments as well:
  • If you show / hide some meters (regardless of the used bangs), there is not needed to update the whole skin, through a [!Update] bang. Redrawing it with a [!Redraw] bang is completely enough. I applied this as well into the above MouseOverAction option.
  • The #@# variable includes a backslash, so there si no need to add one more. There is such an extra backslash for instance in the ImageName option of the [MeterShuffle] meter, which can be freely removed: ImageName=#@#Continuous.png instead of ImageName=#@#\Continuous.png. Adding such an extra backslash is not a problem finally (PS here) but it's not needed either.
User avatar
Mor3bane
Posts: 943
Joined: May 7th, 2016, 7:32 am

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by Mor3bane »

Thanks guys.

Things are nice and neat now.

:thumbup: balala
:thumbup: Active Colors
My DevArt Gallery

There are many ways to be different - there is only one way to be yourself - be amazing at it

The law of averages says what it means; even if you get everything right, you will get something wrong. Therefore; self managing error trapping initiates another set of averages - amongst the errors, some of them will not be errors, instead those instances will appear to be "luck". One cannot complain of the 'appearance' of 'infinite regress of causation', even if it does not have a predictable pattern, only that it requires luck to achieve.
User avatar
balala
Rainmeter Sage
Posts: 16110
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by balala »

Mor3bane wrote: June 28th, 2020, 5:57 pm Things are nice and neat now.

:thumbup: balala
Yes, probably things are neat now more due to Active Colors's help, not mine. But I'm glad anyway.
User avatar
Mor3bane
Posts: 943
Joined: May 7th, 2016, 7:32 am

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by Mor3bane »

balala wrote: June 28th, 2020, 6:17 pm Yes, probably things are neat now more due to Active Colors's help, not mine. But I'm glad anyway.
Streamlining code is by no means unmentionable.
My DevArt Gallery

There are many ways to be different - there is only one way to be yourself - be amazing at it

The law of averages says what it means; even if you get everything right, you will get something wrong. Therefore; self managing error trapping initiates another set of averages - amongst the errors, some of them will not be errors, instead those instances will appear to be "luck". One cannot complain of the 'appearance' of 'infinite regress of causation', even if it does not have a predictable pattern, only that it requires luck to achieve.
User avatar
balala
Rainmeter Sage
Posts: 16110
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Image Changes with mouse click, but does not change until the mouse moves.

Post by balala »

Mor3bane wrote: June 28th, 2020, 7:10 pm Streamlining code is by no means unmentionable.
:thumbup:
User avatar
Active Colors
Moderator
Posts: 1251
Joined: February 16th, 2012, 3:32 am
Location: Berlin, Germany

Re: Image Changes with mouse click, but does not change until the mouse moves. [solved]

Post by Active Colors »

Mor3bane, you are welcome man!
Balala's comments are always on point and valuable to learn further.

I totally agree with what balala said. As well as for the optimization's sake you don't need to use !Update to update the whole skin but use !UpdateMeter to update only relevant meters. Further would suggest to set UpdateDivider=-1 for any meters or measures that don't need to be updated by themselves if you design your skin in the way that they are updated only by actions. Same for measures.

For your comfortability I could also suggest to make it easier for you, you can group specific meters that are in the same group, like shuffle buttons since you need to refer to several meters at the same time in several places. I see that you already have Group=button but if you haven't seen before you can group them further by having subgroup like Group=button | shuffle and therefore you can use group bangs like !Show/!HideMeterGroup, !UpdateMeterGroup, and !SetOptionGroup to refer to specific meter groups rather than all buttons at once. Same for grouping measures

Couple of notes.
I think !Hide/!ShowMeter(Group) bangs appeared long time earlier before !SetOption bang was introduced around 2012, that is why !Hide/ShowMeter(Group) exists.

Also, in my opinion !SetOption is better if you are working with a bit more complex or conditional skin to make meters hidden or visible based on some variables and thus you can pass calculated numeric value.

And... if I recall it right, jsmorley once recommended to set transparency of meters to 0 rather than hiding meters. I don't remember particularities unfortunately.