blob: 53faa01aad8b12e398355cf30ccb4dc3812b1123 [file] [log] [blame]
page.title=Animating Views Using Scenes and Transitions
@jd:body
<!-- Sidebox -->
<div id="tb-wrapper">
<div id="tb">
<h2>Dependencies and Prerequisites</h2>
<ul>
<li>Android 4.4.2 (API level 19) or higher</li>
</ul>
<h2>You should also read</h2>
<ul>
<li><a href="{@docRoot}guide/topics/ui/how-android-draws.html">
How Android Draws Views</a></li>
</ul>
<h2>Try it out</h2>
<ul>
<li><a href="{@docRoot}samples/BasicTransition/index.html">BasicTransition</a> sample</li>
<li><a href="{@docRoot}samples/CustomTransition/index.html">CustomTransition</a> sample</li>
</ul>
</div>
</div>
<!-- Video box -->
<a class="notice-developers-video wide" href="http://www.youtube.com/watch?v=S3H7nJ4QaD8">
<div>
<h3>Video</h3>
<p>DevBytes: Android 4.4 Transitions</p>
</div>
</a>
<p>The user interface of an activity often changes in response to user input and other events.
For example, an activity that contains a form where users can type search queries can hide
the form when the user submits it and show a list of search results in its place.</p>
<p>To provide visual continuity in these situations, you can animate changes between
different view hierarchies in your user interface. These animations give users feedback on
their actions and help them learn how your app works.</p>
<p>Android includes the <em>transitions framework</em>, which enables you to easily
animate changes between two view hierarchies. The framework animates the views at runtime by
changing some of their property values over time. The framework includes built-in animations
for common effects and lets you create custom animations and transition lifecycle callbacks.</p>
<p>This class teaches you to use the built-in animations in the transitions framework to
animate changes between view hierarchies. This class also covers how to create custom
animations.</p>
<p class="note"><strong>Note:</strong> For Android versions earlier than 4.4.2 (API level 19)
but greater than or equal to Android 4.0 (API level 14), use the <code>animateLayoutChanges</code>
attribute to animate layouts. To learn more, see
<a href="{@docRoot}guide/topics/graphics/prop-animation.html">Property Animation</a> and
<a href="{@docRoot}training/animation/layout.html">Animating Layout Changes</a>.</p>
<h2>Lessons</h2>
<dl>
<dt><a href="{@docRoot}training/transitions/overview.html">
The Transitions Framework</a></dt>
<dd>
Learn the main features and components of the transitions framework.
</dd>
<dt><a href="{@docRoot}training/transitions/scenes.html">
Creating a Scene</a></dt>
<dd>
Learn how to create a scene to store the state of a view hierarchy.
</dd>
<dt><a href="{@docRoot}training/transitions/transitions.html">
Applying a Transition</a></dt>
<dd>
Learn how to apply a transition between two scenes of a view hierarchy.
</dd>
<dt><a href="{@docRoot}training/transitions/custom-transitions.html">
Creating Custom Transitions</a></dt>
<dd>
Learn how to create other animation effects not included in the transitions framework.
</dd>
</dl>