It is currently August 9th, 2020, 8:17 am

CPU Step Bars - CPU Monitor

Post your work-in-progress and completed skins to share and discuss.
User avatar
DavidRGreen
Posts: 34
Joined: May 5th, 2020, 10:19 am

CPU Step Bars - CPU Monitor

Post by DavidRGreen »

After the Network monitor skin I made a short while ago, I thought a similar concept could be employed for a CPU monitor, so;

Image

The sample shows the 4 Core display, 1 to 4 from left to right with the average displayed in the centre. Each bar represents a 20% upward step for each core, Blue at 20%+, Green, Yellow, Magenta and Red at 100%. The measure of each Core is granulated, so for instance, for Core 1 on the screen shot the yellow bar will not fill until that Core has reached 60% or more.
If Cores 5 to 8 (or less) are required to be displayed, they will appear on a second row, mirrored, so the bars will fill downward, Cores 5 to 8 (or less) from left to right. The average will move down to remain centred as well.
CPU Step Bars_1.0.rmskin
The Skin is translucent, although that is not apparent from the screen shot on a black screen.
You do not have the required permissions to view the files attached to this post.
User avatar
balala
Rainmeter Sage
Posts: 11181
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: CPU Step Bars - CPU Monitor

Post by balala »

DavidRGreen wrote:
June 8th, 2020, 1:13 pm
If Cores 5 to 8 (or less) are required to be displayed, they will appear on a second row, mirrored, so the bars will fill downward, Cores 5 to 8 (or less) from left to right. The average will move down to remain centred as well.
I recommend you to leave a distance between the two rows, if there are more then four cores, because as the skin is written, it is extremely hard to identify (especially at a first and quick look), which bar belongs to which core. A horizontal line or a distance would easier this.
Otherwise good work, congratulations. Looking good, like it.
User avatar
DavidRGreen
Posts: 34
Joined: May 5th, 2020, 10:19 am

Re: CPU Step Bars - CPU Monitor

Post by DavidRGreen »

Thanks balala.
balala wrote:
June 8th, 2020, 3:51 pm
A horizontal line or a distance would easier this
Fair point. In this version, my first thought was to separate, but not to create too big a valley to minimise wasted space. A rule between them should solve the problem without the need to open up excessive space.
A tweak to look into after work tonight…

I'd have to admit, when I started on this, using the granulating Calc Measure as a source for the Bar Meters did throw me for a bit as I couldn't figure out how to make the Calc have a range of 0 to 100. But, of course, in due course, I gave up on that and worked with the range of 0 to 1.
User avatar
balala
Rainmeter Sage
Posts: 11181
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: CPU Step Bars - CPU Monitor

Post by balala »

DavidRGreen wrote:
June 8th, 2020, 9:53 pm
Fair point. In this version, my first thought was to separate, but not to create too big a valley to minimise wasted space. A rule between them should solve the problem without the need to open up excessive space.
A tweak to look into after work tonight…
I definitely would add some distance, line, whatever, to distance them, but finally it's up to you. The meters shouldn't be very far apart, but a small distance would be welcomed, to see which section, belongs to which core.
DavidRGreen wrote:
June 8th, 2020, 9:53 pm
I'd have to admit, when I started on this, using the granulating Calc Measure as a source for the Bar Meters did throw me for a bit as I couldn't figure out how to make the Calc have a range of 0 to 100. But, of course, in due course, I gave up on that and worked with the range of 0 to 1.
Much more natural, in my opinion, to use this, instead of a 0 to 100 range.
User avatar
DavidRGreen
Posts: 34
Joined: May 5th, 2020, 10:19 am

Re: CPU Step Bars - CPU Monitor

Post by DavidRGreen »

Those adjustments were more troublesome than I expected, but they are done, and I discovered more about Rainmeter in the process.
CPU Step Bars_1.1.rmskin
I put a divider line between the two meter rows which is done with a Line Shape. And I discovered that a Line with Stroke Width of 1 is the same thickness as a line of Stroke Width of 2, but width 2 draws the line in the colour specified unlike width 1 which appeared to have ½ opacity. Also, I noticed that adding "r" to the positioning was ignored, so relative placement wasn't allowed. Maybe relative placement relies on element height specification, but I'll look into that one later.

In this case to avoid a large footer (+10px) appearing at the bottom of the skin, all hidden elements were Moved to the top of the skin to prevent Rainmeter from including their co-ordinates when calculating skin dimensions.
I was hoping for a MoveMeterGroup bang, but I guess that is a little too much :) , and probably doesn't make much sense.
You do not have the required permissions to view the files attached to this post.
User avatar
balala
Rainmeter Sage
Posts: 11181
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: CPU Step Bars - CPU Monitor

Post by balala »

DavidRGreen wrote:
June 10th, 2020, 12:17 pm
Also, I noticed that adding "r" to the positioning was ignored, so relative placement wasn't allowed. Maybe relative placement relies on element height specification, but I'll look into that one later.
Not very sure what you mean by "relative placement relies on element height specification", but I can assure you it does work:

Code: Select all

[Rainmeter]
Update=1000
Background=Images\basixBg.png
BackgroundMode=3
BackgroundMargins=0,5,0,5

[Metadata]
Author=David Green
Version=1.1
License=Creative Commons
Information=A CPU Meter for 1 to 8 Cores. Each Core is represented as a stack of bars filled, from bottom to top as usage increases on each core; Blue 20%+, Green 40%+, Yellow 60%+, Magenta 80%+ and Red 100%. Each CPU measure is granulated to 20% intervals. Cores 1 to 4 are displayed on the top (or possibly only) row from left to right, if Cores beyond 4 are needed to be displayed they appear on the second row but fill similarly only top to bottom mirroring to the top row. The number in the centre is the average CPU usage, and will shift downwards between the two rows as required to keep centred.

[Variables]
DividerY=59
Bar2Y=63

[InitCPUMon]
Measure=Calc
UpdateDivider=-1
Formula=%NUMBER_OF_PROCESSORS%
IfCondition=(InitCPUMon=1)
IfTrueAction=[!EnableMeasureGroup "Core1"][!ShowMeterGroup "Core1"]
IfCondition2=(InitCPUMon=2)
IfTrueAction2=[!EnableMeasureGroup "Core1"][!ShowMeterGroup "Core1"][!EnableMeasureGroup "Core2"][!ShowMeterGroup "Core2"]
IfCondition3=(InitCPUMon=4)
IfTrueAction3=[!EnableMeasureGroup "Core1"][!ShowMeterGroup "Core1"][!EnableMeasureGroup "Core2"][!ShowMeterGroup "Core2"][!EnableMeasureGroup "Core3"][!ShowMeterGroup "Core3"]
IfCondition4=(InitCPUMon=6)
IfTrueAction4=[!EnableMeasureGroup "Core1"][!ShowMeterGroup "Core1"][!EnableMeasureGroup "Core2"][!ShowMeterGroup "Core2"][!EnableMeasureGroup "Core3"][!ShowMeterGroup "Core3"][!EnableMeasureGroup "Core4"][!ShowMeterGroup "Core4"]
IfCondition5=(InitCPUMon=8)
IfTrueAction5=[!EnableMeasureGroup "Core1"][!ShowMeterGroup "Core1"][!EnableMeasureGroup "Core2"][!ShowMeterGroup "Core2"][!EnableMeasureGroup "Core3"][!ShowMeterGroup "Core3"][!EnableMeasureGroup "Core4"][!ShowMeterGroup "Core4"][!EnableMeasureGroup "Core5"][!ShowMeterGroup "Core5"]
IfCondition6=(InitCPUMon=6) || (InitCPUMon=8)
IfTrueAction6=[!SetOption DisplayText Y 59]
IfFalseAction6=[!MoveMeter 5 5 "DividerRules"][!MoveMeter 5 5 "Skeleton5"][!MoveMeter 5 5 "CPU5"][!MoveMeter 45 5 "Skeleton6"][!MoveMeter 45 5 "CPU6"][!MoveMeter 140 5 "Skeleton7"][!MoveMeter 140 5 "CPU7"][!MoveMeter 180 5 "Skeleton8"][!MoveMeter 180 5 "CPU8"]

; ---- CPU0 ----

[MCPU0]
Measure=CPU
Processor=0

[DisplayText]
Meter=String
MeasureName=MCPU0
X=110
Y=35
FontColor=0,0,0
FontWeight=700
StringAlign=CenterCenter
StringEffect=Border
FontEffectColor=128,128,128,255
NumOfDecimals=0
AntiAlias=1
Text=%1%

; ---- CPU1 ----

[Skeleton1]
Meter=Image
X=-105r
Y=-54r
ImageName=Images\CPUMeterSkeleton.png
Hidden=1
Group=Core1

[MCPU1]
Measure=CPU
Processor=1
Disabled=1
Group=Core1

[MCPU1Step]
Measure=Calc
Formula=Trunc(MCPU1/20)*0.2
Disabled=1
Group=Core1

[CPU1]
Meter=Bar
MeasureName=MCPU1Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
X=0r
Y=0r
Hidden=1
Group=Core1

; ---- CPU2 ----

[Skeleton2]
Meter=Image
X=40r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
Hidden=1
Group=Core2

[MCPU2]
Measure=CPU
Processor=2
Disabled=1
Group=Core2

[MCPU2Step]
Measure=Calc
Formula=Trunc(MCPU2/20)*0.2
Disabled=1
Group=Core2

[CPU2]
Meter=Bar
MeasureName=MCPU2Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
X=0r
Y=0r
Hidden=1
Group=Core2

; ---- CPU3 ----

[Skeleton3]
Meter=Image
X=95r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
Hidden=1
Group=Core3

[MCPU3]
Measure=CPU
Processor=3
Disabled=1
Group=Core3

[MCPU3Step]
Measure=Calc
Formula=Trunc(MCPU3/20)*0.2
Disabled=1
Group=Core3

[CPU3]
Meter=Bar
MeasureName=MCPU3Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
X=0r
Y=0r
Hidden=1
Group=Core3

; ---- CPU4 ----

[Skeleton4]
Meter=Image
X=40r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
Hidden=1
Group=Core3

[MCPU4]
Measure=CPU
Processor=4
Disabled=1
Group=Core3

[MCPU4Step]
Measure=Calc
Formula=Trunc(MCPU4/20)*0.2
Disabled=1
Group=Core3

[CPU4]
Meter=Bar
MeasureName=MCPU4Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
X=0r
Y=0r
Hidden=1
Group=Core3

; ---- Divider ----

[DividerRules]
Meter=Shape
X=-180r
Y=-5r
Shape=Line 5,59,90,59 | Stroke Color 255,255,255 | StrokeWidth 2
Shape2=Line 130,59,215,59 | Stroke Color 255,255,255 | StrokeWidth 2
Hidden=1
Group=Core4

; ---- CPU5 ----

[Skeleton5]
Meter=Image
X=5r
Y=63r
ImageFlip=Vertical
ImageName=Images\CPUMeterSkeleton.png
Hidden=1
Group=Core4

[MCPU5]
Measure=CPU
Processor=5
Disabled=1
Group=Core4

[MCPU5Step]
Measure=Calc
Formula=Trunc(MCPU5/20)*0.2
Disabled=1
Group=Core4

[CPU5]
Meter=Bar
MeasureName=MCPU5Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
ImageFlip=Vertical
Flip=1
X=0r
Y=0r
Hidden=1
Group=Core4

; ---- CPU6 ----

[Skeleton6]
Meter=Image
X=40r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
ImageFlip=Vertical
Hidden=1
Group=Core4

[MCPU6]
Measure=CPU
Processor=6
Disabled=1
Group=Core4

[MCPU6Step]
Measure=Calc
Formula=Trunc(MCPU6/20)*0.2
Disabled=1
Group=Core4

[CPU6]
Meter=Bar
MeasureName=MCPU6Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
ImageFlip=Vertical
Flip=1
X=0r
Y=0r
Hidden=1
Group=Core4

; ---- CPU7 ----

[Skeleton7]
Meter=Image
X=95r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
ImageFlip=Vertical
Hidden=1
Group=Core5

[MCPU7]
Measure=CPU
Processor=7
Disabled=1
Group=Core5

[MCPU7Step]
Measure=Calc
Formula=Trunc(MCPU7/20)*0.2
Disabled=1
Group=Core5

[CPU7]
Meter=Bar
MeasureName=MCPU7Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
ImageFlip=Vertical
Hidden=1
Flip=1
X=0r
Y=0r
Group=Core5

; ---- CPU8 ----

[Skeleton8]
Meter=Image
X=40r
Y=0r
ImageName=Images\CPUMeterSkeleton.png
ImageFlip=Vertical
Hidden=1
Group=Core5

[MCPU8]
Measure=CPU
Processor=8
Disabled=1
Group=Core5

[MCPU8Step]
Measure=Calc
Formula=Trunc(MCPU8/20)*0.2
Disabled=1
Group=Core5

[CPU8]
Meter=Bar
MeasureName=MCPU8Step
BarOrientation=Vertical
BarImage=Images\CPUMeterSolid.png
ImageFlip=Vertical
Flip=1
Hidden=1
X=0r
Y=0r
Group=Core5
In this code, as you can see, the only meter positioned absolutely is [DisplayText], all other are positioned relatively.
And one more: especially on new codes, it is an extremely good idea to use the @Resources folder, to store all kind of resources used by the skin: images, sounds, fonts, script files, included files and so on. That's why I'd create such a @Resources folder into the root folder (CPUStepBars\@Resources), and would move all images there. If you do this, the Background option of the [Rainmeter] section for instance would be: Background=#@#Images\basixBg.png.
User avatar
DavidRGreen
Posts: 34
Joined: May 5th, 2020, 10:19 am

Re: CPU Step Bars - CPU Monitor

Post by DavidRGreen »

Actually balala, I was referring to the "Line" shape which appeared to be ignoring the "r" directive on positioning. I have no problem with the "r" directive with other meters in other skins. My DriveSpace skin relies exclusively on it for its function.
balala wrote:
June 10th, 2020, 3:56 pm
In this code, as you can see, the only meter positioned absolutely is [DisplayText], all other are positioned relatively.
Even in your version of the code [DividerRules] is positioned absolutely. The same element that I was referring to that ignored the "r" directive. It may be a bug in Rainmeter, or just not supported. No matter what position value was used, the Line Shape was positioned as if the "r" wasn't specified. There may be some influencing condition, but that will come after more investigation (time).
balala wrote:
June 10th, 2020, 3:56 pm
it is an extremely good idea to use the @Resources folder
I am aware of this functionality, but to me, it seemed more relevant to a packaged group of skins sharing resources.
That will eventuate.
DriveSpace, CPU Step Bars, and the next version of my Netmeter will all share common elements. A collection of commonly used assets makes sense.
User avatar
balala
Rainmeter Sage
Posts: 11181
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: CPU Step Bars - CPU Monitor

Post by balala »

DavidRGreen wrote:
June 11th, 2020, 12:55 am
Actually balala, I was referring to the "Line" shape which appeared to be ignoring the "r" directive on positioning. I have no problem with the "r" directive with other meters in other skins. My DriveSpace skin relies exclusively on it for its function.
Your [DividerRules] meter has no positioning options (nor X, nor Y), so it uses the default settings (X=0 and Y=0). Where have you used the directive?
DavidRGreen wrote:
June 11th, 2020, 12:55 am
Even in your version of the code [DividerRules] is positioned absolutely. The same element that I was referring to that ignored the "r" directive. It may be a bug in Rainmeter, or just not supported. No matter what position value was used, the Line Shape was positioned as if the "r" wasn't specified. There may be some influencing condition, but that will come after more investigation (time).
No, it's not positioned relatively, having the following positioning options set:

Code: Select all

[DividerRules]
...
X=-180r
Y=-5r
...
In my opinion a more elegant solution is the following:

Code: Select all

[DividerRules]
Meter=Shape
X=0r
Y=0r
Shape=Line -175,54,-90,54 | Stroke Color 255,255,255 | StrokeWidth 2
Shape2=Line -50,54,35,54 | Stroke Color 255,255,255 | StrokeWidth 2
Hidden=1
Group=Core4

; ---- CPU5 ----

[Skeleton5]
Meter=Image
X=-175r
Y=58r
...
So, relative positioning does work. Please post a code which you didn't get properly working.
DavidRGreen wrote:
June 11th, 2020, 12:55 am
I am aware of this functionality, but to me, it seemed more relevant to a packaged group of skins sharing resources.
That will eventuate.
DriveSpace, CPU Step Bars, and the next version of my Netmeter will all share common elements. A collection of commonly used assets makes sense.
Yep, definitely, however my personal recommendation is to use it all the time, simply to get used to use it. Additionally for users who already accustomed with the usage of @Resources, it is (or at least might be) annoying to not have the used structure of the config.
User avatar
DavidRGreen
Posts: 34
Joined: May 5th, 2020, 10:19 am

Re: CPU Step Bars - CPU Monitor

Post by DavidRGreen »

balala wrote:
June 11th, 2020, 7:46 am
relative positioning does work
I see the issue now. I wasn't using X= and Y= parameters. And I missed seeing them on your sample.
The Line Shape examples in the documentation don't explicitly mention them. I was originally applying the "r" directive to the StartY and EndY parameters of the Shape statements.

Where the documentation says
StartY : Y coordinate of the starting point of the line
it will be relative to the skin, but could be relative to the point specified by the X= and Y= parameters. I'll have to remember that…

Thanks for the "heads up" balala.
User avatar
balala
Rainmeter Sage
Posts: 11181
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: CPU Step Bars - CPU Monitor

Post by balala »

DavidRGreen wrote:
June 11th, 2020, 12:58 pm
I see the issue now. I wasn't using X= and Y= parameters. And I missed seeing them on your sample.
The Line Shape examples in the documentation don't explicitly mention them. I was originally applying the "r" directive to the StartY and EndY parameters of the Shape statements.
Ah yes, now I understand what have you done.
Relative positioning is related to the X and Y option of the meter, but definitely not to the parameters of certain shape (in this case for instance a Line shape).