The animate tag will allow object properties to be animated following traditional animation keys. We have added some syntactic sugar for the case where there are only 2 keys. When you simply want to animate a property from a value to another, use the [from, to, in] properties.

property: Mandatory, indicates which property will be animated.

from: Starting value for a simple animation

to: End value for a simple animation

in: Length of the simple animation

keys: When the animation is not simple, the user must specify an array of keys (time, value) in the form:

<animate>
    <key t=0 v=0/>
    <key t=2 v=100/>
    <key t=5 v=50/>
</animate>

Simple animation:

<sequence id="my_sequence">
   <at t="0">
      <animate property="img1.width" from="20" to="50" in="2"/>
   </at>
</sequence>

Keyed animation:

<sequence id="my_sequence">
   <at t="0">
      <animate property="img1.width">
          <key t="0" v="20"/>
          <key t="2" v="50"/>
      </animate>
   </at>
</sequence>