Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit cde59f2f authored by Robert Ly's avatar Robert Ly Committed by Android (Google) Code Review
Browse files

Merge "docs: restructure animation and add container doc"

parents c37bfc3f 4b3e9121
Loading
Loading
Loading
Loading
+45 −931

File changed.

Preview size limit exceeded, changes collapsed.

+66 −0
Original line number Diff line number Diff line
page.title=Drawable Animation
parent.title=Animation
parent.link=animation.html
@jd:body

  <p>Drawable animation lets you load a series of Drawable resources one after
  another to create an animation. This is a traditional animation in the sense that it is created with a sequence of different
  images, played in order, like a roll of film. The {@link
  android.graphics.drawable.AnimationDrawable} class is the basis for Drawable animations.</p>

  <p>While you can define the frames of an animation in your code, using the {@link
  android.graphics.drawable.AnimationDrawable} class API, it's more simply accomplished with a
  single XML file that lists the frames that compose the animation. The XML file for this kind
  of animation belongs in the <code>res/drawable/</code> directory of
  your Android project. In this case, the instructions are the order and duration for each frame of
  the animation.</p>

  <p>The XML file consists of an <code>&lt;animation-list&gt;</code> element as the root node and a
  series of child <code>&lt;item&gt;</code> nodes that each define a frame: a drawable resource for
  the frame and the frame duration. Here's an example XML file for a Drawable animation:</p>
  <pre>
&lt;animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true"&gt;
    &lt;item android:drawable="@drawable/rocket_thrust1" android:duration="200" /&gt;
    &lt;item android:drawable="@drawable/rocket_thrust2" android:duration="200" /&gt;
    &lt;item android:drawable="@drawable/rocket_thrust3" android:duration="200" /&gt;
&lt;/animation-list&gt;
</pre>

  <p>This animation runs for just three frames. By setting the <code>android:oneshot</code>
  attribute of the list to <var>true</var>, it will cycle just once then stop and hold on the last
  frame. If it is set <var>false</var> then the animation will loop. With this XML saved as
  <code>rocket_thrust.xml</code> in the <code>res/drawable/</code> directory of the project, it can
  be added as the background image to a View and then called to play. Here's an example Activity,
  in which the animation is added to an {@link android.widget.ImageView} and then animated when the
  screen is touched:</p>
  <pre>
AnimationDrawable rocketAnimation;

public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
}

public boolean onTouchEvent(MotionEvent event) {
  if (event.getAction() == MotionEvent.ACTION_DOWN) {
    rocketAnimation.start();
    return true;
  }
  return super.onTouchEvent(event);
}
</pre>

  <p>It's important to note that the <code>start()</code> method called on the AnimationDrawable
  cannot be called during the <code>onCreate()</code> method of your Activity, because the
  AnimationDrawable is not yet fully attached to the window. If you want to play the animation
  immediately, without requiring interaction, then you might want to call it from the <code>{@link
  android.app.Activity#onWindowFocusChanged(boolean) onWindowFocusChanged()}</code> method in your
  Activity, which will get called when Android brings your window into focus.</p>

  <p>For more information on the XML syntax, available tags and attributes, see <a href=
  "{@docRoot}guide/topics/resources/animation-resource.html">Animation Resources</a>.</p>
+953 −0

File added.

Preview size limit exceeded, changes collapsed.

+6 −83
Original line number Diff line number Diff line
page.title=View Animation
parent.title=Graphics
parent.link=index.html
parent.title=Animation
parent.link=animation.html
@jd:body

  <div id="qv-wrapper">
    <div id="qv">
      <h2>In this document</h2>

      <ol>       
       <li><a href="#tween-animation">Tween animation</a></li>
       <li><a href="#frame-animation">Frame animation</a></li>
     </ol>

    </div>
  </div>

  You can use View Animation in any View object to
  perform tweened animation and frame by frame animation. Tween animation calculates the animation
  given information such as the start point, end point, size, rotation, and other common aspects of
  an animation. Frame by frame animation lets you load a series of Drawable resources one after
  another to create an animation.

  <h2 id="tween-animation">Tween Animation</h2>
  <p>You can use the view animation system to perform tweened animation on Views. Tween animation
  calculates the animation with information such as the start point, end point, size, rotation, and
  other common aspects of an animation.
  </p>

  <p>A tween animation can perform a series of simple transformations (position, size, rotation,
  and transparency) on the contents of a View object. So, if you have a {@link
@@ -126,67 +113,3 @@ spaceshipImage.startAnimation(hyperspaceJumpAnimation);
  Even so, the animation will still be drawn beyond the bounds of its View and will not be clipped.
  However, clipping <em>will occur</em> if the animation exceeds the bounds of the parent View.</p>
  <h2 id="frame-animation">Frame Animation</h2>

  <p>This is a traditional animation in the sense that it is created with a sequence of different
  images, played in order, like a roll of film. The {@link
  android.graphics.drawable.AnimationDrawable} class is the basis for frame animations.</p>

  <p>While you can define the frames of an animation in your code, using the {@link
  android.graphics.drawable.AnimationDrawable} class API, it's more simply accomplished with a
  single XML file that lists the frames that compose the animation. Like the tween animation above,
  the XML file for this kind of animation belongs in the <code>res/drawable/</code> directory of
  your Android project. In this case, the instructions are the order and duration for each frame of
  the animation.</p>

  <p>The XML file consists of an <code>&lt;animation-list&gt;</code> element as the root node and a
  series of child <code>&lt;item&gt;</code> nodes that each define a frame: a drawable resource for
  the frame and the frame duration. Here's an example XML file for a frame-by-frame animation:</p>
  <pre>
&lt;animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true"&gt;
    &lt;item android:drawable="@drawable/rocket_thrust1" android:duration="200" /&gt;
    &lt;item android:drawable="@drawable/rocket_thrust2" android:duration="200" /&gt;
    &lt;item android:drawable="@drawable/rocket_thrust3" android:duration="200" /&gt;
&lt;/animation-list&gt;
</pre>

  <p>This animation runs for just three frames. By setting the <code>android:oneshot</code>
  attribute of the list to <var>true</var>, it will cycle just once then stop and hold on the last
  frame. If it is set <var>false</var> then the animation will loop. With this XML saved as
  <code>rocket_thrust.xml</code> in the <code>res/drawable/</code> directory of the project, it can
  be added as the background image to a View and then called to play. Here's an example Activity,
  in which the animation is added to an {@link android.widget.ImageView} and then animated when the
  screen is touched:</p>
  <pre>
AnimationDrawable rocketAnimation;

public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
}

public boolean onTouchEvent(MotionEvent event) {
  if (event.getAction() == MotionEvent.ACTION_DOWN) {
    rocketAnimation.start();
    return true;
  }
  return super.onTouchEvent(event);
}
</pre>

  <p>It's important to note that the <code>start()</code> method called on the AnimationDrawable
  cannot be called during the <code>onCreate()</code> method of your Activity, because the
  AnimationDrawable is not yet fully attached to the window. If you want to play the animation
  immediately, without requiring interaction, then you might want to call it from the <code>{@link
  android.app.Activity#onWindowFocusChanged(boolean) onWindowFocusChanged()}</code> method in your
  Activity, which will get called when Android brings your window into focus.</p>

  <p>For more information on the XML syntax, available tags and attributes, see <a href=
  "{@docRoot}guide/topics/resources/animation-resource.html">Animation Resources</a>.</p>
</body>
</html>