Home arrow Multimedia arrow Page 3 - Learning To SMILe

Anatomy 101 - Multimedia

Take a tour of SMIL, the Synchronized Multimedia Integration Language, and find out how you can use it to quickly and rapidly build Web-based multimedia offerings incorporating multiple media types.

  1. Learning To SMILe
  2. Getting The Tools
  3. Anatomy 101
  4. Laying It Out
  5. Spending Time
  6. Playing In Sync
  7. A Click In Time...
  8. Bedtime Reading
By: icarus, (c) Melonfire
Rating: starstarstarstarstar / 8
November 21, 2002

print this article


SMIL files are based on XML, and therefore inherit all the attributes (and constraints) of that toolkit. An SMIL document consists of a series of nested elements, or tags, each one controlling some aspect of the final result. As with any XML document, element names are case-sensitive, and must be correctly nested in order for the document to be well-formed.

Here's a simple SMIL document:

<smil xmlns="http://www.w3.org/2001/SMIL20/Language"> <head> <layout> <root-layout width="500" height="400" backgroundColor="white" /> <region id="alpha" left="120" top="150" width="250" height="200" /> </layout> </head> <body> <img src="logo.jpg" alt="First image" region="alpha" /> </body> </smil>
In order to see how this works, save this document with a ".smil" file extension - for example, "simple.smil" - and then pop open your copy of the RealOne player and load this file into it. Once the player parses the file, you should see something like this:

Not very exciting, huh? Don't worry - we'll jazz it up a little further down. For the moment, let's just dissect the code above and see what each of those elements actually does.

Every SMIL document must begin and end with a pair of <smil>...</smil> elements; everything contained within these elements forms part of the SMIL presentation. The XML namespace for SMIL should be included in these elements via the "xmlns" attribute.

<smil xmlns="http://www.w3.org/2001/SMIL20/Language"> ... </smil>
The remainder of the document can broadly be divided into the <head> and the <body>, in much the same way as a regular HTML document. The <head> contains metadata (a description of the media presentation or a copyright notice) and layout information, while the <body> contains the elements that reference the actual media content or set up timers.

<smil xmlns="http://www.w3.org/2001/SMIL20/Language"> <head> ... </head> <body> ... </body> </smil>

>>> More Multimedia Articles          >>> More By icarus, (c) Melonfire

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort


- Basic Lighting in OpenGL and SDL Game Progra...
- Working with Colors in OpenGL for Game Progr...
- Animation in OpenGL for Game Programming usi...
- Game Programming with SDL: Getting Started w...
- Using OpenGL with SDL for Game Programming
- Learning Sound for Game Programming using SDL
- Game Programming using SDL: Raw Graphics and...
- Game Programming using SDL: Getting Started
- Network Radio With Icecast
- Learning To SMILe

Developer Shed Affiliates


Dev Shed Tutorial Topics: