It is currently July 11th, 2020, 11:07 pm

Would like to have a skin previewd and commented on please.

Help with creating, editing & fixing problems with skins
User avatar
Yincognito
Posts: 1914
Joined: February 27th, 2015, 2:38 pm
Location: Terra Yincognita

Re: Would like to have a skin previewd and commented on please.

Post by Yincognito »

balala wrote:
March 10th, 2020, 9:42 pm
I'd try to resize the images to the "native" size, so to 64 x 64 pixels. If you do this, the images don't have to be resized and I suppose this would reduce the CPU usage.
But didn't try this out.
That's fine - you don't have to. I was just talking from an optimization point of view, exploring the reasons behind that behavior - that's all. ;-)
User avatar
balala
Rainmeter Sage
Posts: 11009
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Would like to have a skin previewd and commented on please.

Post by balala »

Yincognito wrote:
March 10th, 2020, 9:45 pm
I was just talking from an optimization point of view, exploring the reasons behind that behavior
Yes, but maybe it worth a try. I don't work anymore today, but tomorrow may give it a try (however I'm not good at image manipulation at all).
User avatar
Yincognito
Posts: 1914
Joined: February 27th, 2015, 2:38 pm
Location: Terra Yincognita

Re: Would like to have a skin previewd and commented on please.

Post by Yincognito »

balala wrote:
March 10th, 2020, 9:50 pm
Yes, but maybe it worth a try. I don't work anymore today, but tomorrow may give it a try (however I'm not good at image manipulation at all).
That's ok - no pressure. After all, everything works fine otherwise.
User avatar
Beuwolf
Posts: 28
Joined: February 15th, 2020, 10:08 pm

Re: Would like to have a skin previewd and commented on please.

Post by Beuwolf »

Yincognito wrote:
March 10th, 2020, 7:08 pm
Nah, there's no need to manually redimension the images - please stop this pointless effort. Check this little sample (this assumes you have a fff.png image in the current folder, size doesn't matter):
Not sure if would have been pointless, would meant less code. :p Although I do see the advantages with your code, since it be more flexible as to what size wanting the icons to be. And no, I did not have a fff.png but found a substitute to use instead ! ;-)
Yincognito wrote:
March 10th, 2020, 7:08 pm
So, the unhovered image will be 48x48 (centered in the 64x64 invisible container). When hovered, the image will "grow" to 64x64 (filling the entire container). The "big size" / "small size" can be tweaked to any values, from the [Variables] section.

P.S. I guess this could be also done using a TransformationMatrix, but it's easier like the above.
Yeah, I did noticed it when trying your example alone. But when trying it within my code, it would not have it. First I had icon 1 moved up to the top left corner, which I managed to finally get where it were suppose to be. But once I moved the mouse over the icon, it jumped right back to the top corner. Once there I could move the mouse over it and it enlarged. Had to remove this part on both the Actions:

Code: Select all

[!SetOption MeterImage X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterImage Y ((#SizeBig#-#SizeBig#)/2)]
Then the icon stayed where it were suppose to be, but the end result meant that when hovering over it, the row is being pushed to the right. There probably are a way to get it work your way, I be having another look at it tomorrow and see if I can figure it out. :D
balala wrote:
March 10th, 2020, 8:42 pm
First a little feedback: nice skin, with nice little icons, like them. Congrats.
Thanks ! :D

I both like the icons and not. O.O They do their job as showing what is what, but at the same time I wouldn't mind if they were more uniform in style. But for that I need to find a good, and relatively, easy program to make icon's with. That's for another time though. :D
balala wrote:
March 10th, 2020, 8:42 pm
Note that if you want to comment out a section (meter or measure), don't comment out just its name. This causes a lot of headache in future, because Rainmeter will add the left options to the previous section existing in the code. Depending on what the previous section is, this will cause a lot of troubles is some circumstances. That's why I commented out everything after the [MeterLine_4] meter.
This I was not aware of, thanks for pointing it out ! :oops:

And then just WOW ! :jawdrop That was much more then I had expected anyone do ! Thought it be a point in that => direction and read up on how to do it. Much more professional looking as well, then what I would have managed do with it !

balala wrote:
March 10th, 2020, 9:50 pm
Yes, but maybe it worth a try. I don't work anymore today, but tomorrow may give it a try (however I'm not good at image manipulation at all).
Ohh you done plenty already, I try and fix all the icons in 64x64 format and zip them up here tomorrow. Should have the time unless something unexpected happens.

Thank again for all the feedback and pointers, very much appreciated !! :17good
User avatar
Beuwolf
Posts: 28
Joined: February 15th, 2020, 10:08 pm

Re: Would like to have a skin previewd and commented on please.

Post by Beuwolf »

balala wrote:
March 10th, 2020, 9:50 pm
Yes, but maybe it worth a try. I don't work anymore today, but tomorrow may give it a try (however I'm not good at image manipulation at all).
Here are the resized images. Made them all 64x64, which does make the overall size of the folder go down from 3.41MB to 452KB.
You do not have the required permissions to view the files attached to this post.
User avatar
balala
Rainmeter Sage
Posts: 11009
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Would like to have a skin previewd and commented on please.

Post by balala »

Beuwolf wrote:
March 10th, 2020, 10:28 pm
I both like the icons and not. O.O They do their job as showing what is what, but at the same time I wouldn't mind if they were more uniform in style. But for that I need to find a good, and relatively, easy program to make icon's with. That's for another time though. :D
Yes, right, a little bit more uniform look would be nice, but for a first skin you've created, they are looking good. Unfortunately my image manipulating skill is, well, not to high, someone else will help you here, hopefully.
Beuwolf wrote:
March 10th, 2020, 10:28 pm
This I was not aware of, thanks for pointing it out ! :oops:
Yes, unfortunately this seems to be a relatively common mistake, which can cause a lot of trouble on long term.
Beuwolf wrote:
March 10th, 2020, 10:28 pm
And then just WOW ! :jawdrop That was much more then I had expected anyone do ! Thought it be a point in that => direction and read up on how to do it. Much more professional looking as well, then what I would have managed do with it !
I'm glad. Just mentioning that when hovering the mouse over an icon, it has to be resized and repositioned, as well as the next icon, which also has to be repositioned. Otherwise the following icons would move. Not an extremely easy procedure, especially for a beginner.
Another possible approach would be by TransformationMatrix, as suggested by Yincognito in the PS of his previous reply. A little bit later I'll give it a try to see how it can be handled, but I suppose it'll work and the code would be much simple. Hopefully will come back with a solution, so let's see...
Beuwolf wrote:
March 10th, 2020, 10:28 pm
Ohh you done plenty already, I try and fix all the icons in 64x64 format and zip them up here tomorrow. Should have the time unless something unexpected happens.
I see you did. Later will give it a try.
User avatar
Yincognito
Posts: 1914
Joined: February 27th, 2015, 2:38 pm
Location: Terra Yincognita

Re: Would like to have a skin previewd and commented on please.

Post by Yincognito »

Beuwolf wrote:
March 10th, 2020, 10:28 pm
Not sure if would have been pointless, would meant less code. :p Although I do see the advantages with your code, since it be more flexible as to what size wanting the icons to be. And no, I did not have a fff.png but found a substitute to use instead ! ;-)
Unless we're talking about performance (and potentially lowered CPU usage), resizing the icons would have been indeed pointless. My sample code needed just to be copy pasted into your skin and then "blended" / "merged" with your existing code. Once you did this for an image, you would have known how to do it for the others, and it would have been just a matter of copy/paste/replace in selection to replicate this in Notepad++. But then, of course, balala rewrote the whole skin already so it's easier to just take the final product, LOL. I follow a different principle, in life and here on this forum: I show the OPs how it's done, so they can understand the process, then it's up to them to do the rest of the mass modifications in their skins. So, along those lines, here is your skin with the first two images "converted" to resemble my posted sample (as said, it's up to you to do the rest of the job, as I'm not going to do it for you - that's the only way one can learn, by doing things himself):

Code: Select all

; Lines starting ; (semicolons) are commented out.
; That is, they do not affect the code and are here for demonstration purposes only.
; ----------------------------------

; =============================================================================================
; ===================		BE AWARE		BE AWARE		BE AWARE		===================
; =============================================================================================
; ======																				 ======
; ======				First of, thank you for downloading this skin !					 ======
; ======																				 ======
; ======	Second: Some, or maybe even most, of the Shortcuts already added will not	 ======
; ======	be working due to different paths on mine and your PC.  There are two 		 ======
; ======	alternatives to sort this out:												 ======
; ======																				 ======
; ======	1)	Can change the affected shortcuts within this skin, by changing images	 ======
; ======		and program/game paths.	 Instructions below how to proceed if chossing	 ======
; ======		this way.																 ======
; ======																				 ======
; ======	OR																			 ======
; ======																				 ======
; ======	2)	Activate the other skin within the folder ** Your Personal Launcher **	 ======
; ======		Which is presently just having the basic code entered and you yourself	 ======
; ======		have to add the Images needed and the short cut paths for the programs	 ======
; ======		or games you want to have access too.									 ======
; ======																				 ======
; =============================================================================================
; ===================		BE AWARE		BE AWARE		BE AWARE		===================
; =============================================================================================



; HOWTO: Adding more Programs
; ----------------------------------
; If you want to add more programs to this dock it is rather straight forward. Be aware you would have to make the dock longer to accomodate the additional programs though. Follow these steps to add more programs.
;
; 1) Find the image you want to use for your desired program/game and then do the following steps:
;
; 2) For the first 12 additional programs though, that you might want to add, the basic coding has already been added.  What else that is needed to make it work, you will have to fill in and it is mentioned down at the first free space.
;
; 3) Save the change you made, then either right click on the skin and refresh it to see the changes, or use the refresh option in the Manage Rainmeter window. This is just to make sure it all looks right before continuing adding more.
;
; 4) If you know you be needing more rows then copy everything between row Six and Seven, and paste it in underneath row Seventh.
;
;	- If adding a seventh or more rows, please be aware that you will also need to change the end number, XYZ, for each [MeterProgramImage_XYZ].
;
; Additional Information for Extra Credit: :P
; - If you want to go a bit further then just adding normal programs/games, i.e. Computer Managment or similar folders, then use this link and find what you need: https://docs.rainmeter.net/tips/launching-windows-special-folders/
;
; Enjoy and hope you will have good use of this gadget!
;
; ----------------------------------
; End of HOWTO section.


[Rainmeter]
; This section contains general settings that can be used to change how Rainmeter behaves.
Update=1000
DynamicWindowSize=1
AccurateText=1
MiddleMouseUpAction=["#@#Settings.inc"]

[Metadata]
; Contains basic information of the skin.
Name=Colorfulness Suite
Author=Beuwolf
Information=Displays different Program or Game shortcuts.
License=Creative Commons Attribution-NonCommercial-ShareAlike 3.0
Version=0.6

; ----------------------------------
; Variables
; ----------------------------------

[Variables]
; Variables declared here can be used later on between two # characters (e.g. #MyVariable#).

;Fonts & Colours
@include="#@#\Settings.inc"
; #@# is equal to Rainmeter\Skins\Colorfulness - Programs\@Resources
; More information about the @Include settings can be found at https://docs.rainmeter.net/manual/skins/include-option/

SizeBig=64
SizeSmall=48

[MeterBackground]
Meter=Shape
Shape=Rectangle 0.5,0.5,484,379,50 | Fill Color #BackgroundColor# | StrokeWidth 4 | Stroke LinearGradient MyStrokeGradient
MyStrokeGradient=215 | 0,0,255,255 ; 0.0 | 0,255,0,255 ; 0.25 | 255,0,0,255 ; 0.50 | 255,100,0,255 ; 0.75 | 235,225,20,255 ; 1.0
X=0
W=485
H=380
; Information as to how to make the Gadget's background can be found at https://docs.rainmeter.net/manual/meters/shape/ - Ended up being a bit easier understand how it all works once I reached the end and could download the .rmskin though. :)

; ----------------------------------
; STYLES are used to "centralize" options
; ----------------------------------

; This style is only for the first image in each row.
[StyleImage_L]
X=0r
Y=5R
W=64
H=64
; The W and H decided the size of the images. If changes the size of this image, remember to also change the image size on the ones under [StyleImage_M+R]


; This style being used for all other images, no matter the row.
[StyleImage_M+R]
X=10R
Y=0r
W=64
H=64
; Remember to change the W and H here as well if changing them at the [StyleImage_L] command.

; ----------------------------------
; METERS display images, text, bars, etc.
; ----------------------------------

[MeterTitle]
Meter=String
StringAlign=Center
MeterStyle=StyleTitle
; Using MeterStyle=StyleTitle will basically "copy" the
; contents of the [StyleTitle] section here during runtime.
X=242
Y=20
Text=Programs
; Even though the text is set to Disks, Rainmeter will display
; it as DISKS, because StyleTitle contains StringCase=Upper.

[MeterBar]
Meter=Shape
MeterStyle=StyleBar
W=435


; =============================================================
; ==================		First Row		===================
; =============================================================

; The 'big' bars above containing the row numbers are just to make it easier to find each row if changing things, up to each and one if wanting to keep it or not. :)

[MeterProgramImage_1_Container]
Meter=Shape
Shape=Rectangle 0,0,(#SizeBig#),(#SizeBig#) | StrokeWidth 0 | Fill Color 0,0,0,255
MeterStyle=StyleImage_L
DynamicVariables=1

[MeterProgramImage_1]
Meter=Image
Container=MeterProgramImage_1_Container
ImageName=#@#Images\Notepad.png
X=((#SizeBig#-#SizeSmall#)/2)
Y=((#SizeBig#-#SizeSmall#)/2)
W=(#SizeSmall#)
H=(#SizeSmall#)
MouseOverAction=[!SetOption MeterProgramImage_1 X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_1 Y ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_1 W (#SizeBig#)][!SetOption MeterProgramImage_1 H (#SizeBig#)][!UpdateMeter MeterProgramImage_1][!Redraw]
MouseLeaveAction=[!SetOption MeterProgramImage_1 X ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_1 Y ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_1 W (#SizeSmall#)][!SetOption MeterProgramImage_1 H (#SizeSmall#)][!UpdateMeter MeterProgramImage_1][!Redraw]
LeftMouseUpAction=["C:\Windows\System32\Notepad.exe"]
ToolTipText=Notepad
DynamicVariables=1

; Hovering over this meter will display a tooltip with the text above.
; If adding #CRLF# variable then it creates a new line.

[MeterProgramImage_2_Container]
Meter=Shape
Shape=Rectangle 0,0,(#SizeBig#),(#SizeBig#) | StrokeWidth 0 | Fill Color 0,0,0,255
MeterStyle=StyleImage_M+R
DynamicVariables=1

[MeterProgramImage_2]
Meter=Image
Container=MeterProgramImage_2_Container
ImageName=#@#Images\Notepad++.png
X=((#SizeBig#-#SizeSmall#)/2)
Y=((#SizeBig#-#SizeSmall#)/2)
W=(#SizeSmall#)
H=(#SizeSmall#)
MouseOverAction=[!SetOption MeterProgramImage_2 X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_2 Y ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_2 W (#SizeBig#)][!SetOption MeterProgramImage_2 H (#SizeBig#)][!UpdateMeter MeterProgramImage_2][!Redraw]
MouseLeaveAction=[!SetOption MeterProgramImage_2 X ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_2 Y ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_2 W (#SizeSmall#)][!SetOption MeterProgramImage_2 H (#SizeSmall#)][!UpdateMeter MeterProgramImage_2][!Redraw]
LeftMouseUpAction=["C:\Program Files\Notepad++\notepad++.exe"]
ToolTipText=Notepad++
DynamicVariables=1

[MeterProgramImage_3]
Meter=Image
ImageName=#@#Images\Paint.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["MSPaint.exe"]
ToolTipText=MS Paint

[MeterProgramImage_4]
Meter=Image
ImageName=#@#Images\gimp.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\GIMP 2\bin\gimp-2.10.exe"]
ToolTipText=GIMP Image Program

[MeterProgramImage_5]
Meter=Image
ImageName=#@#Images\Inkscape.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\Inkscape\inkscape.exe"]
ToolTipText=Inkscape

[MeterProgramImage_6]
Meter=Image
ImageName=#@#Images\WinRAR.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\WinRAR\WinRAR.exe"]
ToolTipText=WinRar

[MeterLine]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Second Row		===================
; =============================================================


[MeterProgramImage_7]
Meter=Image
ImageName=#@#Images\opera_gx.png
MeterStyle=StyleImage_L
LeftMouseUpAction=["C:\Program Files\Opera GX\launcher.exe"]
ToolTipText=Opera GX Browser

[MeterProgramImage_8]
Meter=Image
ImageName=#@#Images\ObjectDesktop.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Users\TS\AppData\Local\Stardock\ObjectDesktop\ObjectDesktopManager.exe"]
ToolTipText=Object Desktop

[MeterProgramImage_9]
Meter=Image
ImageName=#@#Images\IconDeveloper.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Stardock\IconDeveloper\IconDeveloper.exe"]
ToolTipText=IconDeveloper Program

[MeterProgramImage_10]
Meter=Image
ImageName=#@#Images\Steelseries.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\SteelSeries\SteelSeries Engine 3\SteelSeriesEngine3.exe" -dataPath="C:\ProgramData\SteelSeries\SteelSeries Engine 3" -dbEnv=production]
ToolTipText=Steelseries Engine 3

[MeterProgramImage_11]
Meter=Image
ImageName=#@#Images\CPU-Z.ico
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\CPUID\CPU-Z Aorus\cpuz.exe"]
ToolTipText=CPU Information

[MeterProgramImage_12]
Meter=Image
ImageName=#@#Images\GPU-Z.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\GPU-Z\GPU-Z.exe"]
ToolTipText=GPU Information

[MeterLine_2]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Third Row		===================
; =============================================================


[MeterProgramImage_13]
Meter=Image
ImageName=#@#Images\Steam.png
MeterStyle=StyleImage_L
LeftMouseUpAction=[H:\Steam\Steam.exe]
ToolTipText=Steam Launcher

[MeterProgramImage_14]
Meter=Image
ImageName=#@#Images\GOG.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\GOG Galaxy\GalaxyClient.exe"]
ToolTipText=GOG Galaxy 2.0 Launcher

[MeterProgramImage_15]
Meter=Image
ImageName=#@#Images\Uplay.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\Ubisoft Game Launcher\Uplay.exe"]
ToolTipText=Ubisoft Game Launcher

[MeterProgramImage_16]
Meter=Image
ImageName=#@#Images\RDR2.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\Rockstar Games\Launcher\LauncherPatcher.exe"]
ToolTipText=Rockstar Launcher

[MeterProgramImage_17]
Meter=Image
ImageName=#@#Images\My Pictures.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Borderless Gaming\BorderlessGaming.exe"]
ToolTipText=Borderlss Gaming

[MeterProgramImage_18]
Meter=Image
ImageName=#@#Images\DDDA.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["G:\Dragons Dogma\DDDASaveManager.exe"]
ToolTipText=Dragon's Dogma Dark Arisen Save Game Manager

[MeterLine_3]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Fourth Row		===================
; =============================================================


[MeterProgramImage_19]
Meter=Image
ImageName=#@#Images\samba.png
MeterStyle=StyleImage_L
LeftMouseUpAction=[Shell:::{BB06C0E4-D293-4f75-8A90-CB05B6477EEE}]
ToolTipText=PC Basic Information

[MeterProgramImage_20]
Meter=Image
ImageName=#@#Images\Screensaver.ico
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Users\TS\Desktop\Screen Saver Settings"]
;LeftMouseUpAction=[Shell:::{ED834ED6-4B5A-4bfe-8F11-A626DCB6A921}]
ToolTipText=Personalization Window

[MeterProgramImage_21]
Meter=Image
ImageName=#@#Images\About.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Windows\System32\winver.exe"]
ToolTipText=About Windows

[MeterProgramImage_22]
Meter=Image
ImageName=#@#Images\Protection.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Windows\System32\SystemPropertiesProtection.exe"]
ToolTipText=System Protection (Restore)

[MeterProgramImage_23]
Meter=Image
ImageName=#@#Images\ComMang.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["compmgmt.msc"]
ToolTipText=Computer Management

[MeterProgramImage_24]
Meter=Image
ImageName=#@#Images\Chatty.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Chatty\Chatty.exe"]
ToolTipText=Chatty for Twitch

[MeterLine_4]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Fifth Row		===================
; =============================================================


;[MeterProgramImage_25] [If starting this row and adding more short cuts, remember to delete the ; and whats within these brackets.]
Meter=Image
ImageName=#@#Images\ **Add name of image here, don't forget the extension i.e. png/ico **
MeterStyle=StyleImage_L
LeftMouseUpAction= ** Add location path to the program you want to be opened **
ToolTipText= ** Name of program that will  be showed if hoovering over image **

;[MeterProgramImage_26]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_27]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_28]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_29]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_30]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterLine_5]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Sixth Row		===================
; =============================================================


;[MeterProgramImage_31]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_L
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_32]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_33]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_34]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_35]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_36]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterLine_6]
Meter=Shape
MeterStyle=StyleBar_2


; =============================================================
; ==================		Seventh Row		===================
; =============================================================

; If wanting even more programs, copy all information between Row Six and Seven and pass it here.
; Remember to change the [MeterProgramImage_31] to 32 and so on for each additional image added.
; Also change the [MeterLine_6] to 7 if wanting even more rows, otherwise the rows will not be alligned properly.




Beuwolf wrote:
March 10th, 2020, 10:28 pm
Yeah, I did noticed it when trying your example alone. But when trying it within my code, it would not have it. First I had icon 1 moved up to the top left corner, which I managed to finally get where it were suppose to be. But once I moved the mouse over the icon, it jumped right back to the top corner. Once there I could move the mouse over it and it enlarged. Had to remove this part on both the Actions:

Code: Select all

[!SetOption MeterImage X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterImage Y ((#SizeBig#-#SizeBig#)/2)]
Then the icon stayed where it were suppose to be, but the end result meant that when hovering over it, the row is being pushed to the right. There probably are a way to get it work your way, I be having another look at it tomorrow and see if I can figure it out. :D
Well, nothing I post is without a purpose, and in my sample the first meter was a container. You probably didn't thought of including that in your edited skin, and this is why you experienced that behavior. The container's job in my sample is exactly that: to keep things static, in terms of position and dimensions. The image meter is drawn inside that container, and its position is relative to that of the container (and not to the other coordinates of the skin), so that's why you had those issues with positioning. I should have explained this at the time of posting, but apparently forgot to do it.
User avatar
Beuwolf
Posts: 28
Joined: February 15th, 2020, 10:08 pm

Re: Would like to have a skin previewd and commented on please.

Post by Beuwolf »

Yincognito wrote:
March 11th, 2020, 12:58 pm
Unless we're talking about performance (and potentially lowered CPU usage), resizing the icons would have been indeed pointless.
Yes, I was just joking around a bit with that comment. :oops:
Yincognito wrote:
March 11th, 2020, 12:58 pm
My sample code needed just to be copy pasted into your skin and then "blended" / "merged" with your existing code. Once you did this for an image, you would have known how to do it for the others, and it would have been just a matter of copy/paste/replace in selection to replicate this in Notepad++. But then, of course, balala rewrote the whole skin already so it's easier to just take the final product, LOL.
Yeah, hence my :jawdrop since I had not expected for him, or anyone, to return it all done, which I did mentioned yesterday as well. And although I did take it all to see how it looked I then went back to yours and tried to get it working. Which at the time last evening I couldn't, probably due to brain was a bit to tired. But now this morning...
Yincognito wrote:
March 11th, 2020, 12:58 pm
I follow a different principle, in life and here on this forum: I show the OPs how it's done, so they can understand the process, then it's up to them to do the rest of the mass modifications in their skins. So, along those lines, here is your skin with the first two images "converted" to resemble my posted sample (as said, it's up to you to do the rest of the job, as I'm not going to do it for you - that's the only way one can learn, by doing things himself):
I got your code working earlier, and at this point have the first row done and about to start on the second one. I also made a DockSetting.inc file for all the [MeterImageContainer] tags. To make the .ini file a bit easier to read and mange (in my eyes at least).
Yincognito wrote:
March 11th, 2020, 12:58 pm
Well, nothing I post is without a purpose, and in my sample the first meter was a container. You probably didn't thought of including that in your edited skin, and this is why you experienced that behavior. The container's job in my sample is exactly that: to keep things static, in terms of position and dimensions. The image meter is drawn inside that container, and its position is relative to that of the container (and not to the other coordinates of the skin), so that's why you had those issues with positioning. I should have explained this at the time of posting, but apparently forgot to do it.
I figured it was something that was pulling it back. So this morning I was playing around with the code, doing some trail and errors, including adding other colors, then I realize there was a 'hidden' box and after a few more T&E's I figured it out and got it all working.

I appreciate the assistant from both of you, you both made me learn something new and most likely will again. If not in this thread, it be in another one I'm sure of. :thumbup:

If you guys have any more tidbits to share I'm all ear. Fact is, you did mention something about "glowing" on hover yesterday ?? Mind pointing me in that direction so I can read up on it and see if I can get it to work ?? I'm presuming there is some documentation about it, right ?
User avatar
jsmorley
Developer
Posts: 21014
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Re: Would like to have a skin previewd and commented on please.

Post by jsmorley »

Code: Select all

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

[Variables]
W=5
U=[!UpdateMeasure MeasureFader][!UpdateMeterGroup Faders][!Redraw]
CurrentAlphaOne=160
CurrentAlphaTwo=160
CurrentAlphaThree=160
CurrentAlphaFour=160
CurrentAlphaFive=160

[MeasureFader]
Measure=Plugin
Plugin=ActionTimer
ActionList1=Repeat Fade1,#W#,20
Fade1=[!SetVariable CurrentAlphaOne "(Clamp(#CurrentAlphaOne#-5,160,255))"]#U#
ActionList2=Repeat Fade2,#W#,20
Fade2=[!SetVariable CurrentAlphaOne "(Clamp(#CurrentAlphaOne#+5,160,255))"]#U#
ActionList3=Repeat Fade3,#W#,20
Fade3=[!SetVariable CurrentAlphaTwo "(Clamp(#CurrentAlphaTwo#-5,160,255))"]#U#
ActionList4=Repeat Fade4,#W#,20
Fade4=[!SetVariable CurrentAlphaTwo "(Clamp(#CurrentAlphaTWo#+5,160,255))"]#U#
ActionList5=Repeat Fade5,#W#,20
Fade5=[!SetVariable CurrentAlphaThree "(Clamp(#CurrentAlphaThree#-5,160,255))"]#U#
ActionList6=Repeat Fade6,#W#,20
Fade6=[!SetVariable CurrentAlphaThree "(Clamp(#CurrentAlphaThree#+5,160,255))"]#U#
ActionList7=Repeat Fade7,#W#,20
Fade7=[!SetVariable CurrentAlphaFour "(Clamp(#CurrentAlphaFour#-5,160,255))"]#U#
ActionList8=Repeat Fade8,#W#,20
Fade8=[!SetVariable CurrentAlphaFour "(Clamp(#CurrentAlphaFour#+5,160,255))"]#U#
ActionList9=Repeat Fade9,#W#,20
Fade9=[!SetVariable CurrentAlphaFive "(Clamp(#CurrentAlphaFive#-5,160,255))"]#U#
ActionList10=Repeat Fade10,#W#,20
Fade10=[!SetVariable CurrentAlphaFive "(Clamp(#CurrentAlphaFive#+5,160,255))"]#U#
DynamicVariables=1

[TextStyle]
Group=Faders
Y=5R
W=120
FontSize=13
FontWeight=700
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
DynamicVariables=1

[MeterOne]
Meter=String
MeterStyle=TextStyle
Y=0
FontColor=255,255,255,#CurrentAlphaOne#
Text=Meter One
MouseOverAction=[!CommandMeasure MeasureFader "Stop 1"][!CommandMeasure MeasureFader "Execute 2"]
MouseLeaveAction=[!CommandMeasure MeasureFader "Stop 2"][!CommandMeasure MeasureFader "Execute 1"]

[MeterTwo]
Meter=String
MeterStyle=TextStyle
FontColor=255,255,255,#CurrentAlphaTwo#
Text=Meter Two
MouseOverAction=[!CommandMeasure MeasureFader "Stop 3"][!CommandMeasure MeasureFader "Execute 4"]
MouseLeaveAction=[!CommandMeasure MeasureFader "Stop 4"][!CommandMeasure MeasureFader "Execute 3"]

[MeterThree]
Meter=String
MeterStyle=TextStyle
FontColor=255,255,255,#CurrentAlphaThree#
Text=Meter Three
MouseOverAction=[!CommandMeasure MeasureFader "Stop 5"][!CommandMeasure MeasureFader "Execute 6"]
MouseLeaveAction=[!CommandMeasure MeasureFader "Stop 6"][!CommandMeasure MeasureFader "Execute 5"]

[MeterFour]
Meter=String
MeterStyle=TextStyle
FontColor=255,255,255,#CurrentAlphaFour#
Text=Meter Four
MouseOverAction=[!CommandMeasure MeasureFader "Stop 7"][!CommandMeasure MeasureFader "Execute 8"]
MouseLeaveAction=[!CommandMeasure MeasureFader "Stop 8"][!CommandMeasure MeasureFader "Execute 7"]

[MeterFive]
Meter=String
MeterStyle=TextStyle
FontColor=255,255,255,#CurrentAlphaFive#
Text=Meter Five
MouseOverAction=[!CommandMeasure MeasureFader "Stop 9"][!CommandMeasure MeasureFader "Execute 10"]
MouseLeaveAction=[!CommandMeasure MeasureFader "Stop 10"][!CommandMeasure MeasureFader "Execute 9"]

test.gif


https://docs.rainmeter.net/manual/plugins/actiontimer/
You do not have the required permissions to view the files attached to this post.
User avatar
Yincognito
Posts: 1914
Joined: February 27th, 2015, 2:38 pm
Location: Terra Yincognita

Re: Would like to have a skin previewd and commented on please.

Post by Yincognito »

Ok, I built on the previously posted code and made everything (including the background, the bars, the images, etc.) adapt to just 2 variables: #SizeBig# (image size when hovered) and #SizeSmall# (image size when not hovered). As previously said, only the first 2 images are "converted" to my approach, the rest is for you to try. But, very important, now you can set those two variables above to whatever value you want in the [Variables] section and the entire skin and its elements will "resize" themselves accordingly (and yes, with some small modifications, that resize can happen dynamically, say, on mouse scroll or something):

First, in Settings.inc, replace the existing section with the following:

Code: Select all

[StyleBar_2]
X=25
Y=5R
Shape=Rectangle 0,0,(#SizeBig#*6+51),1 | Extend MyModifiers1
MyModifiers1=Fill Color 211,2211,211,25 | StrokeWidth 0
Then, in the main .ini file (I worked with Program Launcher.ini), replace the entire code with this:

Code: Select all

; Lines starting ; (semicolons) are commented out.
; That is, they do not affect the code and are here for demonstration purposes only.
; ----------------------------------

; =============================================================================================
; ===================		BE AWARE		BE AWARE		BE AWARE		===================
; =============================================================================================
; ======																				 ======
; ======				First of, thank you for downloading this skin !					 ======
; ======																				 ======
; ======	Second: Some, or maybe even most, of the Shortcuts already added will not	 ======
; ======	be working due to different paths on mine and your PC.  There are two 		 ======
; ======	alternatives to sort this out:												 ======
; ======																				 ======
; ======	1)	Can change the affected shortcuts within this skin, by changing images	 ======
; ======		and program/game paths.	 Instructions below how to proceed if chossing	 ======
; ======		this way.																 ======
; ======																				 ======
; ======	OR																			 ======
; ======																				 ======
; ======	2)	Activate the other skin within the folder ** Your Personal Launcher **	 ======
; ======		Which is presently just having the basic code entered and you yourself	 ======
; ======		have to add the Images needed and the short cut paths for the programs	 ======
; ======		or games you want to have access too.									 ======
; ======																				 ======
; =============================================================================================
; ===================		BE AWARE		BE AWARE		BE AWARE		===================
; =============================================================================================



; HOWTO: Adding more Programs
; ----------------------------------
; If you want to add more programs to this dock it is rather straight forward. Be aware you would have to make the dock longer to accomodate the additional programs though. Follow these steps to add more programs.
;
; 1) Find the image you want to use for your desired program/game and then do the following steps:
;
; 2) For the first 12 additional programs though, that you might want to add, the basic coding has already been added.  What else that is needed to make it work, you will have to fill in and it is mentioned down at the first free space.
;
; 3) Save the change you made, then either right click on the skin and refresh it to see the changes, or use the refresh option in the Manage Rainmeter window. This is just to make sure it all looks right before continuing adding more.
;
; 4) If you know you be needing more rows then copy everything between row Six and Seven, and paste it in underneath row Seventh.
;
;	- If adding a seventh or more rows, please be aware that you will also need to change the end number, XYZ, for each [MeterProgramImage_XYZ].
;
; Additional Information for Extra Credit: :P
; - If you want to go a bit further then just adding normal programs/games, i.e. Computer Managment or similar folders, then use this link and find what you need: https://docs.rainmeter.net/tips/launching-windows-special-folders/
;
; Enjoy and hope you will have good use of this gadget!
;
; ----------------------------------
; End of HOWTO section.


[Rainmeter]
; This section contains general settings that can be used to change how Rainmeter behaves.
Update=1000
DynamicWindowSize=1
AccurateText=1
MiddleMouseUpAction=["#@#Settings.inc"]

[Metadata]
; Contains basic information of the skin.
Name=Colorfulness Suite
Author=Beuwolf
Information=Displays different Program or Game shortcuts.
License=Creative Commons Attribution-NonCommercial-ShareAlike 3.0
Version=0.6

; ----------------------------------
; Variables
; ----------------------------------

[Variables]
; Variables declared here can be used later on between two # characters (e.g. #MyVariable#).

SizeBig=100
SizeSmall=48

;Fonts & Colours
@include="#@#\Settings.inc"
; #@# is equal to Rainmeter\Skins\Colorfulness - Programs\@Resources
; More information about the @Include settings can be found at https://docs.rainmeter.net/manual/skins/include-option/


[MeterBackground]
Meter=Shape
Shape=Rectangle 0.5,0.5,(#SizeBig#*6+101-1),(#SizeBig#*4+124-1),50 | Fill Color #BackgroundColor# | StrokeWidth 4 | Stroke LinearGradient MyStrokeGradient
MyStrokeGradient=215 | 0,0,255,255 ; 0.0 | 0,255,0,255 ; 0.25 | 255,0,0,255 ; 0.50 | 255,100,0,255 ; 0.75 | 235,225,20,255 ; 1.0
X=0
W=(#SizeBig#*6+101)
H=(#SizeBig#*4+124)
; Information as to how to make the Gadget's background can be found at https://docs.rainmeter.net/manual/meters/shape/ - Ended up being a bit easier understand how it all works once I reached the end and could download the .rmskin though. :)

; ----------------------------------
; STYLES are used to "centralize" options
; ----------------------------------

; This style is only for the first image in each row.
[StyleImage_L]
X=0r
Y=5R
W=#SizeBig#
H=#SizeBig#
; The W and H decided the size of the images. If changes the size of this image, remember to also change the image size on the ones under [StyleImage_M+R]


; This style being used for all other images, no matter the row.
[StyleImage_M+R]
X=10R
Y=0r
W=#SizeBig#
H=#SizeBig#
; Remember to change the W and H here as well if changing them at the [StyleImage_L] command.

; ----------------------------------
; METERS display images, text, bars, etc.
; ----------------------------------

[MeterTitle]
Meter=String
StringAlign=Center
MeterStyle=StyleTitle
; Using MeterStyle=StyleTitle will basically "copy" the
; contents of the [StyleTitle] section here during runtime.
X=((#SizeBig#*6+101-1)/2)
Y=20
Text=Programs
DynamicVariables=1
; Even though the text is set to Disks, Rainmeter will display
; it as DISKS, because StyleTitle contains StringCase=Upper.

[MeterBar]
Meter=Shape
MeterStyle=StyleBar
W=(#SizeBig#*6+51)
DynamicVariables=1


; =============================================================
; ==================		First Row		===================
; =============================================================

; The 'big' bars above containing the row numbers are just to make it easier to find each row if changing things, up to each and one if wanting to keep it or not. :)

[MeterProgramImage_1_Container]
Meter=Shape
Shape=Rectangle 0,0,(#SizeBig#),(#SizeBig#) | StrokeWidth 0 | Fill Color 0,0,0,255
MeterStyle=StyleImage_L
DynamicVariables=1

[MeterProgramImage_1]
Meter=Image
Container=MeterProgramImage_1_Container
ImageName=#@#Images\Notepad.png
X=((#SizeBig#-#SizeSmall#)/2)
Y=((#SizeBig#-#SizeSmall#)/2)
W=(#SizeSmall#)
H=(#SizeSmall#)
MouseOverAction=[!SetOption MeterProgramImage_1 X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_1 Y ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_1 W (#SizeBig#)][!SetOption MeterProgramImage_1 H (#SizeBig#)][!UpdateMeter MeterProgramImage_1][!Redraw]
MouseLeaveAction=[!SetOption MeterProgramImage_1 X ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_1 Y ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_1 W (#SizeSmall#)][!SetOption MeterProgramImage_1 H (#SizeSmall#)][!UpdateMeter MeterProgramImage_1][!Redraw]
LeftMouseUpAction=["C:\Windows\System32\Notepad.exe"]
ToolTipText=Notepad
DynamicVariables=1

; Hovering over this meter will display a tooltip with the text above.
; If adding #CRLF# variable then it creates a new line.

[MeterProgramImage_2_Container]
Meter=Shape
Shape=Rectangle 0,0,(#SizeBig#),(#SizeBig#) | StrokeWidth 0 | Fill Color 0,0,0,255
MeterStyle=StyleImage_M+R
DynamicVariables=1

[MeterProgramImage_2]
Meter=Image
Container=MeterProgramImage_2_Container
ImageName=#@#Images\Notepad++.png
X=((#SizeBig#-#SizeSmall#)/2)
Y=((#SizeBig#-#SizeSmall#)/2)
W=(#SizeSmall#)
H=(#SizeSmall#)
MouseOverAction=[!SetOption MeterProgramImage_2 X ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_2 Y ((#SizeBig#-#SizeBig#)/2)][!SetOption MeterProgramImage_2 W (#SizeBig#)][!SetOption MeterProgramImage_2 H (#SizeBig#)][!UpdateMeter MeterProgramImage_2][!Redraw]
MouseLeaveAction=[!SetOption MeterProgramImage_2 X ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_2 Y ((#SizeBig#-#SizeSmall#)/2)][!SetOption MeterProgramImage_2 W (#SizeSmall#)][!SetOption MeterProgramImage_2 H (#SizeSmall#)][!UpdateMeter MeterProgramImage_2][!Redraw]
LeftMouseUpAction=["C:\Program Files\Notepad++\notepad++.exe"]
ToolTipText=Notepad++
DynamicVariables=1

[MeterProgramImage_3]
Meter=Image
ImageName=#@#Images\Paint.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["MSPaint.exe"]
ToolTipText=MS Paint

[MeterProgramImage_4]
Meter=Image
ImageName=#@#Images\gimp.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\GIMP 2\bin\gimp-2.10.exe"]
ToolTipText=GIMP Image Program

[MeterProgramImage_5]
Meter=Image
ImageName=#@#Images\Inkscape.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\Inkscape\inkscape.exe"]
ToolTipText=Inkscape

[MeterProgramImage_6]
Meter=Image
ImageName=#@#Images\WinRAR.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\WinRAR\WinRAR.exe"]
ToolTipText=WinRar

[MeterLine]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Second Row		===================
; =============================================================


[MeterProgramImage_7]
Meter=Image
ImageName=#@#Images\opera_gx.png
MeterStyle=StyleImage_L
LeftMouseUpAction=["C:\Program Files\Opera GX\launcher.exe"]
ToolTipText=Opera GX Browser

[MeterProgramImage_8]
Meter=Image
ImageName=#@#Images\ObjectDesktop.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Users\TS\AppData\Local\Stardock\ObjectDesktop\ObjectDesktopManager.exe"]
ToolTipText=Object Desktop

[MeterProgramImage_9]
Meter=Image
ImageName=#@#Images\IconDeveloper.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Stardock\IconDeveloper\IconDeveloper.exe"]
ToolTipText=IconDeveloper Program

[MeterProgramImage_10]
Meter=Image
ImageName=#@#Images\Steelseries.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\SteelSeries\SteelSeries Engine 3\SteelSeriesEngine3.exe" -dataPath="C:\ProgramData\SteelSeries\SteelSeries Engine 3" -dbEnv=production]
ToolTipText=Steelseries Engine 3

[MeterProgramImage_11]
Meter=Image
ImageName=#@#Images\CPU-Z.ico
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files\CPUID\CPU-Z Aorus\cpuz.exe"]
ToolTipText=CPU Information

[MeterProgramImage_12]
Meter=Image
ImageName=#@#Images\GPU-Z.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\GPU-Z\GPU-Z.exe"]
ToolTipText=GPU Information

[MeterLine_2]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Third Row		===================
; =============================================================


[MeterProgramImage_13]
Meter=Image
ImageName=#@#Images\Steam.png
MeterStyle=StyleImage_L
LeftMouseUpAction=[H:\Steam\Steam.exe]
ToolTipText=Steam Launcher

[MeterProgramImage_14]
Meter=Image
ImageName=#@#Images\GOG.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\GOG Galaxy\GalaxyClient.exe"]
ToolTipText=GOG Galaxy 2.0 Launcher

[MeterProgramImage_15]
Meter=Image
ImageName=#@#Images\Uplay.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\Ubisoft Game Launcher\Uplay.exe"]
ToolTipText=Ubisoft Game Launcher

[MeterProgramImage_16]
Meter=Image
ImageName=#@#Images\RDR2.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["J:\Rockstar Games\Launcher\LauncherPatcher.exe"]
ToolTipText=Rockstar Launcher

[MeterProgramImage_17]
Meter=Image
ImageName=#@#Images\My Pictures.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Borderless Gaming\BorderlessGaming.exe"]
ToolTipText=Borderlss Gaming

[MeterProgramImage_18]
Meter=Image
ImageName=#@#Images\DDDA.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["G:\Dragons Dogma\DDDASaveManager.exe"]
ToolTipText=Dragon's Dogma Dark Arisen Save Game Manager

[MeterLine_3]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Fourth Row		===================
; =============================================================


[MeterProgramImage_19]
Meter=Image
ImageName=#@#Images\samba.png
MeterStyle=StyleImage_L
LeftMouseUpAction=[Shell:::{BB06C0E4-D293-4f75-8A90-CB05B6477EEE}]
ToolTipText=PC Basic Information

[MeterProgramImage_20]
Meter=Image
ImageName=#@#Images\Screensaver.ico
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Users\TS\Desktop\Screen Saver Settings"]
;LeftMouseUpAction=[Shell:::{ED834ED6-4B5A-4bfe-8F11-A626DCB6A921}]
ToolTipText=Personalization Window

[MeterProgramImage_21]
Meter=Image
ImageName=#@#Images\About.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Windows\System32\winver.exe"]
ToolTipText=About Windows

[MeterProgramImage_22]
Meter=Image
ImageName=#@#Images\Protection.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Windows\System32\SystemPropertiesProtection.exe"]
ToolTipText=System Protection (Restore)

[MeterProgramImage_23]
Meter=Image
ImageName=#@#Images\ComMang.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["compmgmt.msc"]
ToolTipText=Computer Management

[MeterProgramImage_24]
Meter=Image
ImageName=#@#Images\Chatty.png
MeterStyle=StyleImage_M+R
LeftMouseUpAction=["C:\Program Files (x86)\Chatty\Chatty.exe"]
ToolTipText=Chatty for Twitch

[MeterLine_4]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Fifth Row		===================
; =============================================================


;[MeterProgramImage_25] [If starting this row and adding more short cuts, remember to delete the ; and whats within these brackets.]
Meter=Image
ImageName=#@#Images\ **Add name of image here, don't forget the extension i.e. png/ico **
MeterStyle=StyleImage_L
LeftMouseUpAction= ** Add location path to the program you want to be opened **
ToolTipText= ** Name of program that will  be showed if hoovering over image **

;[MeterProgramImage_26]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_27]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_28]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_29]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_30]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterLine_5]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Sixth Row		===================
; =============================================================


;[MeterProgramImage_31]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_L
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_32]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_33]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_34]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_35]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterProgramImage_36]
Meter=Image
ImageName=#@#Images\
MeterStyle=StyleImage_M+R
LeftMouseUpAction=
ToolTipText=

;[MeterLine_6]
Meter=Shape
MeterStyle=StyleBar_2
DynamicVariables=1


; =============================================================
; ==================		Seventh Row		===================
; =============================================================

; If wanting even more programs, copy all information between Row Six and Seven and pass it here.
; Remember to change the [MeterProgramImage_31] to 32 and so on for each additional image added.
; Also change the [MeterLine_6] to 7 if wanting even more rows, otherwise the rows will not be alligned properly.




The SizeBig variable is intentionally set to 100, so you can see the effect of resizing the entire thing. You can set it to whatever value you want and the skin will adapt, the only "condition" that must be fulfilled for proper functioning is that SizeBig > SizeSmall (obviously, right?) - that's about it.
Beuwolf wrote:
March 11th, 2020, 2:02 pm
I figured it was something that was pulling it back. So this morning I was playing around with the code, doing some trail and errors, including adding other colors, then I realize there was a 'hidden' box and after a few more T&E's I figured it out and got it all working.

I appreciate the assistant from both of you, you both made me learn something new and most likely will again. If not in this thread, it be in another one I'm sure of. :thumbup:

If you guys have any more tidbits to share I'm all ear. Fact is, you did mention something about "glowing" on hover yesterday ?? Mind pointing me in that direction so I can read up on it and see if I can get it to work ?? I'm presuming there is some documentation about it, right ?
Very well - good job. That is what I was talking about: if you play with things a little, you eventually realize what everything does. On the glowing thing, I guess the "easiest" way is to photoshop some yellow brush in an image and display that image "under" the actual icon. As I said before, it's a bit more complicated than the icon resizing, not because it is difficult, but because it involves more work and effort to draw the whole thing in a program like Photoshop.