^
thank you SilverAzide. The camera image I attached (for descriptive purpose only) is 3680 x 160 and the ones in the images folder are 32 x 32.Is this a concern for this skin? Also, looking at your code and the skin code, I am not confident as to how to implement. -thx
It is currently September 1st, 2024, 2:34 am
My First Skin Help
-
- Posts: 287
- Joined: June 12th, 2016, 2:40 am
Re: My First Skin Help
Last edited by MourningStar on July 27th, 2021, 11:07 pm, edited 1 time in total.
-
- Rainmeter Sage
- Posts: 8003
- Joined: February 27th, 2015, 2:38 pm
- Location: Terra Yincognita
Re: My First Skin Help
I repeated this two times by now, LOL:MourningStar wrote: ↑July 27th, 2021, 10:22 pmRegarding the filmstrip/frame 'animation'. Does the frame-based graphic have to be individual frame pngs in sequence or can it be a single graphic with the 'frame' images next to each other thus
Yincognito wrote: ↑July 26th, 2021, 10:03 pmP.S. Rainmeter doesn't support animated GIFs, although a somewhat similar functionality is present by using a Bitmap meter (basically an image made of all the frames in the animation, placed as a "mozaic", aka sequentially one after another in the image; that requires a bit of photoshopping, obviously, but nothing complicated).
Sure, I was wrong that the Bitmap meter is the only way to have the animation in a single file, like SilverAzide pointed out (I somehow missed it, even though I also used the Crop method and found it even more effective than the Bitmap meter one!), but the idea was pretty clear. You're not skipping the explanations and look only for copy paste bits, now are you?Yincognito wrote: ↑July 27th, 2021, 10:30 am Indeed. I mentioned only the Bitmap meter because, just like a GIF, that's the only way you can have the animation in a single file. I suppose that was the thing MourningStar alluded to.![]()
![LOL :lol:](./images/smilies/ap.gif)
Positionally, it's not a concern, since the text is placed relative to the image, but it could be a concern when it comes to size and how that suites the skin (i.e. one would expect the "icon" to be smaller).MourningStar wrote: ↑July 27th, 2021, 11:02 pmThe camera image I attached (for descriptive purpose only) is 3680 x 160 and the ones in the images folder are 32 x 32.Is this a concern for this skin? Also, looking at your code and the skin code, I am not confident as to how to implement. -thx
The implementation is actually extremely simple, because the "foundation" for it is already done in the [Slider] measure, which more or less does what SilverAzide's [MeasureLoop] does, plus updating and redrawing things accordingly:
- copy your camera.png image in the @Resources\Images folder of your skin
- change the Count variable to 23 in [Variables], since there are 23 frames in your image
- change the #Index# part of the ImageName option in [FontName] to camera, so it will use your image instead of the old testing ones I added earlier
- add the adapted to this case ImageCrop=(160*(#Index#-1)),0,160,160,1 option to the [FontName] (aka your image) meter; basically, the [MeasureLoop] value in SilverAzide's sample becomes the #Index# variable in your code, but because I set the index to start at 1 and end up at 23, you need to subtract 1 from it, so that the first crop in your image starts at 0 horizontally and ends up one "frame width" (i.e. 160) to the left of the image file's width
P.S. There'll be a visual "shift" / "jump" you will notice when you mouse leave the image in the case of the "on demand" animation. That's just because the 1st and the 23th frames of the animation are visually similar, so a mouse leave would give the false impression that the animation does one more "step" in the filmstrip in that moment. This happens because the #Index# returns to 1 when mouse leaving the image. Photoshopping your image to have 24 frames with the 24th being identical to the 1st would solve that (because it would be a "full rotation").
-
- Posts: 287
- Joined: June 12th, 2016, 2:40 am
Re: My First Skin Help
no to the former, yes (naturally) to the latter.Yincognito wrote: ↑July 28th, 2021, 12:19 am... You're not skipping the explanations and look only for copy paste bits, now are you? ...
![Whistle :Whistle](./images/smilies/whistling.gif)
Something I have experienced as an educator and instructor. There are fundamentally two types of instruction of students and determines their comprehensive success. Those that can read/listen to information and those that need graphics and animation along with documentation and lectures. I was in the military and after boot camp was sent to a tech school. I soon realized much of the training methodology was WWII-era materials with heavy emphasis on films showing animations of the subject matter. I suppose the powers at the time realized that this was the fastest way to get our soldiers trained and shipped to war. Later, when I myself was tasked to instruct students, I was able to identify students that understood the topic strictly from documents and those that required visual supplementation to comprehend. I (hope I be not alone here) fall into the latter category, sorry, my $0.02.
![Sad :(](./images/smilies/ac.gif)
-
- Rainmeter Sage
- Posts: 8003
- Joined: February 27th, 2015, 2:38 pm
- Location: Terra Yincognita
Re: My First Skin Help
I agree: verbal and graphic understanding are two ways people can learn by, and the latter is more widespread than the former. You need to see the code at work to understand what's happening, but, just as an educator / instructor, I also need to see that the student is progressing and starts to catch things verbally too after a while and paying a bit of attention, since, after all, it's in his own benefit.MourningStar wrote: ↑July 28th, 2021, 1:14 am no to the former, yes (naturally) to the latter.![]()
Something I have experienced as an educator and instructor. There are fundamentally two types of instruction of students and determines their comprehensive success. Those that can read/listen to information and those that need graphics and animation along with documentation and lectures. I was in the military and after boot camp was sent to a tech school. I soon realized much of the training methodology was WWII-era materials with heavy emphasis on films showing animations of the subject matter. I suppose the powers at the time realized that this was the fastest way to get our soldiers trained and shipped to war. Later, when I myself was tasked to instruct students, I was able to identify students that understood the topic strictly from documents and those that required visual supplementation to comprehend. I (hope I be not alone here) fall into the latter category, sorry, my $0.02.![]()
![Confused :confused:](./images/smilies/bn.gif)
So, back to the topic, did you manage to make it work? Or I'm already downgraded to the status of a fallen angel? As they say, the bigger they are, the harder they fall...
![Big Grin :D](./images/smilies/ag.gif)
-
- Rainmeter Sage
- Posts: 2731
- Joined: March 23rd, 2015, 5:26 pm
Re: My First Skin Help
Well, the long strip you posted is 23 images (numbered 0 to 22), each 160px x 160px. The [MeasureLoop] measure in my example just counts from 0 to 22, over and over. The [MeterImage] meter is configured to display a cropped-out segment of the long strip.MourningStar wrote: ↑July 27th, 2021, 11:02 pm thank you SilverAzide. The camera image I attached (for descriptive purpose only) is 3680 x 160 and the ones in the images folder are 32 x 32.Is this a concern for this skin? Also, looking at your code and the skin code, I am not confident as to how to implement. -thx
So when the skin loads, starting with the first loop (where MeasureLoop returns value 0), the line...
Code: Select all
; ImageCrop = X,Y,W,H,1
ImageCrop=(160 * ([MeasureLoop])),0,160,160,1
The next time the skin updates, the loop counter is now at 1. So this will chop out a section starting at X=160 (i.e., 160 x 1) and displays it. The time after that will chop out a section starting at X = 320 (160 x 2), etc. So the Loop measure is basically causing the Image meter to display a "sliding window" of 160x160 images. This will animate the image.
The next question you had regarding the size, is if you want the image to display in a 32x32 square, you can set the W and H values on the meter like so:
Code: Select all
[MeterImage]
...
W=32
H=32
However, my example is just showing you a generic way to animate an image, in this case causing the camera to spin. Yincognito's info and code is really what you need to solve the specific case for what you are trying to achieve with your weather skin.
-
- Posts: 287
- Joined: June 12th, 2016, 2:40 am
Re: My First Skin Help
The following was in reply to your post of the code that centered the graphic :
I replaced your images with my own and also am satisfied. Scrolling of both, font and skin size work good. Very very small lag of image centering as skin resizes. Kind of cool as the jumps/shifting left to right look to be an animation unto itself. I like it. From all that you all have provided (sorry for the redundant questIons) I feel there is enough for me to move to the next phase and apply some animations I have in mind. If you recall initially, all I was looking at was simple smilie-type animations, like we have here in this forum post dialogue box. I doubt most of these are over 5 or so frames. I was not thinking beyond this much less the camera example. I just posted that to clarify my understanding of the concept. I don't really want to tax the cpu load unnecessarily.MourningStar wrote: ↑July 27th, 2021, 10:22 pmWith the images you supplied, I am very happy with the result. Hopefully, once I replace them with my image/s no issues surface.
- Have you abandoned the font/folder angle? It's ok, you have done more than expected with me and I do appreciate it - cheers.
-
- Rainmeter Sage
- Posts: 8003
- Joined: February 27th, 2015, 2:38 pm
- Location: Terra Yincognita
Re: My First Skin Help
Excellent! Well, an animation is an animation, irrespective of whether it's a smilie or something longer or larger - just follow the same multi-image code or the single-image adaptation steps and you'll be able to tweak it for any animation whatsoever. The CPU load depends on the size of your elements / skin, how optimized is the code and the environment (i.e. other programs or skins using the CPU). Since almost all the skin elements (bar the text, which because it's a WebParser related meter, it should be updated from jsmorley's .INC measures if it had an UpdateDivider=-1 like the other meters - something slightly trickier to do considering the more generalist way of coding those measures) have an UpdateDivider=-1 being set on them, the code is this time more or less correctly optimized to use as less CPU as possible in the circumstances, so it shouldn't tax the CPU more than strictly necessary. You can of course use the CPU monitors in the other skins you have to see if that's true.MourningStar wrote: ↑July 28th, 2021, 3:00 amI replaced your images with my own and also am satisfied. [...] If you recall initially, all I was looking at was simple smilie-type animations, like we have here in this forum post dialogue box. I doubt most of these are over 5 or so frames. I was not thinking beyond this much less the camera example. I just posted that to clarify my understanding of the concept. I don't really want to tax the cpu load unnecessarily.
No, not at all. Functionally the approach was finished since the night I told you I hoped to finish it, I just added some more little "features" to it in the meantime. I wanted to post it in the Tips and Tricks section of the forum, but I didn't felt like it yet. Didn't thin until now to post just the parts you needed here, but since you mentioned it, I'll post it later on today.MourningStar wrote: ↑July 28th, 2021, 3:00 am - Have you abandoned the font/folder angle? It's ok, you have done more than expected with me and I do appreciate it - cheers.
-
- Rainmeter Sage
- Posts: 8003
- Joined: February 27th, 2015, 2:38 pm
- Location: Terra Yincognita
Re: My First Skin Help
I shuffled some things, changed or added others, wrote some comments - make sure you check the modifications and feel free to change back the meters' positioning by swapping comments on the X/Y parts, because I just can't mouse over on something that jumps all around: This includes switching from the system fonts scan to the folder fonts scan (@Resources\Fonts folder is used, but it should be adjustable). Basically, it's all about:MourningStar wrote: ↑July 28th, 2021, 3:00 am- Have you abandoned the font/folder angle? It's ok, you have done more than expected with me and I do appreciate it - cheers.
Code: Select all
[FontList]
Measure=Plugin
Plugin=RunCommand
Program=
Parameter=reg query "HKLM\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Fonts" /s
Code: Select all
[FontList]
Measure=Plugin
Plugin=RunCommand
Program=powershell
Parameter=Add-Type -AssemblyName PresentationCore; Get-ChildItem '#@#Fonts\*.*' -Include *.otf,*.ttf | Foreach-Object {(New-Object -TypeName Windows.Media.GlyphTypeface -ArgumentList $_.FullName).Win32FamilyNames.Values}
You do not have the required permissions to view the files attached to this post.
-
- Posts: 287
- Joined: June 12th, 2016, 2:40 am
Re: My First Skin Help
Lookin' good in the neighborhood! You, sir, are a star.
![Thumbs Up :thumbup:](./images/smilies/ay.gif)
First observation (Issue could be on my end):
When I middle mouse clik on the image (camera in this skin) it toggles between system and skin's font folder (which has 11 fonts btw) correct? If yes, when the fonts folder is 'active' I am noticing that the last font remains displayed and I go thru a total of 16 cliks. I would expect only 10 cliks for the 11 fonts to appear. I see and expect this when the system fonts is 'active' because many fonts look identical. I will not require system fonts availability so I will have no need of that code or middlemouse switching code etc. relative code.
thoughts?
-
- Posts: 287
- Joined: June 12th, 2016, 2:40 am
Re: My First Skin Help
That is beautiful. I, for one, would replace my AMP Font Viewer app with this.Yincognito wrote: ↑July 28th, 2021, 5:09 pmFor the record, this is what it would have looked like ...
![Great :great:](./images/smilies/dn.gif)