How to display animation in Rainmeter

[kenz0]

This is a basic solution about how to display animation in Rainmeter.

Step1: Create a multiframe image which becomes the basis of animation.

• Note:
  To prevent the error in calculation, a vertical image should vertically arrange the frame. Also The horizontal image should horizontally arrange the frame.

• Tip:
  If you want to make multiframe from animation-GIF, you can easily convert it with Imagemagick.
  If Imagemagick has been installed in your PC, you only execute the following command lines in command prompt.

  Code: Select all

  convert.exe +append animation.gif multiframe.png

  "+append" option means the horizontal arrangement. "-append" means the vertical arrangement. If "-resize" option is added, you can also resize simultaneously.

Step2: Make a config file.

This is an config example of most basic animation method.

• ######### animation.ini ################
  [Rainmeter]
  Update=100
  
  [MeasureAnimation]
  Measure=CALC
  Formula=Counter % 5
  
  [MeterAnimation]
  Meter=BITMAP
  MeasureName=MeasureAnimation
  BitmapImage=silver_horse.png
  BitmapFrames=5
  BitmapExtend=1
  #######################################

• Note:
  - "Update" means animaton speed.
  - Define the total frame number of multiframe image in "BitmapFrames"
  - Define the same value as "BitmapFrames" in "Formula".

Step3: Try!

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Extra example - Try the movement of animation object

This is the interesting applied example which added the following methods.
http://forum.rainmeter.net/viewtopic.php?f=28&t=1117

• ######### animation2.ini ################
  [Rainmeter]
  Update=100
  
  [MeasureTrigger]
  Measure=Calc
  Formula=Counter % 2
  IfEqualValue=1
  IfEqualAction=!Move (Counter % #SCREENAREAWIDTH#) (#WORKAREAHEIGHT# - 86)
  
  [MeasureAnimation]
  Measure=CALC
  Formula=Counter % 5
  
  [MeterAnimation]
  Meter=BITMAP
  MeasureName=MeasureAnimation
  BitmapImage=silver_horse.png
  BitmapFrames=5
  BitmapExtend=1
  #######################################

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

» DOWNLOAD

Have fun!

[wasky1]

how come, SCREENAREAHEIGHT does the same as SREENAREAWIDTH e.g

Code: Select all

[Rainmeter]
Update=100

[MeasureMove]
Measure=Calc
Formula=Counter % #SCREENAREAHEIGHT#

[MeasureTrigger]
Measure=Calc
Formula=Counter % 2
IfEqualValue=1
IfEqualAction=!RainmeterMove [MeasureMove]

[MeasureAnimation]
Measure=CALC
Formula=Counter % 5

[MeterAnimation]
Meter=BITMAP
MeasureName=MeasureAnimation
BitmapImage=silver_horse.png
BitmapFrames=5
BitmapExtend=1

[r3ginald]

This is a basic solution about how to display animation in Rainmeter.

Step1: Create a multiframe image which becomes the basis of animation.

• Note:
  To prevent the error in calculation, a vertical image should vertically arrange the frame. Also The horizontal image should horizontally arrange the frame.

• Tip:
  If you want to make multiframe from animation-GIF, you can easily convert it with Imagemagick.
  If Imagemagick has been installed in your PC, you only execute the following command lines in command prompt.

  Code: Select all

  convert.exe +append animation.gif multiframe.png

  "+append" option means the horizontal arrangement. "-append" means the vertical arrangement. If "-resize" option is added, you can also resize simultaneously.

Step2: Make a config file.

This is an config example of most basic animation method.

• ######### animation.ini ################
  [Rainmeter]
  Update=100
  
  [MeasureAnimation]
  Measure=CALC
  Formula=Counter % 5
  
  [MeterAnimation]
  Meter=BITMAP
  MeasureName=MeasureAnimation
  BitmapImage=silver_horse.png
  BitmapFrames=5
  BitmapExtend=1
  #######################################

• Note:
  - "Update" means animaton speed.
  - Define the total frame number of multiframe image in "BitmapFrames"
  - Define the same value as "BitmapFrames" in "Formula".

Step3: Try!

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Extra example - Try the movement of animation object

This is the interesting applied example which added the following methods.
http://forum.rainmeter.net/viewtopic.php?f=28&t=1117

• ######### animation2.ini ################
  [Rainmeter]
  Update=100
  
  [MeasureMove]
  Measure=Calc
  Formula=Counter % #SCREENAREAWIDTH#
  
  [MeasurePositionY]
  Measure=Calc
  Formula=#WORKAREAHEIGHT# - 86
  
  [MeasureTrigger]
  Measure=Calc
  Formula=Counter % 2
  IfEqualValue=1
  IfEqualAction=!RainmeterMove [MeasureMove] [MeasurePositionY]
  
  [MeasureAnimation]
  Measure=CALC
  Formula=Counter % 5
  
  [MeterAnimation]
  Meter=BITMAP
  MeasureName=MeasureAnimation
  BitmapImage=silver_horse.png
  BitmapFrames=5
  BitmapExtend=1
  #######################################

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Attachment:

animation.zip

Have fun!

so what this is, is a bunch of pictures to make it look like an animation?

[jsmorley]

so what this is, is a bunch of pictures to make it look like an animation?

Is there any OTHER definition of animation I am unaware of?

[Chewtoy]

so what this is, is a bunch of pictures to make it look like an animation?

How else do make an animation? Or a movie for that matter. It's all pictures taken in a series of intervalls, making it like like it's moving...
So eh... Yes. A bunch of pictures. Just like any .gif or .avi (.avi got a sound track with it though...).

[redblack]

I forgot to mention this at the time, but these animation examples left tens of thousands of lines in my Rainmeter INI! If it were not for Notepad++ I do believe I may have died. :[

[smk]

hay this is pretty sweet, my only problum is that the Update value is not changing the speed of the animation, its always changing frame every secound, any way of changing this is it would go faster?

[kenz0]

hay this is pretty sweet, my only problum is that the Update value is not changing the speed of the animation, its always changing frame every secound, any way of changing this is it would go faster?

I am also sure that it is a weak point. I am actually experimenting in whether the speed adjustment which is not dependent on "Update" using "TransitionUpdate" and "BitmapTransitionFrames" is possible. But I have not established as a still decisive method.

[smk]

ok well keep us informed

[Alex2539]

In my experience, TransitionUpdate and BitmapTransitionFrames aren't really necessary if you're just trying to show an animation. The method you have works perfectly fine. If it's not speeding up then it's probably because the CPU is under too heavy a load to update the skin often enough.

If you do decided to use transition frames though, then you will need a little bit of planning ahead. If you were to call the frames F and the transition frames T, it would look something like this in the image:

Code: Select all

F T T T T F T T T T F T T T T 

When I first started experimenting, I always left out the trailing transitions after the final frame. The main caveat to this is that the TransitionUpdate has to be small enough that every one of the transition frames can play before the next real frame shows up. If it's too slow, it will get cut off. Conversely, if it's too fast, you'll see a bit of a pause. This restriction isn't really that bad, but it does necessitate a bit of planning. Even still the method isn't perfect. But it's pretty much the best way if the animation isn't the entire skin.

Also, keep in mind that what I've just said is mostly from memory, so the details may be off.