{"id":85,"date":"2009-10-01T19:01:41","date_gmt":"2009-10-01T19:01:41","guid":{"rendered":"http:\/\/www.templarcreations.com\/?p=85"},"modified":"2009-10-01T19:01:41","modified_gmt":"2009-10-01T19:01:41","slug":"animated-textures-2","status":"publish","type":"post","link":"https:\/\/templarcreations.com\/?p=85","title":{"rendered":"Animated Textures – Tutorial 2"},"content":{"rendered":"

In the previous blog you saw how to use the SMOOTH option for simple animation.\u00a0Although this is useful, it is also rather limited. The usual way of creating\u00a0animated textures is by way of a texture which contains a set of ‘frames’, in a\u00a0way very similar to that used in traditional animation.<\/p>\n

Note: the examples from this blog are available as full-perm pre-built prims at\u00a0the Templar Creations sandbox (behind the main store), for you to copy and\u00a0experiment with, and use in your own builds if you wish.<\/p>\n

Let’s have an example. Here is a texture which has three frames, to create a\u00a0rotating gear:<\/p>\n

\"Gears
Gears example<\/figcaption><\/figure>\n
\"Gears
Gears example (animated)<\/figcaption><\/figure>\n

Let’s assume you are starting from scratch. When you apply the texture to the\u00a0prim, all three frames will be displayed (and will be ‘squashed’ horizontally):<\/p>\n

\"Gears
Gears image applied as texture<\/figcaption><\/figure>\n

This will be corrected when the animation starts running, but it is often useful\u00a0to have a single frame displayed when the animation is not active. To do this\u00a0for this particular texture (and any texture which has just three horizontal\u00a0frames), you need to set the horizontal repeat to 0.333, so that just 1\/3 of the texture is displayed. Set the horizontal offset to 0.666 to display the first\u00a0frame (understanding the offsets, and how to calculate the offsets you need in\u00a0order to display specific parts of a texture is an entire future blog article in\u00a0itself!).<\/p>\n

When the texture is not being animated, it will revert to this display.<\/p>\n

To start the animation, you need a script. On the Contents tab of the Build\u00a0dialog, click the New Script button, and double-click the script that appears,\u00a0to edit it.<\/p>\n

For this demonstration, the script will switch the animation on and off when\u00a0the prim is clicked on, so delete the contents of the script, and replace it\u00a0with the following:<\/p>\n

\n[sourcecode language='cpp']\ninteger isRunning = FALSE;\ndefault\n{\n    touch_start(integer count)\n    {\n        if (isRunning)\n        {\n            llSetTextureAnim(0, 0, 1, 1, 1, 1, 5.0);\n            isRunning = FALSE;\n        }\n        else\n        {\n            llSetTextureAnim(ANIM_ON | LOOP, 0, 3, 1, 0, 3, 5.0);\n            isRunning = TRUE;\n        }\n    }\n}\n[\/sourcecode]\n<\/pre>\n
The script uses the isRunning variable to keep track of whether the animation\u00a0is on or off. When someone touches the prim, if this is FALSE (the animation is\u00a0not running) it starts the animation, otherwise it stops the animation.<\/p>\n
So, what are the parameters?<\/p>\n
The first parameter is a set of flags, which in this case switch the animation\u00a0on (ANIM_ON), and set it to play continuously (LOOP). The next parameter is the\u00a0side of the prim which is to be animated. Use ALL_SIDES to animate all the sides\u00a0of the prim. In our example, only side 0 is animated.<\/p>\n
The next two parameters describe the layout of the frames — how many there are\u00a0horizontally (3 in this case), and how many there are vertically (1 in this\u00a0case).<\/p>\n
Suppose we had a texture which contained two vertical rows of three frames\u00a0each. The frames in this texture would get displayed in the following order:<\/p>\n
\"Animated
Frame order example<\/figcaption><\/figure>\n
The next two parameters are the first frame, and the number of frames. This\u00a0means that you can display only part of an animation if you want to. Some of\u00a0the animations in the Animated Texture pack make use of this by having the very\u00a0first frame as the ‘off’ frame, and displaying frames 2 to the end for the\u00a0actual animation.<\/p>\n
Note that the frames are numbered from 0, so in our three-frame example the\u00a0frames are 0, 1, and 2.<\/p>\n
The last parameter is the frame-rate — the number of frames per second.<\/p>\n
In the previous blog post, the animation used the SMOOTH flag to scroll a\u00a0single frame smoothly across the prim surface. Let’s take another look at this,\u00a0because there is a little more to the SMOOTH option.<\/p>\n
To demonstrate this, let’s have an image of 6 numbers:<\/p>\n
\"Scrolling
Scrolling frames example<\/figcaption><\/figure>\n
Apply this texture in place of the original and replace the second\u00a0llSetTextureAnim call in the script with the following:<\/p>\n
llSetTextureAnim(ANIM_ON | SMOOTH | LOOP, 0, 6, 1, 0, 6, 0.5);<\/p>\n
Save it, and touch the prim again to restart the animation. This time, you will\u00a0see each number smoothly scroll into view.<\/p>\n
In the next tutorial blog, I’ll show a third way of animating textures, which doesn’t make use of llSetTextureAnim() at all.<\/p>\n","protected":false},"excerpt":{"rendered":"
In the previous blog you saw how to use the SMOOTH option for simple animation.\u00a0Although this is useful, it is also rather limited. The usual way of creating\u00a0animated textures is by way of a texture which contains a set of ‘frames’, in a\u00a0way very similar to that used in traditional animation. Note: the examples from […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,9],"tags":[14,85,100,103],"class_list":["post-85","post","type-post","status-publish","format-standard","hentry","category-textures","category-tutorials","tag-animated","tag-second-life","tag-textures","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/templarcreations.com\/index.php?rest_route=\/wp\/v2\/posts\/85","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/templarcreations.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/templarcreations.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/templarcreations.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/templarcreations.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=85"}],"version-history":[{"count":0,"href":"https:\/\/templarcreations.com\/index.php?rest_route=\/wp\/v2\/posts\/85\/revisions"}],"wp:attachment":[{"href":"https:\/\/templarcreations.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=85"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/templarcreations.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=85"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/templarcreations.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=85"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}