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

Commit cb62e530 authored by David Friedman's avatar David Friedman
Browse files

Docs: Localization of Android design pages 

Bug: 23090876
Change-Id: I2a19a5ba77b3a3b26ec4846a4f431ffe09a46066
parent dee655c4

docs/html-intl/intl/es/design/get-started/principles.jd

+73 −73
Original line number Diff line number Diff line
@@ -14,8 +14,8 @@ creatividad e ideas de diseño. Desvíese de lo tradicional con un propósito. 


<h2 id="enchant-me">Cautívame</h2>



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="delight-me">Deléitame de formas sorprendentes</h4>

<p>Una superficie atractiva, una animación colocada en el lugar correcto o un efecto de sonido bien sincronizado suelen ser experiencias
@@ -23,7 +23,7 @@ placenteras. Los efectos sutiles contribuyen a crear un sentimiento de facilidad 
poderosa.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_delight.png">
@@ -32,15 +32,15 @@ poderosa.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="real-objects-more-fun">Los objetos reales son más divertidos que los botones y los menús</h4>

<p>Permita que los usuarios toquen y manipulen directamente los objetos de su aplicación. Esto reduce el esfuerzo cognitivo

<p>Permite que los usuarios toquen y manipulen directamente los objetos de tu aplicación. Esto reduce el esfuerzo cognitivo

que se necesita para llevar a cabo una tarea que resulte satisfactoria a nivel emocional.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_real_objects.png">
@@ -49,16 +49,16 @@ que se necesita para llevar a cabo una tarea que resulte satisfactoria a nivel e 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="make-it-mine">Permíteme darle un toque personal</h4>

<p>A los usuarios les gusta agregar toques personales, ya que esto los ayuda a sentirse cómodos y a sentir que tienen el control. Ofrezca

opciones predeterminadas prácticas y atractivas, pero también tenga en cuenta personalizaciones opcionales y divertidas que no entorpezcan las

<p>A los usuarios les gusta agregar toques personales, ya que esto los ayuda a sentirse cómodos y a sentir que tienen el control. Ofrece

opciones predeterminadas prácticas y atractivas, pero también ten en cuenta personalizaciones opcionales y divertidas que no entorpezcan las

tareas principales.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_make_it_mine.png">
@@ -67,15 +67,15 @@ tareas principales.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="get-to-know-me">Conóceme</h4>

<p>Con el paso del tiempo, conozca las preferencias de los usuarios. En lugar de pedirles a los usuarios que elijan las mismas cosas una y otra

<p>Con el paso del tiempo, conoce las preferencias de los usuarios. En lugar de pedirles a los usuarios que elijan las mismas cosas una y otra

vez, permita que puedan acceder fácilmente a las opciones que ya eligieron antes.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_get_to_know_me.png">
@@ -84,14 +84,14 @@ vez, permita que puedan acceder fácilmente a las opciones que ya eligieron ante 


<h2 id="simplify-my-life">Simplifica mi vida</h2>



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="keep-it-brief">Sé breve</h4>

<p>Utilice frases cortas con palabras simples. Las personas tienden a omitir las oraciones largas.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_keep_it_brief.png">
@@ -100,15 +100,15 @@ vez, permita que puedan acceder fácilmente a las opciones que ya eligieron ante 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="pictures-faster-than-words">Las imágenes son más prácticas que las palabras</h4>

<p>Considere la idea de utilizar imágenes para explicar las ideas. Las imágenes atraen la atención de las personas y pueden ser mucho más eficientes

<p>Considera la idea de utilizar imágenes para explicar las ideas. Las imágenes atraen la atención de las personas y pueden ser mucho más eficientes

que las palabras.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_pictures.png">
@@ -117,15 +117,15 @@ que las palabras.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="decide-for-me">Decide por mí, pero permíteme tener la última palabra</h4>

<p>Siga su instinto y actúe sin preguntar primero. Tener que elegir demasiadas veces y tomar muchas decisiones hace que las personas

se sientan molestas. Permita que los usuarios puedan deshacer sus elecciones en caso de que no sean lo que ellos desean.</p>

<p>Sigue su instinto y actúa sin preguntar primero. Tener que elegir demasiadas veces y tomar muchas decisiones hace que las personas

se sientan molestas. Permite que los usuarios puedan deshacer sus elecciones en caso de que no sean lo que ellos desean.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_decide_for_me.png">
@@ -134,15 +134,15 @@ se sientan molestas. Permita que los usuarios puedan deshacer sus elecciones en 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="only-show-when-i-need-it">Solo muéstrame lo que necesito, cuando lo necesito</h4>

<p>Los usuarios se sienten abrumados cuando se les presenta demasiada información al mismo tiempo. Divida las tareas y la información en fragmentos pequeños

y fáciles de digerir. Oculte las opciones que no son fundamentales en el momento y capacite a los usuarios sobre la marcha.</p>

<p>Los usuarios se sienten abrumados cuando se les presenta demasiada información al mismo tiempo. Divide las tareas y la información en fragmentos pequeños

y fáciles de digerir. Oculta las opciones que no son fundamentales en el momento y capacita a los usuarios sobre la marcha.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_information_when_need_it.png">
@@ -151,15 +151,15 @@ y fáciles de digerir. Oculte las opciones que no son fundamentales en el moment 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="always-know-where-i-am">Siempre debo saber dónde me encuentro</h4>

<p>Haga que los usuarios sientan que conocen el camino de regreso. Para ello, diseñe las distintas partes de su aplicación de modo tal que se vean diferentes y

utilice transiciones para mostrar la relación entre las pantallas. Proporcione comentarios sobre las tareas que están en curso.</p>

<p>Haz que los usuarios sientan que conocen el camino de regreso. Para ello, diseña las distintas partes de su aplicación de modo tal que se vean diferentes y

utiliza transiciones para mostrar la relación entre las pantallas. Proporciona comentarios sobre las tareas que están en curso.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_navigation.png">
@@ -168,16 +168,16 @@ utilice transiciones para mostrar la relación entre las pantallas. Proporcione 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="never-lose-my-stuff">Nunca pierdas lo que es mío</h4>

<p>Guarde aquellas cosas que los usuarios crearon y permítales acceder a ellas desde cualquier lugar. Recuerde las configuraciones,

<p>Guarda aquellas cosas que los usuarios crearon y permíteles acceder a ellas desde cualquier lugar. Recuerda las configuraciones,

los toques personales y las creaciones en todos los teléfonos, las tablets y las computadoras. Esta es la forma de hacer que las actualizaciones

sean lo más simple del mundo.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_never_lose_stuff.png">
@@ -186,15 +186,15 @@ sean lo más simple del mundo.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="looks-same-should-act-same">Si se ve igual, debe funcionar de la misma manera</h4>

<p>Ayude a los usuarios a distinguir las diferencias funcionales al lograr que se vean diferentes en lugar de sutiles.

<p>Ayuda a los usuarios a distinguir las diferencias funcionales al lograr que se vean diferentes en lugar de sutiles.

Evite los modos, que son sitios que lucen similar pero actúan diferente ante la misma entrada.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_looks_same.png">
@@ -203,15 +203,15 @@ Evite los modos, que son sitios que lucen similar pero actúan diferente ante la 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="interrupt-only-if-important">Solo interrúmpeme si es importante</h4>

<p>Al igual que un buen asistente personal, evite a los usuarios los pormenores poco importantes. Las personas desean estar

concentradas y, a menos que sea fundamental y esté sujeta a un plazo de tiempo, una interrupción puede resultar agobiante y frustrante.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_important_interruption.png">
@@ -220,16 +220,16 @@ concentradas y, a menos que sea fundamental y esté sujeta a un plazo de tiempo, 


<h2 id="make-me-amazing">Permíteme ser asombroso</h2>



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="give-me-tricks">Ofréceme trucos que funcionen en todos lados</h4>

<p>Las personas se sienten muy bien cuando descubren cosas por sí mismos. Logre que su aplicación sea más simple de utilizar al

<h4 id="give-me-tricks">Ofrézame trucos que funcionen en todos lados</h4>

<p>Las personas se sienten muy bien cuando descubren cosas por sí mismos. Logra que su aplicación sea más simple de utilizar al

aprovechar los patrones visuales y la memoria muscular de otras aplicaciones de Android. Por ejemplo, el gesto de deslizar rápidamente

puede ser un buen acceso directo de navegación.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_tricks.png">
@@ -238,16 +238,16 @@ puede ser un buen acceso directo de navegación.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="its-not-my-fault">No es mi culpa</h4>

<p>Sea sutil cuando les solicite a los usuarios que realicen correcciones. Ellos desean sentirse inteligentes cuando usan la

aplicación que usted creó. Si hacen algo mal, bríndeles instrucciones claras de recuperación, pero evite darles detalles técnicos.

Sería incluso mejor que usted lo solucione en segundo plano.</p>

<p>Sé sutil cuando solicites a los usuarios que realicen correcciones. Ellos desean sentirse inteligentes cuando usan la

aplicación que creaste. Si hacen algo mal, bríndales instrucciones claras de recuperación, pero evita darles detalles técnicos.

Sería incluso mejor que tú lo soluciones en segundo plano.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_error.png">
@@ -256,15 +256,15 @@ Sería incluso mejor que usted lo solucione en segundo plano.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="sprinkle-encouragement">Fomenta lo simple</h4>

<p>Desglose las tareas complejas en pasos más pequeños que se puedan cumplir fácilmente. Ofrezca comentarios sobre las acciones,

<p>Desglosa las tareas complejas en pasos más pequeños que se puedan cumplir fácilmente. Ofrece comentarios sobre las acciones,

incluso si es simplemente un halago sutil.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_sprinkle_encouragement.png">
@@ -273,16 +273,16 @@ incluso si es simplemente un halago sutil.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="do-heavy-lifting-for-me">Haz el trabajo pesado por mí</h4>

<p>Haga que los principiantes se sientan como expertos al permitirles hacer cosas que pensaron que nunca podrían hacer. Por

ejemplo, a través de los accesos directos en los que se combinan múltiples efectos de fotografías, puede lograr que las fotografías de principiantes se vean maravillosas

<p>Haz que los principiantes se sientan como expertos al permitirles hacer cosas que pensaron que nunca podrían hacer. Por

ejemplo, a través de los accesos directos en los que se combinan múltiples efectos de fotografías, puedes lograr que las fotografías de principiantes se vean maravillosas

en solo algunos pasos.</p>



  </div>

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

  <div class="col-6">



    <img src="{@docRoot}design/media/principles_heavy_lifting.png">
@@ -291,15 +291,15 @@ en solo algunos pasos.</p> 


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



<div class="layout-content-row">

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

<div class="cols">

  <div class="col-7">



<h4 id="make-important-things-fast">Haz que lo importante sea rápido</h4>

<p>No todas las acciones son iguales. Decida qué es lo más importante en su aplicación y haga

<p>No todas las acciones son iguales. Decide qué es lo más importante en tu aplicación y haz

que los usuarios lo puedan encontrar fácilmente y utilizar de forma rápida, como el obturador de una cámara o el botón de pausa de un reproductor de música.</p>



  </div>

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

  <div class="col-6">



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

docs/html-intl/intl/es/design/index.jd

0 → 100644
+186 −0
Original line number Diff line number Diff line 
page.title=Material Design para Android

page.tags=Material,design

page.type=diseño

page.image=images/cards/design-material-for-android_2x.jpg



@jd:body



<!-- developer docs box -->

<a class="notice-developers right" href="{@docRoot}training/material/index.html">

  <div>

    <h3>Documentos para desarrolladores</h3>

    <p>Creación de aplicaciones con Material Design</p>

  </div>

</a>



<!-- video box -->

<a class="notice-developers-video" href="https://www.youtube.com/watch?v=p4gmvHyuZzw">

<div>

    <h3>Video</h3>

    <p>Introducción a Material Design</p>

</div>

</a>



<!-- video box -->

<a class="notice-developers-video" href="https://www.youtube.com/watch?v=YaG_ljfzeUw">

<div>

    <h3>Video</h3>

    <p>Papel y tinta: los materiales más importantes</p>

</div>

</a>



<!-- video box -->

<a class="notice-developers-video" href="https://www.youtube.com/watch?v=XOcCOBe8PTc">

<div>

    <h3>Video</h3>

    <p>Material Design en la aplicación Google I/O</p>

</div>

</a>







<p itemprop="description">Material Design es una guía integral para el diseño visual, de movimientos y

de interacción en distintas plataformas y dispositivos. Android ahora es compatible con las aplicaciones de

Material Design. Para usar Material Design en tus aplicaciones de Android, sigue las pautas descritas

en la <a href="http://www.google.com/design/spec">especificación de Material Design</a> y usa los

nuevos componentes y funcionalidades disponibles en Android 5.0 (nivel de API 21) y versiones posteriores.</p>



<p>En Android, se proporcionan los siguientes elementos que te permitirán crear aplicaciones en Material Design:</p>



<ul>

  <li>un tema nuevo;</li>

  <li>nuevos widgets para vistas complejas;</li>

  <li>nuevas API (interfaces de programación de aplicaciones) para sombras y animaciones personalizadas.</li>

</ul>



<p>Para obtener más información sobre la implementación de Material Design en Android, consulta

<a href="{@docRoot}training/material/index.html">Creación de aplicaciones con Material Design</a>.</p>





<h3>Tema Material</h3>



<p>El tema Material te ofrece un nuevo estilo para tu aplicación, widgets del sistema que te permiten configurar

la paleta de colores y animaciones predeterminadas para información táctil y transiciones de actividades.</p>



<!-- two columns -->

<div style="width:700px;margin-top:25px;margin-bottom:20px">

<div style="float:left;width:250px;margin-left:40px;margin-right:60px;">

  <img src="{@docRoot}design/material/images/MaterialDark.png" width="500" height="238" />

  <div style="width:140px;margin:0 auto">

  <p style="margin-top:8px">Tema Dark Material</p>

  </div>

</div>

<div style="float:left;width:250px;margin-right:0px;">

  <img src="{@docRoot}design/material/images/MaterialLight.png" width="500" height="238" />

  <div style="width:140px;margin:0 auto">

  <p style="margin-top:8px">Tema Light Material</p>

  </div>

</div>

<br style="clear:left"/>

</div>



<p>Para obtener más información, consulta <a href="{@docRoot}training/material/theme.html">Uso del tema

Material</a>.</p>





<h3>Listas y tarjetas</h3>



<p>Android proporciona dos widgets nuevos para mostrar listas y tarjetas con estilos y

animaciones de Material Design:</p>



<!-- two columns -->

<div style="width:700px;margin-top:25px;margin-bottom:20px">

<div style="float:left;width:250px;margin-left:40px;margin-right:60px;">

  <img src="{@docRoot}design/material/images/list_mail.png" width="500" height="426" />

  <p>El nuevo widget <code>RecyclerView</code> es una versión más acoplable de <code>ListView</code>

 que admite diferentes tipos de diseños y proporciona mejoras en el rendimiento.</p>

</div>

<div style="float:left;width:250px;margin-right:0px;">

  <img src="{@docRoot}design/material/images/card_travel.png" width="500" height="426" />

  <p>El nuevo widget <code>CardView</code> te permite mostrar extractos de información importante dentro de

 tarjetas que tienen apariencia y estilo coherentes.</p>

</div>

<br style="clear:left"/>

</div>



<p>Para obtener más información, consulta <a href="{@docRoot}training/material/lists-cards.html">Creación de listas

y tarjetas</a>.</p>





<h3>Visualización de sombras</h3>



<p>Además de las propiedades X e Y, las vistas de Android ahora poseen una

propiedad Z. Esta propiedad nueva representa la elevación de una vista, que determina lo siguiente:</p>



<ul>

<li>El tamaño de la sombra: las vistas con valores Z más elevados proyectan sombras más grandes.</li>

<li>El orden del dibujo: las vistas con valores Z más elevados aparecen sobre las otras vistas.</li>

</ul>



<div style="width:290px;margin-left:35px;float:right">

  <div class="framed-nexus5-port-span-5">

  <video class="play-on-hover" autoplay>

    <source src="{@docRoot}design/material/videos/ContactsAnim.mp4"/>

    <source src="{@docRoot}design/videos/ContactsAnim.webm"/>

    <source src="{@docRoot}design/videos/ContactsAnim.ogv"/>

  </video>

  </div>

  <div style="font-size:10pt;margin-left:20px;margin-bottom:30px">

    <em>Para volver a reproducir la película, haz clic en la pantalla del dispositivo.</em>

  </div>

</div>



<p>Para obtener más información, consulta <a href="{@docRoot}training/material/shadows-clipping.html">Definición

de vistas de recorte y sombras</a>.</p>





<h3>Animaciones</h3>



<p>Las nuevas API de animaciones te permiten crear animaciones personalizadas para la información táctil en los controles de IU,

además de realizar cambios en el estado de las vistas y transiciones entre actividades.</p>



<p>Estas API te permiten hacer lo siguiente:</p>



<ul>

<li style="margin-bottom:15px">

responder a los eventos táctiles de tus vistas mediante animaciones de <strong>información táctil</strong>;

</li>

<li style="margin-bottom:15px">

ocultar y mostrar vistas con animaciones con <strong>efecto circular</strong>;

</li>

<li style="margin-bottom:15px">

alternar entre actividades con animaciones personalizadas de <strong>transición de actividades</strong>;

</li>

<li style="margin-bottom:15px">

crear animaciones más naturales con <strong>movimiento curvo</strong>;

</li>

<li style="margin-bottom:15px">

animar los cambios en una o más propiedades de las vistas con las animaciones de <strong>cambio de estado de la vista</strong>;

</li>

<li style="margin-bottom:15px">

mostrar animaciones en los <strong>elementos de diseño de la lista de estados</strong> entre los cambios de estado de las vistas.

</li>

</ul>



<p>Las animaciones de la información táctil se concentran en diferentes vistas estándar, como los botones. Las nuevas API

te permiten personalizar estas animaciones y agregarlas a tus vistas personalizadas.</p>



<p>Para obtener más información, consulta <a href="{@docRoot}training/material/animations.html">Definición de animaciones

personalizadas</a>.</p>





<h3>Elementos de diseño</h3>



<p>Estas nuevas capacidades para los elementos de diseño te permiten implementar aplicaciones de Material Design:</p>



<ul>

<li>Los <strong>dibujables en vector</strong> se pueden escalar sin perder definición y son perfectos

para los iconos de las aplicaciones de un solo color.</li>

<li>El <strong>teñido de los dibujables</strong> te permite definir mapas de bits como máscaras alfa y pintarlos con

un color durante el tiempo de ejecución.</li>

<li>La <strong>extracción de color</strong> te permite extraer automáticamente colores prominentes de una

imagen del mapa de bits.</li>

</ul>



<p>Para obtener más información, consulta <a href="{@docRoot}training/material/drawables.html">Trabajo con

elementos de diseño</a>.</p>

docs/html-intl/intl/es/design/material/index.jd

+1 −0
Original line number Diff line number Diff line 
page.title=Material Design para Android

page.tags=Material,design

page.type=design

page.image=images/cards/design-material-for-android_2x.jpg



@jd:body

docs/html-intl/intl/es/design/patterns/compatibility.jd

0 → 100644
+70 −0
Original line number Diff line number Diff line 
page.title=Compatibilidad con versiones anteriores

page.tags="support"

page.metaDescription=Notas sobre cómo Android 4.x adapta la IU diseñada para versiones de hardware y de SO anteriores.

@jd:body



<a class="notice-developers" href="{@docRoot}training/basics/supporting-devices/index.html">

  <div>

    <h3>Documentos para desarrolladores</h3>

    <p>Compatible con diferentes dispositivos</p>

  </div>

</a>



<p>Estos son algunos de los cambios importantes en Android 3.0:</p>

<ul>

<li>Se dejan de usar las teclas físicas de menú (Atrás, Menú, Búsqueda, Inicio) en favor de la navegación

mediante controles virtuales (Back, Home, Recents).</li>

<li>Patrón sólido para el uso de menús en las barras de acción.</li>

</ul>

<p>Android 4.0 incorpora estos cambios para tablets en la plataforma del teléfono.</p>



<h2 id="older-hardware">Adaptar Android 4.0 a hardware y aplicaciones anteriores</h2>



<div class="cols">

  <div class="col-6">



<h4>Teléfonos con controles de navegación virtuales</h4>

<p>Las aplicaciones de Android escritas para Android 3.0 y versiones posteriores muestran acciones en la barra de acciones. Las acciones que no

caben en la barra de acciones o que no son lo suficientemente importantes para que se las muestre en el nivel superior aparecen en la

ampliación de acciones (action overflow).</p>

<p>Los usuarios acceden a la ampliación de acciones (action overflow) tocando la barra de acciones.</p>



  </div>

  <div class="col-7">



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



  </div>

</div>



<div class="cols">

  <div class="col-6">



<h4>Teléfonos con teclas de navegación físicas</h4>

<p>Los teléfonos con Android que tienen teclas físicas de navegación no muestran la barra de navegación virtual en

la parte inferior de la pantalla. En cambio, la ampliación de acciones (action overflow) está disponible desde la tecla física de menú. La

ventana emergente con acciones que se muestra tiene el mismo estilo que la del ejemplo anterior, pero aparece en la parte inferior de la pantalla.</p>



  </div>

  <div class="col-7">



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



  </div>

</div>



<div class="cols">

  <div class="col-6">



<h4>Aplicaciones heredadas en teléfonos con controles de navegación virtuales</h4>

<p>Cuando se ejecuta una aplicación que fue generada para Android 2.3 o versiones anteriores en un teléfono con controles de

navegación virtuales, aparece un control de ampliación de acciones (action overflow) a la derecha de la barra de navegación virtual. Se

puede tocar el control para ver las acciones de la aplicación con el estilo del menú tradicional de Android.</p>



  </div>

  <div class="col-7">



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



  </div>

</div>