docs/html/design/patterns/new-4-0.jd

page.title=New in Android 4.0
@jd:body

<div class="layout-content-row">
  <div class="layout-content-col span-7">

<h4>Navigation bar</h4>
<p>Android 4.0 removes the need for traditional hardware keys on phones by replacing them with a
virtual navigation bar that houses the Back, Home and Recents buttons. Read the
<a href="{@docRoot}design/patterns/compatibility.html">Compatibility</a> pattern to learn how the OS adapts to
phones with hardware buttons and how pre-Android 3.0 apps that rely on menu keys are supported.</p>

  </div>
  <div class="layout-content-col span-6">

    <img src="{@docRoot}design/media/whats_new_nav_bar.png">

  </div>
</div>

<div class="vspace size-2">&nbsp;</div>

<div class="layout-content-row">
  <div class="layout-content-col span-7">

<h4>Action bar</h4>
<p>The action bar is the most important structural element of an Android app. It provides consistent
navigation across the platform and allows your app to surface actions.</p>

  </div>
  <div class="layout-content-col span-6">

    <img src="{@docRoot}design/media/whats_new_action_bar.png">

  </div>
</div>

<div class="vspace size-2">&nbsp;</div>

<div class="layout-content-row">
  <div class="layout-content-col span-7">

<h4>Multi-pane layouts</h4>
<p>Creating apps that scale well across different form factors and screen sizes is important in the
Android world. Multi-pane layouts allow you to combine different activities that show separately on
smaller devices into richer compound views for tablets.</p>

  </div>
  <div class="layout-content-col span-6">

    <img src="{@docRoot}design/media/whats_new_multipanel.png">

  </div>
</div>

<div class="vspace size-2">&nbsp;</div>

<div class="layout-content-row">
  <div class="layout-content-col span-7">

<h4>Selection</h4>
<p>The long press gesture which was traditionally used to show contextual actions for objects is now
used for data selection. When selecting data, contextual action bars allow you to surface actions.</p>

  </div>
  <div class="layout-content-col span-6">

    <img src="{@docRoot}design/media/whats_new_multiselect.png">

  </div>
</div>