How to Scale a Skin according to a measure

[3amWednesday]

Hello,

I want to make a bar, and set it up so that for whatever value it is, it will scale the rest of the skin (except for said bar).

In theory, I know to assign a variable to the thing, and then set the X, Y, W, H according to it, but in practice, I'm having trouble getting the bar to even show up. What am I doing wrong??

Code: Select all

[Variables]
 WIDGETSIZE=450

;used to load/drag skin
[MeterString]
Meter=String
fontSize=40
Text=AAAA

;should return a percentage
[measureSize:%]
 Measure = Calc
 Formula = 0.40
;bar
[MeterSizeBar]
 Meter=Bar
 Measure=measureSize
 X=0
 Y=40
 W=500
 H=55
 BarColor=255,0,0,255
 SolidColor=255,255,255,255
 BarOrientation=Horizontal
 ;LeftMouseDownAction=[!SetOption "Variables" "#WIDGETSIZE#" "$MouseX:%$"][!redraw]
 DynamicVariables=1

I'm pretty new at this, so far I've only altered skins so if you can help, or even just point me to a helpful topic, this would be great
Thanks!

[ikarus1969]

i just took your code and adapted some things:

• for a measure to return a percentage you don't have to code a :% on the measures name, you just have to take care that there's a MinValue and MaxValue on it (sometimes it's implicit). As soon as you have the same name on the measure and the meter it's recognized
• on the meter you have to code MeasureName instead of only Measure

The rest seems to be ok and i get it to work:

Screenshot RM.png

Code: Select all

[rainmeter]
Update=1000

[Variables]
WIDGETSIZE=450

;used to load/drag skin
[MeterString]
Meter=String
fontSize=40
Text=AAAA

;should return a percentage
[measureSize]
Measure = Calc
Formula = 0.40

;bar
[MeterSizeBar]
Meter=Bar
MeasureName=measureSize
X=0
Y=40
W=500
H=55
BarColor=255,0,0,255
SolidColor=255,255,255,255
BarOrientation=Horizontal
;LeftMouseDownAction=[!SetOption "Variables" "#WIDGETSIZE#" "$MouseX:%$"][!redraw]
DynamicVariables=1

[eclectic-tech]

ikarus1969 corrected the coding issues, so you can see a bar display set at a static 40%.

When I scale a skin, I prefer to use a multiplier of 1x's the original size; so setting #Scale# to 2 would make the skin twice as large.

Here is code that generates random values of a SCALE variable between 0.1x and 5.0x, every 3 seconds, to scale meters.

Code: Select all

[rainmeter]
Update=1000
DynamicWindowSize=1

[Variables]
 WIDGETSIZE=500
; Skins are designed at a scale of 1x
; I prefer to use that as the starting "Scale"
; For most skins a scale between 0.1x and 5.0x provide enough scalability
Scale=1

;used to display resulting scale
[MeterString]
Meter=String
X=250
Y=40
fontSize=(10*#Scale#)
Text=AAAA @ #Scale#x
StringAlign=CenterCenter
DynamicVariables=1

; Will return a value between 0.1 and 5.0
[measureSize]
 Measure = Calc
; RANDOM numbers are integers, so to get fractional values (less than 1.0) we must divide
Formula = (Random / 10)
 ; These set the range of RANDOM
 LowBound=1
 HighBound=50
 ; These are for percentage values in bar and other percentual meters
 MinValue=0.1
 MaxValue=5.0
 ; When the value changes, change the SCALE variable and update
 OnUpdateAction=[!SetVariable Scale [MeasureSize]][!UpdateMeter *][!Redraw]
 DynamicVariables=1
UpdateDivider=3

;bar
[MeterSizeBar]
 Meter=Bar
 ; MeasureName= is the proper syntax
 MeasureName=measureSize
 X=0
 Y=80
 W=500
 H=55
 BarColor=255,0,0,255
 SolidColor=255,255,255,255
 BarOrientation=Horizontal
 DynamicVariables=1

scalerandom.gif

Here is a variation of your code that allows you to left-click on the bar meter to set the same scale.

Code: Select all

[rainmeter]
Update=1000
DynamicWindowSize=1

[Variables]
 WIDGETSIZE=500
; Skins are designed at a scale of 1x
; I prefer to use that as the starting "Scale"
; For most skins a scale between 0.1x and 5.0x provide enough scalability
Scale=1

;used to display resulting scale
[MeterString]
Meter=String
X=250
Y=40
fontSize=(10*#Scale#)
Text=AAAA @ #Scale#x
StringAlign=CenterCenter
DynamicVariables=1

; Will provide a percentage value for the bar meter
[measureSize]
 Measure = Calc
Formula = #Scale#
 ; These are for percent values in bar and other percentage meters
 MinValue=0.1
 MaxValue=5.0
 DynamicVariables=1

;bar
[MeterSizeBar]
 Meter=Bar
 ; MeasureName= is the proper syntax
 MeasureName=measureSize
 X=0
 Y=80
 W=500
 H=55
 BarColor=255,0,0,255
 SolidColor=255,255,255,255
 BarOrientation=Horizontal
 ; Using 'Up' action allows skins to be dragged by the mouse
 ; Click the bar to set the text to a new scale
 LeftMouseUpAction=[!SetVariable Scale "($MouseX$/100)"][!UpdateMeter *][!Redraw]
 DynamicVariables=1

scaleclick.gif

I modified your bar meter width to 500 so the mouse position when divided by 100 returns 0.0 to 5.0 as the SCALE value.
I find a SCALE variable based on deviation from 1x is more versatile than 1 percentage value, used directly in formulas and in TransformationMatrix.

Feel free to use or not, we each have methods that feel "right" for us...

[3amWednesday]

Oh cool!
This is exactly what I need, thank you both so much!

[eclectic-tech]

Glad to help!

[nikko]

position of the red bar is changing its position under cursor on click. The deviation is bigger on the bar start. Toward the end it is more and more fine.

[ikarus1969]

position of the red bar is changing its position under cursor on click. The deviation is bigger on the bar start. Toward the end it is more and more fine.

That's because of the MinValue=0.1 on the measure used in the bar-meter. If you increase that value to, let's say, 0.3 then the deviation gets bigger.
If you set MinValue=0 then the bar reflects the position you clicked with the mouse.