Need Help with Mouse Scroll

[RoseRain]

Hello everyone! I just need a little help with a skin.

I just quickly made this skin...specifically for this question.... (There may be a lot of mistakes as I am not great at it, haha)

I would like to be able to use the mouse wheel to scroll the lyrics up and down within the [LyricsBACKGROUND] shape.... like you would scroll on a simple scrollbar.

No automatic scrolling that scrolls itself, nothing fancy. Just a simple thing.

Scroll the wheel up and down to move the lyrics up and down within the bg box to see the rest of them. Using the wheel to scroll them myself where I want without anything auto. Just simple.

I am struggling to do it, I have looked at other skins, but It's way over my head and I have no idea what to do to just make it simple. Don't know what MouseScroll actions to put or where. If anyone could help me out, I would be really grateful! Thank you for reading.

(I keep most of my skins on the right of the screen, that's why its aligned that way. But I would probably like to center it if I can get it to work)

Code: Select all

[Rainmeter]
Update=1000

[MeasureArtist]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=Spotify
PlayerType=Artist

[MeasureTitle]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=[MeasureArtist]
PlayerType=Title

[MeasureLyrics]
Measure=Plugin
Plugin=NowPlaying.dll
PlayerName=Spotify
PlayerType=Lyrics
Substitute="":"Sorry, nothing here."

;--------------------------------------------------

[LyricsBACKGROUND]
Meter=Shape
X=55
Y=40
Shape=Rectangle 0,0,201,120,0 | StrokeWidth 1 | Stroke Color 255,255,255 | Fill Color 255,255,255,30

[ArtistName]
Meter=String
MeasureName=MeasureArtist
fontweight=0
StringAlign=Right
FontFace=Red Hat Text Medium
StringCase=Normal
FontColor=255,255,255
FontSize=9.5
X=257
Y=1
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

[SongName]
Meter=String
MeasureName=MeasureTitle
FontFace=Red Hat Text Medium
StringCase=Lower
fontweight=0
StringAlign=Right
FontColor=255,255,255
FontSize=9.5
X=257
Y=13
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1


[lyrics]
Meter=String
MeasureName=MeasureLyrics
FontFace=Red Hat Text Medium
StringCase=Normal
fontweight=0
StringAlign=Right
FontColor=255,255,255
FontSize=8
X=254
Y=45
W=200
H=120
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

[RicardoTM]

Hello everyone! I just need a little help with a skin.

I just quickly made this skin...specifically for this question.... (There may be a lot of mistakes as I am not great at it, haha)

I would like to be able to use the mouse wheel to scroll the lyrics up and down within the [LyricsBACKGROUND] shape.... like you would scroll on a simple scrollbar.

No automatic scrolling that scrolls itself, nothing fancy. Just a simple thing.

Scroll the wheel up and down to move the lyrics up and down within the bg box to see the rest of them. Using the wheel to scroll them myself where I want without anything auto. Just simple.

I am struggling to do it, I have looked at other skins, but It's way over my head and I have no idea what to do to just make it simple. Don't know what MouseScroll actions to put or where. If anyone could help me out, I would be really grateful! Thank you for reading.

(I keep most of my skins on the right of the screen, that's why its aligned that way. But I would probably like to center it if I can get it to work)

Code: Select all

[Rainmeter]
Update=1000

[MeasureArtist]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=Spotify
PlayerType=Artist

[MeasureTitle]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=[MeasureArtist]
PlayerType=Title

[MeasureLyrics]
Measure=Plugin
Plugin=NowPlaying.dll
PlayerName=Spotify
PlayerType=Lyrics
Substitute="":"Sorry, nothing here."

;--------------------------------------------------

[LyricsBACKGROUND]
Meter=Shape
X=55
Y=40
Shape=Rectangle 0,0,201,120,0 | StrokeWidth 1 | Stroke Color 255,255,255 | Fill Color 255,255,255,30

[ArtistName]
Meter=String
MeasureName=MeasureArtist
fontweight=0
StringAlign=Right
FontFace=Red Hat Text Medium
StringCase=Normal
FontColor=255,255,255
FontSize=9.5
X=257
Y=1
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

[SongName]
Meter=String
MeasureName=MeasureTitle
FontFace=Red Hat Text Medium
StringCase=Lower
fontweight=0
StringAlign=Right
FontColor=255,255,255
FontSize=9.5
X=257
Y=13
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1


[lyrics]
Meter=String
MeasureName=MeasureLyrics
FontFace=Red Hat Text Medium
StringCase=Normal
fontweight=0
StringAlign=Right
FontColor=255,255,255
FontSize=8
X=254
Y=45
W=200
H=120
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

Hey Rose, is this what you want?

Code: Select all

[Rainmeter]
Update=1000

[Variables]
LyricsY=0
ScrollIncrement=5

[MeasureArtist]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=Spotify
PlayerType=Artist

[MeasureTitle]
Measure=Plugin
Plugin=WebNowPlaying
PlayerName=[MeasureArtist]
PlayerType=Title

[MeasureLyrics]
Measure=Plugin
Plugin=NowPlaying.dll
PlayerName=Spotify
PlayerType=Lyrics
Substitute="":"Sorry, nothing here."
OnChangeAction=[!SetVariable LyricsY 0][!UpdateMeter Lyrics][!Redraw]

;--------------------------------------------------

[ArtistName]
Meter=String
MeasureName=MeasureArtist
fontweight=0
StringAlign=Right
FontFace=Red Hat Text Medium
StringCase=Normal
FontColor=255,255,255
FontSize=9.5
X=257
Y=1
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

[SongName]
Meter=String
MeasureName=MeasureTitle
FontFace=Red Hat Text Medium
StringCase=Lower
fontweight=0
StringAlign=Right
FontColor=255,255,255
FontSize=9.5
X=257
Y=13
W=180
H=20
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1

[LyricsBACKGROUND]
Meter=Shape
X=55
Y=40
Shape=Rectangle 0,0,201,120,0 | StrokeWidth 1 | Stroke Color 255,255,255 | Fill Color 255,255,255,30
MouseScrollDownAction=[!SetVariable LyricsY (clamp([#LyricsY]-[#ScrollIncrement],-10000,0))][!UpdateMeter Lyrics][!Redraw]
MouseScrollUpAction=[!SetVariable LyricsY (clamp([#LyricsY]+[#ScrollIncrement],-10000,0))][!UpdateMeter Lyrics][!Redraw]
MiddleMouseUpAction=[!SetVariable LyricsY 0][!UpdateMeter Lyrics][!Redraw]

[LyricsBGContainer]
Meter=Image
SolidColor=0,0,0,255
x=r
y=8r
W=[LyricsBACKGROUND:W]
H=([LyricsBACKGROUND:H]-[LyricsBACKGROUND:H]/8)
DynamicVariables=1

[lyrics]
Container=LyricsBGContainer
Meter=String
MeasureName=MeasureLyrics
FontFace=Red Hat Text Medium
StringCase=Normal
fontweight=0
StringAlign=Center
FontColor=255,255,255
FontSize=8
X=([LyricsBGContainer:W]/2)
Y=[#LyricsY]
W=([LyricsBGContainer:W]-[LyricsBGContainer:W]/10)
Text=%1
StringEffect=Shadow
FontEffectColor=0,0,0,180
ClipString=1
AntiAlias=1
DynamicVariables=1

Use the ScrollIncrement variable to set a scrolling "speed". LyricsY is only the initial Lyrics position, just leave in 0.

Use scrolling to scroll the lyrics, press the scroll wheel to reset the lyrics position, it also resets automatically when the song changes.

[RoseRain]

This is great! and pretty much what I wanted. Thank you so so much. Really appreciate your help!

[Yincognito]

Use the ScrollIncrement variable to set a scrolling "speed". LyricsY is only the initial Lyrics position, just leave in 0.

Use scrolling to scroll the lyrics, press the scroll wheel to reset the lyrics position, it also resets automatically when the song changes.

A minor observation: I didn't test the code, but when clamping the LyricsY in the scroll actions, you could use the difference between the height of the container meter and the height of the lyrics meter as a low bound, instead of a hardcoded -10000 value. You know, so that it stops at the last lyrics line when scrolling down.

Or, even better, the minimum between that difference and 0, so that the low bound will never be greater than the high bound, and the lyrics won't be scrolling when their height is less than that of the container.

[RoseRain]

A minor observation: I didn't test the code, but when clamping the LyricsY in the scroll actions, you could use the difference between the height of the container meter and the height of the lyrics meter as a low bound, instead of a hardcoded -10000 value. You know, so that it stops at the last lyrics line when scrolling down.

Or, even better, the minimum between that difference and 0, so that the low bound will never be greater than the high bound, and the lyrics won't be scrolling when their height is less than that of the container.

I think what you are saying, if I understood correctly.. is that it stops the scrolling when it hits the end of the lyrics, so it doesn't keep scrolling blank where there is no text. That is actually what I was hoping for. But Reading what you have written there, it sounds like a completely different language to me, and I don't understand it.

[Yincognito]

I think what you are saying, if I understood correctly.. is that it stops the scrolling when it hits the end of the lyrics, so it doesn't keep scrolling blank where there is no text. That is actually what I was hoping for. But Reading what you have written there, it sounds like a completely different language to me, and I don't understand it.

Yep, that's what I was talking about. As for "translating" what I said into practice, maybe these would help:
- scroll actions = the MouseScrollDownAction and MouseScrollUpAction options / lines
- height of the container meter = [LyricsBGContainer:H]
- height of the lyrics meter = [lyrics:H]
- minimum function = Min(somevalue,othervalue)
- all formulas must be enclosed between ( and ) brackets

I suppose the rest is self explanatory - I mean you know where -10000 is in the code, a difference is subtracting, and so on. Try to implement it and see if it works - you have nothing to lose.

[RicardoTM]

I think what you are saying, if I understood correctly.. is that it stops the scrolling when it hits the end of the lyrics, so it doesn't keep scrolling blank where there is no text. That is actually what I was hoping for. But Reading what you have written there, it sounds like a completely different language to me, and I don't understand it.

Don't worry Rose, after a year, I'm just starting to understand his language.

So he is saying, If I understood correctly, to replace:

Code: Select all

MouseScrollDownAction=[!SetVariable LyricsY (clamp([#LyricsY]-[#ScrollIncrement],-10000,0))][!UpdateMeter Lyrics][!Redraw]
MouseScrollUpAction=[!SetVariable LyricsY (clamp([#LyricsY]+[#ScrollIncrement],-10000,0))][!UpdateMeter Lyrics][!Redraw]

With:

Code: Select all

MouseScrollDownAction=[!SetVariable LyricsY (clamp([#LyricsY]-[#ScrollIncrement],(min([LyricsBGContainer:H]-[lyrics:H],0)),0))][!UpdateMeter Lyrics][!Redraw]
MouseScrollUpAction=[!SetVariable LyricsY (clamp([#LyricsY]+[#ScrollIncrement],(min([LyricsBGContainer:H]-[lyrics:H],0)),0))][!UpdateMeter Lyrics][!Redraw]

By the way, also replace ClipString=1 with ClipString=2 on the [Lyrics] meter. I noticed the lyrics where not complete, that was causing it.

The bang uses the Clamp function, it limits a value between a minimum (low bound) and a maximum (high bound) value.
The difference between the height of the container and the height of the lyrics meter is: "[LyricsBGContainer:H]-[lyrics:H]", the H means Height.
This is our minimum or "low bound" (it's a negative value) and 0 would be our "high bound" or maximum. So yes, it stops the scrolling when it hits the end of the lyrics. The min function limits it so it stays at 0 when there are no lyrics.

A minor observation:

Thanks Yin, I honestly didn't come up with how to do it, and was on a rush, so I left it there, hoping someone would notice it and correct me.

[Yincognito]

Don't worry Rose, after a year, I'm just starting to understand his language.

So he is saying, If I understood correctly [...]

Nice one!

Yes, that's what I meant. It would be better to use:

Code: Select all

Min([LyricsBGContainer:H]-[lyrics:H],0)

instead of simply:

Code: Select all

([LyricsBGContainer:H]-[lyrics:H])

because Clamp() acts a bit strange if the low bound is greater than the high bound (which happens when the height of the text is less than the height of the container).

EDIT: Don't mind the above, I just saw you already edited your reply.

[RicardoTM]

EDIT: Don't mind the above, I just saw you already edited your reply.

Yah sorry, 5 min after I posted it I realized why was the min important lol

[Yincognito]

Yah sorry, 5 min after I posted it I realized why was the min important lol

No problemo.