Skip to content

Most visited

Recently visited

navigation

Comencemos

Para crear aplicaciones con Material Design:

  1. Revisar la especificación de Material Design.
  2. Aplicar el tema material a tu aplicación.
  3. Crear tus diseños siguiendo las pautas de Material Design.
  4. Especificar la elevación de tus vistas para convertir sombras.
  5. Usar widgets del sistema para listas y tarjetas.
  6. Personalizar las animaciones en tu aplicación.

Mantener la compatibilidad con versiones anteriores

Puedes agregar muchas características de Material Design a tu aplicación mientras mantienes la compatibilidad con las versiones anteriores a Android 5.0. Para más información, consulta Mantener la compatibilidad.

Actualización de tu aplicación con Material Design

Para actualizar una aplicación existente para incorporar Material Design, actualiza tus diseños siguiendo las pautas de Material Design. Además, asegúrate de incorporar profundidad, respuesta táctil y animaciones.

Crear nuevas aplicaciones con Material Design

Si creas una nueva aplicación con las características de Material Design, las pautas de Material Design te proporcionan un framework de diseño cohesivo. Sigue estas pautas y usa la nueva funcionalidad del framework de Android para diseñar y desarrollar tu aplicación.

Aplicar el tema Material

Para aplicar el tema material en tu aplicación, especifica el estilo que hereda de android:Theme.Material:

<!-- res/values/styles.xml -->
<resources>
  <!-- your theme inherits from the material theme -->
  <style name="AppTheme" parent="android:Theme.Material">
    <!-- theme customizations -->
  </style>
</resources>

El tema material proporciona widgets de sistema actualizados y te permite establecer la paleta de colores y las animaciones predeterminadas para la respuesta táctil y las transiciones de actividades. Para obtener más detalles, consulta Usar el tema Material.

Realizar tus diseños

Además de aplicar y personalizar el tema material, tus diseños deben cumplir con las pautas de Material Design. Cuando realices tus diseños, presta especial atención a lo siguiente:

Especificar la elevación en tus vistas

Las vistas pueden proyectar sombras y el valor de elevación de una vista determina el tamaño de su sombra y el orden en que será dibujada. Para establecer la elevación de una vista, usa el atributo android:elevation en tus diseños:

<TextView
    android:id="@+id/my_textview"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/next"
    android:background="@color/white"
    android:elevation="5dp" />

La nueva propiedad translationZ te permite crear animaciones que reflejen cambios temporales en la elevación de una vista. Los cambios de elevación pueden ser útiles cuando responden a gestos táctiles.

Para obtener más detalles, consulta Definir vistas de recorte y sombras.

Crear listas y tarjetas

RecyclerView es una versión más acoplable de ListView que admite diferentes tipos de diseños y proporciona mejoras en el rendimiento. CardView te permite mostrar partes de información dentro de las tarjetas con una apariencia uniforme entre distintas aplicaciones. El siguiente ejemplo de códigos muestra cómo incluir un CardView en tu diseño:

<android.support.v7.widget.CardView
    android:id="@+id/card_view"
    android:layout_width="200dp"
    android:layout_height="200dp"
    card_view:cardCornerRadius="3dp">
    ...
</android.support.v7.widget.CardView>

Para obtener más información, consulta Crear listas y tarjetas.

Personalizar tus animaciones

Android 5.0 (API nivel 21) incluye nuevas API para crear animaciones personalizadas en tu aplicación. Por ejemplo, puedes habilitar las transiciones de actividades y definir una transición de salida dentro de una actividad:

public class MyActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // enable transitions
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
        setContentView(R.layout.activity_my);
    }

    public void onSomeButtonClicked(View view) {
        getWindow().setExitTransition(new Explode());
        Intent intent = new Intent(this, MyOtherActivity.class);
        startActivity(intent,
                      ActivityOptions
                          .makeSceneTransitionAnimation(this).toBundle());
    }
}

Cuando comienzas otra actividad desde esta actividad, se activa la transición de salida.

Para más información sobre las nuevas API de animación, consulta Definir animaciones personalizadas.

This site uses cookies to store your preferences for site-specific language and display options.

Get the latest Android developer news and tips that will help you find success on Google Play.

* Required Fields

Hooray!

Follow Google Developers on WeChat

Browse this site in ?

You requested a page in , but your language preference for this site is .

Would you like to change your language preference and browse this site in ? If you want to change your language preference later, use the language menu at the bottom of each page.

This class requires API level or higher

This doc is hidden because your selected API level for the documentation is . You can change the documentation API level with the selector above the left navigation.

For more information about specifying the API level your app requires, read Supporting Different Platform Versions.

Take a short survey?
Help us improve the Android developer experience.
(Sep 2017 survey)