Tarik: Protected "Modern Skin: Animatedlayer" [edit=autoconfirmed:move=autoconfirmed]

2008-09-25T13:11:13Z

Protected "Modern Skin: Animatedlayer" [edit=autoconfirmed:move=autoconfirmed]

Tarik: Unprotected "Modern Skin: Animatedlayer"

2008-09-24T17:15:21Z

Unprotected "Modern Skin: Animatedlayer"

Tarik: Protected "Modern Skin: Animatedlayer": There seems to be a problem with your login session [edit=sysop:move=sysop]

2008-09-22T21:29:37Z

Protected "Modern Skin: Animatedlayer": There seems to be a problem with your login session [edit=sysop:move=sysop]

Wahdahtahdammie at 19:36, 27 August 2008

2008-08-27T19:36:56Z

New page

Creating a Modern Skin --> [[Modern Skin: Intro|Intro]] --> [[Modern Skin: Winamp 2 to W3+|Winamp 2 to Winamp 3+]] --> [[Modern Skin: Simple Skin Tutorial|Simple Skin Tutorial]] --> [[Modern Skin: XML Intro|XML Intro]] --> [[Modern Skin: Simple Skin Tutorial (Continued)|Simple Skin Tutorial (Continued)]] --> [[Modern Skin: Container| Container]] --> [[Modern Skin: Group|Group]] --> [[Modern Skin: Relative Positioning| Relative Positioning]] --> [[Modern Skin: Complex Skin|Complex Skin]] --> [[Modern Skin: Non-Rect Player| Non-Rect Player]] --> [[Modern Skin: Layer Composition| Layer Composition]] --> [[Modern Skin: Alpha Channels| Alpha Channels]] --> [[Modern Skin: Animatedlayer|Animatedlayer]] --> [[Modern Skin: Snap Points|Snap Points]] --> [[Modern Skin: Drawers|Drawers]] --> [[Modern Skin: Skin Scripting| Skin Scripting]] --> [[Modern Skin: Drawer Scripting| Drawer Scripting]] --> [[Modern Skin: Animating a Skin|Animating a Skin]] --> [[Modern Skin: Maki Overview| Maki Overview]] --> [[Main_Page#Glossary_of_Terms|Glossary]]

An animated layer is a layer that displays a series of graphics by cycling through parts of a graphics file. A simple example is the rotating arrow that you see below.

An animated layer does not move. However, an animating skin does move. To move a graphical element in animating layer, you must write a MAKI script. Scripting is covered in the next section.

[[Image:Flash2.png]]

'''Complex Tutorial Modern Skin'''

In Complex Tutorial, Group #4 shows a spinning arrow inside a yellow circle. This is done through Animated Layer. Here's the process.

Lets go through in detail how do to each step:
*Make the graphics: rotating arrow
*Define the elements in the XML code.
*Define layers using those elements.

==Make the Graphics: Rotating Arrow==

When you make the graphics for this layer, make the graphics for each frame separately. Then put the frames together vertically in a single file as shown below. This example has a short animation. If you plan to show more complicated animation, make more frames.

[[Image:Animlayer graphics.png]]

<nowiki>*</nowiki> yellowcircle-arrow.png

==Define the Elements in the XML Code==

The definition for the element is the same as any bitmap definition. The thing that is different is the next step.

[[Image:Animlayer xml1.png]]

==Define Layers Using those Elements==

Take a look at line 70. The width and height tells Winamp3 how big each frame is. It will cycle through each frame automatically.

[[Image:Animlayer xml2.png]]

← Older revision	Revision as of 13:11, 25 September 2008
(No difference)

← Older revision	Revision as of 17:15, 24 September 2008
(No difference)

← Older revision	Revision as of 21:29, 22 September 2008
(No difference)

Modern Skin: Animatedlayer - Revision history

Tarik: Protected "Modern Skin: Animatedlayer" [edit=autoconfirmed:move=autoconfirmed]

Tarik: Unprotected "Modern Skin: Animatedlayer"

Tarik: Protected "Modern Skin: Animatedlayer": There seems to be a problem with your login session [edit=sysop:move=sysop]

Wahdahtahdammie at 19:36, 27 August 2008