Sliding a Skin with ActionTimer

[scottiescotsman]

The 3 include files
Hope that helps

Thanks
Steven

[dvo]

here the working version maybe you will alter some parts but the basics are working nice

[dvo]

this is a auto slider maybe you like this one better

[Honimoura]

Hello, I just discovered this option. I use it a little differently. I use it to click on one of the skin, it "unwinds" icons to create a menu. However I am looking for how to make a slide of the skins on a arc path.

In order to be as clear as possible. The base skin is a circle, so I want to scroll the "icons" around this circle in sliding.

(Sorry, i'm french, google trad power)

[ikarus1969]

Hello, I just discovered this option. I use it a little differently. I use it to click on one of the skin, it "unwinds" icons to create a menu. However I am looking for how to make a slide of the skins on a arc path.

In order to be as clear as possible. The base skin is a circle, so I want to scroll the "icons" around this circle in sliding.

(Sorry, i'm french, google trad power)

As a starting point you can use the following demonstrating skin where blue circles rotate on a circle when hovering over the red base rectangle (and back when leaving the red base rectangle):

A little math:
the x-position of an object on a circle is calculated by.
[x-coordinate of the middle of the circle] + [radius of the circle] * COSINUS(angle)
the y-position of an object on a circle is calculated by.
[y-coordinate of the middle of the circle] + [radius of the circle] * SINUS(angle)

(see polar-coordinates on wikipedia (french): https://fr.wikipedia.org/wiki/Coordonn%C3%A9es_polaires)

sliding is done by increasing (or decreasing) the angle with an action-timer measure

Screenshot skin.jpg

Code: Select all

[Rainmeter]
Update=1000
AccurateText=1
OnWakeAction=[!Refresh]
DynamicWindowSize=1
; BackgroundMode=2
; SolidColor=4080C040

[Variables]
CIRCLE.X=130
CIRCLE.Y=130
CIRCLE.R=100

; starting angles in degrees, starting on the right (=east)
; angle for the red base
ANGLE.Base=180

; angles for the blue circles which will rotate upon mouse move over (and out) of the red base
ANGLE.Icon.1=220
ANGLE.Icon.2=265
ANGLE.Icon.3=337


Base.W=40
Base.H=#Base.W#

Icon.R=20


; for ActionTimer
AT_Angle=0
UAT_Angle=[!UpdateMeasure "Measure_AT_Angle"][!UpdateMeterGroup "G_ICON"][!Redraw]


; --------------------------------------------------------------------------------
; Measures
; --------------------------------------------------------------------------------

[Measure_AT_Angle]
Measure=PLUGIN
Plugin=ActionTimer
ActionList1=Repeat ROTATE_RIGHT, 7, 80 | Wait 7 | ROTATE_RIGHT_FINAL
ActionList2=Repeat ROTATE_LEFT,  7, 80 | Wait 7 | ROTATE_LEFT_FINAL
ROTATE_RIGHT=      [!SetVariable "AT_Angle" "(MIN(80, #AT_Angle# + 1))"]#UAT_Angle#
ROTATE_RIGHT_FINAL=[!SetVariable "AT_Angle" "80"]#UAT_Angle#
ROTATE_LEFT=       [!SetVariable "AT_Angle" "(MAX(0, #AT_Angle# - 1))"]#UAT_Angle#
ROTATE_LEFT_FINAL= [!SetVariable "AT_Angle" "0"]#UAT_Angle#
DynamicVariables=1
UpdateDivider=-1
IgnoreWarnings=1


; --------------------------------------------------------------------------------
; Meters
; --------------------------------------------------------------------------------
[Meter_Circle]
Meter=SHAPE
Shape= Ellipse #CIRCLE.X#, #CIRCLE.Y#, #CIRCLE.R#, #CIRCLE.R# | Extend Format_Circle
Format_Circle=StrokeWidth 2 | Stroke Color 800000FF | Fill Color FFFFFFFF
AntiAlias=1
DynamicVariables=1

[Meter_Base]
Meter=SHAPE
Shape=Rectangle (#CIRCLE.X# + (#CIRCLE.R# + 0.5 * #Base.W#) * COS(RAD(#ANGLE.Base#))), (#CIRCLE.Y# + (#CIRCLE.R# + 0.5 * #Base.W#) * SIN(RAD(#ANGLE.Base#))), #Base.W#, #Base.W# | Extend Format_Base
Format_Base=StrokeWidth 2 | Stroke Color 800000FF | Fill Color FF0000FF
MouseOverAction= [!CommandMeasure "Measure_AT_Angle" "Stop 1"][!CommandMeasure "Measure_AT_Angle" "Stop 2"][!CommandMeasure "Measure_AT_Angle" "Execute 1"]
MouseLeaveAction=[!CommandMeasure "Measure_AT_Angle" "Stop 1"][!CommandMeasure "Measure_AT_Angle" "Stop 2"][!CommandMeasure "Measure_AT_Angle" "Execute 2"]
AntiAlias=1
DynamicVariables=1

[Meter_Icon_1]
Meter=SHAPE
Shape= Ellipse (#CIRCLE.X# + #CIRCLE.R# * COS(RAD(#ANGLE.Icon.1# + #AT_Angle#))), (#CIRCLE.Y# + #CIRCLE.R# * SIN(RAD(#ANGLE.Icon.1# + #AT_Angle#))), #Icon.R#, #Icon.R# | Extend Format_Icon
Format_Icon=StrokeWidth 2 | Stroke Color 004080FF | Fill Color 80BFFFFF
AntiAlias=1
DynamicVariables=1
Group=G_ICON

[Meter_Icon_2]
Meter=SHAPE
Shape= Ellipse (#CIRCLE.X# + #CIRCLE.R# * COS(RAD(#ANGLE.Icon.2# + #AT_Angle#))), (#CIRCLE.Y# + #CIRCLE.R# * SIN(RAD(#ANGLE.Icon.2# + #AT_Angle#))), #Icon.R#, #Icon.R# | Extend Format_Icon
Format_Icon=StrokeWidth 2 | Stroke Color 004080FF | Fill Color 80BFFFFF
AntiAlias=1
DynamicVariables=1
Group=G_ICON

[Meter_Icon_3]
Meter=SHAPE
Shape= Ellipse (#CIRCLE.X# + #CIRCLE.R# * COS(RAD(#ANGLE.Icon.3# + #AT_Angle#))), (#CIRCLE.Y# + #CIRCLE.R# * SIN(RAD(#ANGLE.Icon.3# + #AT_Angle#))), #Icon.R#, #Icon.R# | Extend Format_Icon
Format_Icon=StrokeWidth 2 | Stroke Color 004080FF | Fill Color 80BFFFFF
AntiAlias=1
DynamicVariables=1
Group=G_ICON

[Honimoura]

Thank you for that answer. It sounds EXTREMELY complicated at first sight, but I'm going to put my hands in to fully understand each step and come back to you to give the final result if I succeed ^^

[ikarus1969]

Thank you for that answer. It sounds EXTREMELY complicated at first sight, but I'm going to put my hands in to fully understand each step and come back to you to give the final result if I succeed ^^

You are right. At first sight. But at the second view it isn't. Just imagine:

1. to position something at a circle, you have to define the angle.
2. to slide (move) something on a circle you have to change that angle (increase/decrease)

for 1. just set a variable to that angle. This variable is used in the meter when defining the x and y-coordinates
for 2. changing the angle is done by an action-timer measure which, well, changes the angle and updates the meter to reflect the new position

The only thing - for me - was to remember my time in school when i learned how something is positioned on a circle. For this question Wikipedia helped me with the polar coordinates.
For positioning something on a circle, i need 3 things:

1. the center of the circle (x- and y-coordinates): i use variables for it, so i can easily use them in formulas
2. the radius of the circle
3. the angle at which the "something" should appear

All these 3 things are under my control, i define them. And set them in variables. So i can do position the "something" easily on a circle:

x-position:

Code: Select all

[x-coordinate of the center of the circle] + [radius of the circle] * cosinus(angle)

y-position:

Code: Select all

[y-coordinate of the center of the circle] + [radius of the circle] * sinus(angle)

please don't hesitate to ask questions whenever they arise!