It is currently April 25th, 2024, 7:15 am

Scrollbar for Notes from Moxx.Pack

Get help with creating, editing & fixing problems with skins
DangerousMinds
Posts: 17
Joined: October 7th, 2022, 5:53 pm

Scrollbar for Notes from Moxx.Pack

Post by DangerousMinds »

Hello everyone,

I need some help. I have finally found a note skin that I really like but there is a little thing that I don't like.
I use the notes skin from albinozz Moxx.Pack https://www.deviantart.com/albinozz/art/Moxx-Pack-126166622
Don't wondering because my skin look a little bit different. I changed some little things.

Image

The problem is that if I have more text in my notes then not everything will shown. But I don't want to make the skin bigger. I did that already. Is there a way to integrate a scrollbar to scroll through the notes?
There is a note skin from smurfier https://www.deviantart.com/smurfier/art/ScrollNotes-166021763 that had a scrollbar but the skin is not my thing.

Image

So is there a way to implement a scrollbar like this to the moxx notes skin?

Can someone help me with that? I have no idea how to do that.
User avatar
eclectic-tech
Rainmeter Sage
Posts: 5406
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Scrollbar for Notes from Moxx.Pack

Post by eclectic-tech »

This is a 15 year old skin and was designed with deprecated bangs and an improper install to the main Rainmeter program installation folder (rather than correctly in your 'Skins' folder).

Even with those issues, a scrollable area can still be added to the skin using a Container meter.

First, make sure the skins are installed in the correct folder: 'Skins\Moxx.Pack\'

I made modifications to Moxx.Pack\Notes\MoxxNotes.ini.

Then Replace the entire [Variables] section with this updated section:

Code: Select all

[Variables]

Note=#SkinsPath#Moxx.Pack\Notes\Notes.txt
ToDo=#SkinsPath#Moxx.Pack\Notes\Notes2.txt
Other=#SkinsPath#Moxx.Pack\Notes\Notes3.txt
ToDoDots=#SkinsPath#Moxx.Pack\Notes\ToDoDots.txt

YPosition=-38
LineHeight=13

ScreenHeight=200
;------------------"ScreenHeight2" should be set to 35 more than "ScreenHeight"
ScreenHeight2=235

BoxTransparent=190
;------------------Chose the transparent for the read box 1-255

FontName=Century Gothic
FontColor=255, 255, 255, 255
FontHeight=8
AntiAlias=1
;---------------------------

This corrects the location of your text files and adds variables to scroll the text.

Finally, replace the last 4 string meters in the skin with this code; it has the container meter, changes to the Y position of the 4 note meters, and DynamicVariables=1 added to those meters.

Code: Select all

[Note]
Container=Container
Meter=STRING
MeasureName=MeasureNote
X=5
Y=(38+#YPosition#)
W=190
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=0
DynamicVariables=1

[ToDo]
Container=Container
Meter=STRING
MeasureName=MeasureToDo
X=15
Y=(38+#YPosition#)
W=175
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1

[Other]
Container=Container
Meter=STRING
MeasureName=MeasureOther
X=5
Y=(38+#YPosition#)
W=190
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1

[ToDoDots]
Container=Container
Meter=STRING
MeasureName=MeasureToDoDots
X=5
Y=(38+#YPosition#)
W=190
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
;--------------------------

[Container]
Meter=Shape
X=0
Y=35
Shape=Rectangle 0,0,200,(Max([Open:H],[Box:H]))
MouseScrollUpAction=[!SetVariable YPosition (Clamp(#YPosition#+#LineHeight#,-200,-38))][!UpdateMeter *][!Redraw]
MouseScrollDownAction=[!SetVariable YPosition (Clamp(#YPosition#-#LineHeight#,-200,-38))][!UpdateMeter *][!Redraw]
DynamicVariables=1

With those changes, you can scroll your mouse wheel and move the text up to twice the original height. It is possible to increase that amount by changing the maximum values in the Clamp bang of the container meter.
maxx.gif
Let us know if this works for you. The other changes for deprecated bangs can be done later if desired.
You do not have the required permissions to view the files attached to this post.
DangerousMinds
Posts: 17
Joined: October 7th, 2022, 5:53 pm

Re: Scrollbar for Notes from Moxx.Pack

Post by DangerousMinds »

So after doing everything, it works good. But there are a few little things I would like to change. But I don't know how and if its even possible.

So one thing is that if I have a lot of text in the notes at some point the text will not shown in die skin. Even with the scrolling it can't show the rest of the text. Even after scrolling till the end. What do I have to change so that everything in the textfile will show??

Image Image

So the other thing is, that my mousewheel is broken so I can't use it correctly. Is it possible to extend this code and add a scrollbar to this like in the skin of smurfier, postet in the first post. So I that I can use the scrollbar to scroll through the text. That would be awesome.

And another wild question. Is it possible to add different colors to the text, so that every new paragraph / section has it's own color? Like in the picture. I made this real quick with a graphic program so that is better to understand what I mean.
Image
Last edited by DangerousMinds on February 7th, 2023, 1:46 pm, edited 1 time in total.
User avatar
eclectic-tech
Rainmeter Sage
Posts: 5406
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Scrollbar for Notes from Moxx.Pack

Post by eclectic-tech »

DangerousMinds wrote: February 7th, 2023, 11:51 am I'm relatively new to all this but I will try it with your changes.
Is it possible to extend this and add a scrollbar not only a scrollable area? Because my mousewheel is broken :Whistle :rofl:
Yes, but I do not have time to do that today... it might be time to buy a new mouse ;-)

If you do not get an answer, I will look at this again tomorrow.
DangerousMinds
Posts: 17
Joined: October 7th, 2022, 5:53 pm

Re: Scrollbar for Notes from Moxx.Pack

Post by DangerousMinds »

eclectic-tech wrote: February 7th, 2023, 1:27 pm Yes, but I do not have time to do that today... it might be time to buy a new mouse ;-)

If you do not get an answer, I will look at this again tomorrow.
You was a little bit quicker than me. I edit my post. :D

So ok I'll wait. No problem. I appreciate every help!

Yeah I would love to buy a new mouse but I don't have the money for that at the moment and there are no mouses on the market that I like. Not so easy to find the right one :D
Same with my keyboard. Need a new one but same problems :rolmfao:

But for now thank you!
I'll wait for your answer :)

Ah and this is my new code, because I change some things in the old skin.

Code: Select all


[Rainmeter]
Author=Albinozz
Update=1000

[Variables]

Note=#SkinsPath#Moxx.Pack\Notes\Notes.txt
ToDo=#SkinsPath#Moxx.Pack\Notes\Notes2.txt
Other=#SkinsPath#Moxx.Pack\Notes\Notes3.txt
ToDoDots=#SkinsPath#Moxx.Pack\Notes\ToDoDots.txt

YPosition=-34
LineHeight=13

ScreenHeight=285
;------------------"ScreenHeight2" should be set to 35 more than "ScreenHeight"
ScreenHeight2=320

BoxTransparent=150
;------------------Chose the transparent for the read box 1-255

FontName=Century Gothic
FontColor=255, 255, 255, 255
FontHeight=10
AntiAlias=1
;---------------------------

[MeasureNote]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#Note#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureToDo]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#ToDo#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureOther]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#Other#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureToDoDots]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#ToDoDots#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt
;--------------------------

[Top]
Meter=IMAGE
ImageName=Top.png
X=0
Y=0
W=295
H=35
AntiAlias=1

[Box]
Meter=IMAGE
SolidColor=0, 0, 0, #BoxTransparent#
X=0
Y=35r
W=295
H=#ScreenHeight#
AntiAlias=1
Hidden=0

[Open]
Meter=IMAGE
ImageName=Bottom.png
X=0
Y=r
W=295
H=20
AntiAlias=1
Hidden=1
LeftMouseDownAction=!Execute [!RainmeterRefresh][!RainmeterRedraw]
LeftMouseUpAction=!Execute [!RainmeterRedraw]

[OpenArrow]
Meter=IMAGE
ImageName=Open.png
X=130
Y=r
W=15
H=15
AntiAlias=1
Hidden=1

[Close]
Meter=IMAGE
ImageName=Bottom.png
X=0
Y=#ScreenHeight2#
W=295
H=20
AntiAlias=1
Hidden=0
LeftMouseDownAction=!Execute [!RainmeterHideMeter ToDo][!RainmeterHideMeter ToDoDots][!RainmeterHideMeter Other][!RainmeterHideMeter Note][!RainmeterHideMeter ToDoTitle][!RainmeterHideMeter OtherTitle][!RainmeterHideMeter NotesTitle][!RainmeterHideMeter Box][!RainmeterHideMeter ToDoTitle][!RainmeterHideMeter OtherTitle][!RainmeterHideMeter TabNotes][!RainmeterHideMeter TabNotesSmall][!RainmeterHideMeter TabToDo][!RainmeterHideMeter TabToDoSmall][!RainmeterHideMeter TabOther][!RainmeterHideMeter TabOtherSmall][!RainmeterHideMeter Close][!RainmeterHideMeter CloseArrow][!RainmeterHideMeter Back][!RainmeterShowMeter Open][!RainmeterShowMeter OpenArrow][!RainmeterRedraw]
LeftMouseUpAction=!Execute [!RainmeterRedraw]


[CloseArrow]
Meter=IMAGE
ImageName=Close.png
X=130
Y=r
W=15
H=15
AntiAlias=1
Hidden=0
;---------------------------
[TabNotesSmall]
Meter=IMAGE
SolidColor=187,0,255
X=295
Y=50
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=!Execute [!RainmeterShowMeter TabNotes][!RainmeterHideMeter TabNotesSmall][!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterRedraw]

[TabNotes]
Meter=IMAGE
ImageName=Tab Notes.png
X=295
Y=50
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=!Execute [!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterShowMeter TabNotesSmall][!RainmeterHideMeter TabNotes][!RainmeterRedraw]
LeftMouseDownAction=!Execute [!RainmeterHideMeter ToDo][!RainmeterHideMeter Other][!RainmeterHideMeter ToDoTitle][!RainmeterHideMeter OtherTitle][!RainmeterShowMeter Note][!RainmeterShowMeter NotesTitle][!RainmeterRedraw]
LeftMouseUpAction=!Execute [!RainmeterRedraw]

[TabToDoSmall]
Meter=IMAGE
SolidColor=255,48,48
X=295
Y=25r
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=!Execute [!RainmeterShowMeter TabToDo][!RainmeterHideMeter TabToDoSmall][!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterRedraw]

[TabToDo]
Meter=IMAGE
ImageName=Tab ToDo.png
X=295
Y=r
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=!Execute [!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterShowMeter TabToDoSmall][!RainmeterHideMeter TabToDo][!RainmeterRedraw]
LeftMouseDownAction=!Execute [!RainmeterHideMeter Note][!RainmeterHideMeter Other][!RainmeterHideMeter NotesTitle][!RainmeterHideMeter OtherTitle][!RainmeterShowMeter ToDo][!RainmeterShowMeter ToDoTitle][!RainmeterRedraw]
LeftMouseUpAction=!Execute [!RainmeterRedraw]

[TabOtherSmall]
Meter=IMAGE
SolidColor=255,229,61
X=295
Y=25r
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=!Execute [!RainmeterShowMeter TabOther][!RainmeterHideMeter TabOtherSmall][!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterRedraw]

[TabOther]
Meter=IMAGE
ImageName=Tab Other.png
X=295
Y=r
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=!Execute [!RainmeterRedraw]
MouseLeaveAction=!Execute [!RainmeterShowMeter TabOtherSmall][!RainmeterHideMeter TabOther][!RainmeterRedraw]
LeftMouseDownAction=!Execute [!RainmeterHideMeter ToDo][!RainmeterHideMeter ToDoDots][!RainmeterHideMeter Note][!RainmeterHideMeter ToDoTitle][!RainmeterHideMeter NotesTitle][!RainmeterShowMeter Other][!RainmeterShowMeter OtherTitle][!RainmeterRedraw]
LeftMouseUpAction=!Execute [!RainmeterRedraw]

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

[Back]
Meter=IMAGE
SolidColor=0, 0, 0, 1
X=0
Y=0
W=260
H=#ScreenHeight#

[Title]
Meter=STRING
X=45
Y=6
FontColor=0,204,255
FontSize=15
FontFace=#FontName#
StringAlign=LEFT
Prefix="Notizen & To-Do's"
AntiAlias=1

;--------------------------Scrollable Area

[Note]
Container=Container
Meter=STRING
MeasureName=MeasureNote
X=5
Y=(34+#YPosition#)
W=290
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=0
DynamicVariables=1
LeftMouseDownAction=!Execute ["#Note#"][!RainmeterRedraw]

[ToDo]
Container=Container
Meter=STRING
MeasureName=MeasureToDo
X=15
Y=(34+#YPosition#)
W=290
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
LeftMouseDownAction=!Execute ["#ToDo#"][!RainmeterRedraw]

[Other]
Container=Container
Meter=STRING
MeasureName=MeasureOther
X=5
Y=(34+#YPosition#)
W=290
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
LeftMouseDownAction=!Execute ["#Other#"][!RainmeterRedraw]

[ToDoDots]
Container=Container
Meter=STRING
MeasureName=MeasureToDoDots
X=5
Y=(34+#YPosition#)
W=290
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
;--------------------------

[Container]
Meter=Shape
X=0
Y=35
Shape=Rectangle 0,0,290,(Max([Open:H],[Box:H]))
MouseScrollUpAction=[!SetVariable YPosition (Clamp(#YPosition#+#LineHeight#,-290,-34))][!UpdateMeter *][!Redraw]
MouseScrollDownAction=[!SetVariable YPosition (Clamp(#YPosition#-#LineHeight#,-290,-34))][!UpdateMeter *][!Redraw]
DynamicVariables=1
User avatar
eclectic-tech
Rainmeter Sage
Posts: 5406
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Scrollbar for Notes from Moxx.Pack

Post by eclectic-tech »

Had some time to look at your updated post and code. Here is what I suggest for a clickable scrollbar variant.

CORRECTIONS
Corrected all deprecated bangs : '!Execute' is not used, '!Rainmeter...' is now just the '!'
Corrected error messages about missing meters you removed in your update

CHANGES TO YOUR CODE
Added AccurateText=1 to [Rainmeter] section to improve text display

Added new variables for scrollbar and larger Notes, Todo, etc. text

MaxScrollHeight (in pixels): minimum is 290, maximum can be almost any height desired (set to 600 in the code below)

YPosition changed to zero : easier to calculate Y positions starting from 0

LineStep : number of pixels each scrollbar action moves the text

Modified meters:
Set the Y position to zero : for Notes, Todo, and Other meters
The position is relative to the Container meter, and it is set to Y=34, positioned just below the Title meter

Added [!HideMeterGroup Scrollbar][!Redraw] to bang in the [Close] section : this closes the scrollbar first to eliminate visibility on close action

Decreased width of Notes, Todo, and Others to provide space for the new scrollbar

Added top/bottom, and indicator scrollbar meters :
Clicking on the upper half of the scrollbar will scroll the text upward
Clicking on the lower half of the scrollbar will scroll the text downward

The indicator will show a relative position based on the MaxScrollHeight you set

That's all the changes to your updated code.

BTW, you can still use a mouse wheel to scroll when you eventually get a new mouse and keyboard :D

Here is your code with these changes and additions:

Code: Select all

[Rainmeter]
Update=1000
AccurateText=1

; Author=Albinozz

[Variables]

Note=#SkinsPath#Moxx.Pack\Notes\Notes.txt
ToDo=#SkinsPath#Moxx.Pack\Notes\Notes2.txt
Other=#SkinsPath#Moxx.Pack\Notes\Notes3.txt
ToDoDots=#SkinsPath#Moxx.Pack\Notes\ToDoDots.txt

;------------------Scoll Variables
; Set this to the maximum scrolled text height
MaxScrollHeight=600

YPosition=0

; This will vary depending on the Font used
LineStep=(#MaxScrollHeight#/20)

ScreenHeight=285
;------------------"ScreenHeight2" should be set to 35 more than "ScreenHeight"
ScreenHeight2=320

BoxTransparent=150
;------------------Chose the transparent for the read box 1-255

FontName=Century Gothic
FontColor=255, 255, 255, 255
FontHeight=10
AntiAlias=1
;---------------------------

[MeasureNote]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#Note#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureToDo]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#ToDo#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureOther]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#Other#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt

[MeasureToDoDots]
Measure=Plugin
Plugin=Plugins\QuotePlugin.dll
PathName=#ToDoDots#
Disabled=0
Separator=¶
#Subfolders=0
#FileFilter=*.txt
;--------------------------

[Top]
Meter=IMAGE
ImageName=Top.png
X=0
Y=0
W=295
H=35
AntiAlias=1

[Box]
Meter=IMAGE
SolidColor=0, 0, 0, #BoxTransparent#
X=0
Y=35r
W=295
H=#ScreenHeight#
AntiAlias=1
Hidden=0

[Open]
Meter=IMAGE
ImageName=Bottom.png
X=0
Y=r
W=295
H=20
AntiAlias=1
Hidden=1
LeftMouseDownAction=[!Refresh][!Redraw]
LeftMouseUpAction=[!Redraw]

[OpenArrow]
Meter=IMAGE
ImageName=Open.png
X=130
Y=r
W=15
H=15
AntiAlias=1
Hidden=1

[Close]
Meter=IMAGE
ImageName=Bottom.png
X=0
Y=#ScreenHeight2#
W=295
H=20
AntiAlias=1
Hidden=0
LeftMouseDownAction=[!HideMeterGroup Scrollbar][!Redraw][!HideMeter ToDo][!HideMeter ToDoDots][!HideMeter Other][!HideMeter Note][!HideMeter Box][!HideMeter TabNotes][!HideMeter TabNotesSmall][!HideMeter TabToDo][!HideMeter TabToDoSmall][!HideMeter TabOther][!HideMeter TabOtherSmall][!HideMeter Close][!HideMeter CloseArrow][!HideMeter Back][!ShowMeter Open][!ShowMeter OpenArrow][!Redraw]
LeftMouseUpAction=[!Redraw]


[CloseArrow]
Meter=IMAGE
ImageName=Close.png
X=130
Y=r
W=15
H=15
AntiAlias=1
Hidden=0
;---------------------------
[TabNotesSmall]
Meter=IMAGE
SolidColor=187,0,255
X=295
Y=50
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=[!ShowMeter TabNotes][!HideMeter TabNotesSmall][!Redraw]
MouseLeaveAction=[!Redraw]

[TabNotes]
Meter=IMAGE
ImageName=Tab Notes.png
X=295
Y=50
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=[!Redraw]
MouseLeaveAction=[!ShowMeter TabNotesSmall][!HideMeter TabNotes][!Redraw]
LeftMouseDownAction=[!HideMeter ToDo][!HideMeter Other][!ShowMeter Note][!Redraw]
LeftMouseUpAction=[!Redraw]

[TabToDoSmall]
Meter=IMAGE
SolidColor=255,48,48
X=295
Y=25r
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=[!ShowMeter TabToDo][!HideMeter TabToDoSmall][!Redraw]
MouseLeaveAction=[!Redraw]

[TabToDo]
Meter=IMAGE
ImageName=Tab ToDo.png
X=295
Y=r
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=[!Redraw]
MouseLeaveAction=[!ShowMeter TabToDoSmall][!HideMeter TabToDo][!Redraw]
LeftMouseDownAction=[!HideMeter Note][!HideMeter Other][!ShowMeter ToDo][!Redraw]
LeftMouseUpAction=[!Redraw]

[TabOtherSmall]
Meter=IMAGE
SolidColor=255,229,61
X=295
Y=25r
W=10
H=20
AntiAlias=1
Hidden=0
MouseOverAction=[!ShowMeter TabOther][!HideMeter TabOtherSmall][!Redraw]
MouseLeaveAction=[!Redraw]

[TabOther]
Meter=IMAGE
ImageName=Tab Other.png
X=295
Y=r
W=50
H=20
AntiAlias=1
Hidden=1
MouseOverAction=[!Redraw]
MouseLeaveAction=[!ShowMeter TabOtherSmall][!HideMeter TabOther][!Redraw]
LeftMouseDownAction=[!HideMeter ToDo][!HideMeter ToDoDots][!HideMeter Note][!ShowMeter Other][!Redraw]
LeftMouseUpAction=[!Redraw]

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

[Back]
Meter=IMAGE
SolidColor=0, 0, 0, 1
X=0
Y=0
W=260
H=#ScreenHeight#

[Title]
Meter=STRING
X=45
Y=6
FontColor=0,204,255
FontSize=15
FontFace=#FontName#
StringAlign=LEFT
Prefix="Notizen & To-Do's"
AntiAlias=1

;--------------------------Scrollable Area

[Note]
Container=Container
Meter=STRING
MeasureName=MeasureNote
X=5
Y=#YPosition#
W=274
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=0
DynamicVariables=1
LeftMouseDownAction=["#Note#"][!Redraw]

[ToDo]
Container=Container
Meter=STRING
MeasureName=MeasureToDo
X=15
Y=#YPosition#
W=274
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
LeftMouseDownAction=["#ToDo#"][!Redraw]

[Other]
Container=Container
Meter=STRING
MeasureName=MeasureOther
X=5
Y=#YPosition#
W=274
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
LeftMouseDownAction=["#Other#"][!Redraw]

[ToDoDots]
Container=Container
Meter=STRING
MeasureName=MeasureToDoDots
X=5
Y=#YPosition#
W=276
H=#ScreenHeight#
FontColor=#FontColor#
FontFace=#FontName#
FontSize=#FontHeight#
StringAlign=LEFT
StringStyle=NORMAL
AntiAlias=1
ClipString=1
Hidden=1
DynamicVariables=1
;--------------------------

[ScrollbarTop]
Container=Container
Group=Scrollbar
Meter=Shape
Shape=Rectangle 285,0,11,([Box:H]*0.5) | StrokeWidth 0 | Fill Color 47,47,47,220
LeftMouseUpAction=[!SetVariable YPosition (Clamp(#YPosition#+#LineStep#,(-#MaxScrollHeight#+#LineStep#),0))][!UpdateMeter *][!Redraw]
DynamicVariables=1
 
[ScrollbarBottom]
Container=Container
Group=Scrollbar
Meter=Shape
Shape=Rectangle 285,([Box:H]*0.5),11,([Box:H]*0.5) | StrokeWidth 0 | Fill Color 47,47,47,220
LeftMouseUpAction=[!SetVariable YPosition (Clamp(#YPosition#-#LineStep#,(-#MaxScrollHeight#+#LineStep#),0))][!UpdateMeter *][!Redraw]
DynamicVariables=1
 
[ScrollbarIndicator]
Container=Container
Group=Scrollbar
Meter=Shape
X=285
Y=0
Shape=Rectangle 0,((Abs(#YPosition#)/(#MaxScrollHeight#/([Box:H]+0.00001)))),11,13 | StrokeWidth 0 | Fill Color 230,230,230
DynamicVariables=1

[Container]
Meter=Shape
X=0
Y=35
Shape=Rectangle 0,0,295,(Max([Open:H],[Box:H]))
MouseScrollUpAction=[!SetVariable YPosition (Clamp(#YPosition#+#LineStep#,(-#MaxScrollHeight#+#LineStep#),0))][!UpdateMeter *][!Redraw]
MouseScrollDownAction=[!SetVariable YPosition (Clamp(#YPosition#-#LineStep#,(-#MaxScrollHeight#+#LineStep#),0))][!UpdateMeter *][!Redraw]
DynamicVariables=1

moxx2.gif
Feel free to ask about these additions. :???:
You do not have the required permissions to view the files attached to this post.
User avatar
CodeCode
Posts: 1366
Joined: September 7th, 2020, 2:24 pm
Location: QLD, Australia

Re: Scrollbar for Notes from Moxx.Pack

Post by CodeCode »

I thought this was really interesting, so I followed along and came up with my own spin on Moxx Notes.

Have a look:
Moxx Note Bar_xx.xx.rmskin
It remembers the last state of the skin, in both what tab was on and if open or closed. :Whistle
You do not have the required permissions to view the files attached to this post.
ƈǟռ'ȶ ʄɨӼ ɨȶ ɨʄ ɨȶ ǟɨռ'ȶ ɮʀօӄɛ - ʊռʟɛֆֆ ɨȶ ɨֆ ɨռ ƈօɖɛ.
User avatar
eclectic-tech
Rainmeter Sage
Posts: 5406
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Scrollbar for Notes from Moxx.Pack

Post by eclectic-tech »

Nice variation CodeCode.
Looks good! 8-)

Thanks for sharing :thumbup:
DangerousMinds
Posts: 17
Joined: October 7th, 2022, 5:53 pm

Re: Scrollbar for Notes from Moxx.Pack

Post by DangerousMinds »

CodeCode wrote: February 8th, 2023, 6:29 pm I thought this was really interesting, so I followed along and came up with my own spin on Moxx Notes.

Have a look:
Moxx Note Bar_xx.xx.rmskin

It remembers the last state of the skin, in both what tab was on and if open or closed. :Whistle
Nice work CodeCode!

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Sorry for not answering yersterday. I was not feeling very well so I didn't try out your changes.

But now I did and that's really good. I like that.

Thanks for all your help!!!

I have still one older question and a new one.

Is it possible to click on the scrollbar, hold it and pull it up or down to scoll or only by clicking? I hope you know what I mean.

I don't testet it out but I'm sure I can change the color of the scrollbar right?


So next question is. Is it possible to add different colors to the text, so that every new paragraph / section has it's own color? Like in the picture. I made this real quick with a graphic program so that is better to understand what I mean.

Image

And I have still one problem.
When I have a lot of text in the notes, not everything is showing. Like I postet on February 7th in this Thread. There was also the question about the textcolor ^^

Do you have any idea to fix this problem?
User avatar
eclectic-tech
Rainmeter Sage
Posts: 5406
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Scrollbar for Notes from Moxx.Pack

Post by eclectic-tech »

To change the scrollbar so it is click and drag, you could look at using the Mouse plugin.

You can change the color by editing the Fill Color R,G,B value in the Shape meters for the Top and Bottom scrollbars.
Change the indicator color using the same method on the indicator Shape meter.

Because the text is a single file, it is not easy to change each paragraph color; you could look at Inlne Options to try to achieve some color change based on patterns.

To show more lines of text, increase the value of MaxScrollHeight in the skin Variables until it shows the amount of text you desire.

It will require learning how to incorporate these into this skin, but we can help if you have problems. Just be sure to post the modified code.