formatting this skin shape and text - somewhat confusing [outcome achieved]

[Mor3bane]

hi. so in another thread a user named yamajak posted a config scrolling list.

I revamped it somewhat to something simpler.

I am having trouble formatting the text and container shape relative to each other from what was originally designed:

Code: Select all

;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
[Rainmeter]
Update = 1000
DefaultUpdateDivider = -1
DynamicWindowSize    = 1
AccurateText         = 1
Group = Scrollie

[variables]
Spacing = 21
MaxListings = 16
StartY = 33
Padding = 6
Width = 300

; Change the file to your rainmeter settings file. If you don't do this it won't work.
; Unless your name is also Charlotte, in which case you're good.
; Change UpdateDivider to a bigger number if it's causing lag.
[RainmeterSettings]
Measure  = WebParser
URL      = file://C:\Users\Morbane\AppData\Roaming\Rainmeter\Rainmeter.ini
CodePage = 1200
RegExp   = (?s)(.*)
UpdateDivider  = 5
UpdateRate     = 1
FinishAction   = [!UpdateMeasure GetConfigName][!UpdateMeterGroup ShowIt][!Redraw]

; WebParser is actually bad at parsing the web so we use a string measure
; instead and delete all the stuff we don't want.
; We need to deal with spaces somehow probably since it might mess up the text wrapping
; And spaces haven't caused a problem yet
[GetConfigName]
Measure = String
String = [RainmeterSettings]
DynamicVariables = 1
RegExpSubstitute = 1
Substitute       = "(?s).*?(\[[^\n]*?\])..Active=[^0]" : "\1", "(?s)([^\n]*]).*" : "\1", "\[(.*?)]" : "\1#CRLF#"

; Draw the title and the actual stuff
[Title]
Meter = string
StringAlign  = Left
Text  = Active Configs:
X     = 5
Fontcolor    = 125,100,25,250
FontFace     = Testamentos-Jed@
StringStyle  = Normal
SolidColor   = 0,0,0,1
FontSize     = 12

[Container]
Meter = Shape
DynamicVariables = 1
Shape = Rectangle 0, 34, #Width#, (#Spacing# * #MaxListings#+#Padding#), 20 | Extend MyModifiers1
MyModifiers1 = FillColor 25,50,25,255 | StrokeWidth 6 | Stroke Color 255,220,165,255

[Show]
Meter = string
Group = ShowIt
StringAlign  = Left
text  = [GetConfigName]
X     = 5
Y     = #StartY#
W     = #Width#
Container  = Container
FontFace   = Segoe UI
FontColor  = 255,220,135,255
SolidColor = 0,0,0,1
MouseOverAction=[!SetOption #CURRENTSECTION# SolidColor 25,50,25,100][!UpdateMeter #CURRENTSECTION#][!Redraw]
MouseLeaveAction=[!SetOption #CURRENTSECTION# SolidColor 25,50,25,50][!UpdateMeter #CURRENTSECTION#][!Redraw]
FontSize   = 12
DynamicVariables  = 1
; This converts the mouse's Y coordinates to the line clicked on
; If you use a bigger font, you need to change the 18 
; Later on I'll programmatically determine the lineheight but I need to figure out
; a good way to count the number of active skins first. Which I might never do.
; It's easy to do it in a bad way though.
MouseScrollDownAction = [!SetOption #CURRENTSECTION# Y (([#CURRENTSECTION#:H]-#StartY#+[#CURRENTSECTION#:Y]-#Padding#)<(#Spacing#*#MaxListings#+#Padding#)?[#CURRENTSECTION#:Y]:([#CURRENTSECTION#:Y]-#Spacing#))][!UpdateMeter #CURRENTSECTION#][!UpdateMeter Slider][!Redraw]
MouseScrollUpAction   = [!SetOption #CURRENTSECTION# Y ((([#CURRENTSECTION#:Y]+#Spacing#)>#StartY#?#StartY#:([#CURRENTSECTION#:Y]+#Spacing#)))][!UpdateMeter #CURRENTSECTION#][!UpdateMeter Slider][!Redraw]

; This converts the 3.233772 that we get into something usable in an 'array'
; Then it grabs the value of that element from the ClickedConfig 'array'
; Then it refreshes that config.
[GetMouseY]
Measure  = Calc
Group    = NoUpdate
Disabled = 1
Formula  = (Ceil(#MouseY#) - 1) = -1 ? 0 : (Ceil(#MouseY#) - 1)
DynamicVariables = 1

; Something every skin needs. Enables the previously disabled measures and disables itself.
; Allows you to have OnUpdateActions not get fired on loading very very easily.
[NoUpdate]
Measure = Calc
OnUpdateAction = [!EnableMeasureGroup NoUpdate][!DisableMeasure NoUpdate]

I am just confused on how to indent the text from the container shape, e.g. indent the body text say 5 or so pixels.

Yep, that's all I'm trying to do, but everything seems to move together or not go right.

Any help is appreciated.

[jsmorley]

You are going to want to use Padding for that.

Code: Select all

[Show]
Meter=String
Group=ShowIt
StringAlign=Left
Text=[GetConfigName]
X=0
Padding=10,0,0,0
Y=#StartY#
W=#Width#
Container=Container

https://docs.rainmeter.net/manual/meters/general-options/#Padding

The reason is that only the "solid" bits of the content meter will be used to create the new combination of container and content. If you just move the content meter to the right, then in effect the container moves to the right with it, again, only the solid bits of the content meter are drawn, the container is NEVER drawn. Using Padding will add some "leading" space to the solid bits of the String meter, which will be drawn in the container, and voila...

I also think this would be easier to follow and tweak if you removed the StrokeWidth from the Shape. The stroke isn't going to be displayed, but 1/2 of its width will impact the sizing and spacing of stuff. It's a confusion I don't think you need. With a StrokeWidth of 6 on a shape that starts at 0 in the skin, 1/2 of the stroke on the top and left of the shape will just be truncated outside the skin and really confuse things.

Code: Select all

[Container]
Meter=Shape
DynamicVariables=1
Shape=Rectangle 0, 34, #Width#, (#Spacing# * #MaxListings#+#Padding#), 20 | Extend MyModifiers1
MyModifiers1=FillColor 0,0,0,1 | StrokeWidth 0

1.png

P.S. I hate white space in options...

No:
X = 10

Yes:
X=10

[Mor3bane]

P.S. I hate white space in options...

No:
X = 10

Yes:
X=10

Agreed. Just was ensuring I didn't lose the plot whilst modifying things in comparison to the unaltered code.

Thanks js,

Shapes are a whole new can of beans for me - so I think I will be exploring it more in the future - just to break out of my comfort zone...
(if I even had a zone)

[jsmorley]

Agreed. Just was ensuring I didn't lose the plot whilst modifying things in comparison to the unaltered code.

Thanks js,

Shapes are a whole new can of beans for me - so I think I will be exploring it more in the future - just to break out of my comfort zone...
(if I even had a zone)

Shapes and Container are both insanely useful. It does take a minute to wrap your head around them...

It's very important to remember that a "stroke" on a shape is not a "border" around it. It is the "drawing stroke", and thus will be drawn 1/2 "inside" and 1/2 "outside" the defined shape.

[Mor3bane]

jsmorely

what do you reckin this is likely to achieve, and/or is it actually necessary - or is it recursion just for the sake of it?

Code: Select all

; Something every skin needs. Enables the previously disabled measures and disables itself.
; Allows you to have OnUpdateActions not get fired on loading very very easily.
[NoUpdate]
Measure=Calc
OnUpdateAction=[!EnableMeasureGroup NoUpdate][!DisableMeasure NoUpdate]

[jsmorley]

Code: Select all

[Rainmeter]
Update=1000
DynamicWindowSize=1
AccurateText=1

[Variables]

[MeterShape]
Meter=Shape
Shape=Rectangle 6,6,200,100 | StrokeWidth 12 | Stroke Color 255,0,0,90

2.png

[jsmorley]

jsmorely

what do you reckin this is likely to achieve, and/or is it actually necessary - or is it recursion just for the sake of it?

Code: Select all

; Something every skin needs. Enables the previously disabled measures and disables itself.
; Allows you to have OnUpdateActions not get fired on loading very very easily.
[NoUpdate]
Measure=Calc
OnUpdateAction=[!EnableMeasureGroup NoUpdate][!DisableMeasure NoUpdate]

I'm not sure I like that, but I guess the idea is that you want to have some measure or group of measures not update on the first update of the skin, but rather on the second update.

I personally think OnRefreshAction=[!EnableMeasureGroup NoUpdate] in the [Rainmeter] section does the same thing in a much simpler way. The group of measures will be enabled at the end of the first update, and will update and react to OnUpdateAction during the second update.

[Mor3bane]

I'm getting this result when trying to round the corners:

Capture.JPG

The effect is also mirrored on the bottom corners.

The right rounded corner is my desired outcome.

What's causing that? I thought it was the text indent...

[Mor3bane]

Never mind - found the cause.

An X= value was set to 5 when should be 0.

[jsmorley]

If you only want the rounded corner on the right, that is a little tricky, but doable...

Code: Select all

[Rainmeter]
Update=1000
DynamicWindowSize=1
AccurateText=1

[Variables]

[MeterShape]
Meter=Shape
Shape=Rectangle 0,0,180,100 | StrokeWidth 0
Shape2=Rectangle 20,0,180,100,20 | StrokeWidth 0
Shape3=Combine Shape | Union Shape2

1.png