¿Cómo puedo cambiar el tamaño de texto del elemento NavigationView?

Google lanzó recientemente el widget android.support.design.widget.NavigationView como parte de la biblioteca com.android.support:design:22.2.0 , que simplificó en gran medida (y normaliza) el proceso de creación de un NavigationDrawer.

Sin embargo, de acuerdo con las especificaciones de diseño , el elemento de la lista debe ser Roboto Medium, 14sp, 87% # 000000 . El NavigationView no expone textSize o textStyle para personalizar esto.

Especificaciones de diseño del materialInformación del estilo de fuente

¿Cuáles son mis opciones si soy pedante acerca de mantener las especificaciones de diseño correctas utilizando Google NavigationView (o personalizándolo de cualquier otra manera)?

Desde Android Support Library 22.2.1, Google ha cambiado el tamaño predeterminado TextSize de los elementos en NavigationView de 16sp a 14sp, lo que se adapta bien a la guía de diseño de materiales. Sin embargo, en algunos casos (por ejemplo, cuando se desea apoyar el idioma chino), parece que textSize es mejor. La solución es simple:

  1. Agrega la app:theme="@style/yourStyle.Drawer" a tu NavigationView en tu layout.xml
  2. En styles.xml, agrega android:textSize="16sp" en estilo yourStyle.Drawer

Crear estilo

 <style name="NavigationDrawerStyle"> <item name="android:textSize">20sp</item><!-- text size in menu--> <item name="android:listPreferredItemHeightSmall">40dp</item><!-- item size in menu--> </style> 

Agregalo a tu main_layout.xml

  <android.support.design.widget.NavigationView ... app:theme="@style/NavigationDrawerStyle" ....> </android.support.design.widget.NavigationView> 

Todos los parámetros que puede cambiar están aquí cambiar los elementos de navegación. Cree un diseño llamado design_navigation_item.xml.

 <android.support.design.internal.NavigationMenuItemView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="?attr/listPreferredItemHeightSmall" android:paddingLeft="?attr/listPreferredItemPaddingLeft" android:paddingRight="?attr/listPreferredItemPaddingRight" android:drawablePadding="@dimen/navigation_icon_padding" android:gravity="center_vertical|start" android:maxLines="1" android:fontFamily="sans-serif-thin" android:textSize="22sp" android:textAppearance="?attr/textAppearanceListItem" /> 

Todos los diseños que pueden ser Overriden se encuentran aquí ...\sdk\extras\android\support\design\res\layout\

 design_layout_snackbar.xml design_layout_snackbar_include.xml design_layout_tab_icon.xml design_layout_tab_text.xml design_navigation_item.xml design_navigation_item_header.xml design_navigation_item_separator.xml design_navigation_item_subheader.xml design_navigation_menu.xml 

Puede personalizar todo, desde el color de texto hasta el tamaño y la fuente en su estilo.

 <style name="NavDrawerTextStyle" parent="Base.TextAppearance.AppCompat"> <item name="android:textColor">@color/colorPrimaryDark</item> <item name="android:textSize">16sp</item> <item name="android:textStyle">bold</item> </style> 

Y luego en su NavigationView :

 <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:openDrawer="start"> <android.support.design.widget.NavigationView ... app:itemTextAppearance="@style/NavDrawerTextStyle" /> 

Puede utilizar estos atributos dentro del archivo xml

 app:itemTextAppearance="?android:attr/textAppearanceMedium" 

O para texto pequeño

 app:itemTextAppearance="?android:attr/textAppearance" 

O para texto grande

 app:itemTextAppearance="?android:attr/textAppearanceLarge" 

Buscando en el código fuente encontré este archivo de diseño

/platform/frameworks/support/…/design/res/layout/design_drawer_item.xml

Con el siguiente atributo

 <android.support.design.internal.NavigationMenuItemView ... android:textAppearance="?attr/textAppearanceListItem" 

Lo que significaba que todo lo que teníamos que hacer era anular el estilo textAppearanceListItem en nuestro proyecto.


Res / values ​​/ styles.xml

 <style name="AppTheme" ... > ... <item name="textAppearanceListItem">@style/list_item_appearance</item> </style> <style name="list_item_appearance"> <item name="android:textSize">14sp</item> <item name="android:fontFamily">sans-serif-medium</item> </style> 

No estoy totalmente seguro de qué otra cosa esto afectará, pero si alguien tiene una mejor respuesta, estaría encantado de aceptar que en su lugar!

Esto funcionó para mí:

Activity_main.xml

 <android.support.design.widget.NavigationView android:id="@+id/navigation_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" android:theme="@style/NavigationDrawerStyle" app:headerLayout="@layout/navdrawer_header" app:menu="@menu/navdrawer_menu" /> 

Styles.xml

 <style name="NavigationDrawerStyle"> <item name="android:textSize">16sp</item> </style> 

Tal vez podría ayudar. Recientemente tuve que hacer esto mediante programación. Utilicé esta clase:

 public class CustomTypefaceSpan extends TypefaceSpan { private final Typeface newType; private final float newSp; public CustomTypefaceSpan(String family, Typeface type, float sp) { super(family); newType = type; newSp = sp; } @Override public void updateDrawState(TextPaint ds) { applyCustomTypeFace(ds, newType, newSp); } @Override public void updateMeasureState(TextPaint paint) { applyCustomTypeFace(paint, newType, newSp); } private static void applyCustomTypeFace(Paint paint, Typeface tf, float sp) { int oldStyle; Typeface old = paint.getTypeface(); if (old == null) { oldStyle = 0; } else { oldStyle = old.getStyle(); } int fake = oldStyle & ~tf.getStyle(); if ((fake & Typeface.BOLD) != 0) { paint.setFakeBoldText(true); } if ((fake & Typeface.ITALIC) != 0) { paint.setTextSkewX(-0.25f); } paint.setTextSize(sp); paint.setTypeface(tf); } @SuppressWarnings("unused") public static final Parcelable.Creator<CustomTypefaceSpan> CREATOR = new Parcelable.Creator<CustomTypefaceSpan>() { @Override public CustomTypefaceSpan createFromParcel(Parcel in) { return null; } @Override public CustomTypefaceSpan[] newArray(int size) { return new CustomTypefaceSpan[size]; } }; } 

Entonces lo usé así:

 // This is for color SpannableString s = new SpannableString(item.getTitle().toString()); s.setSpan(new ForegroundColorSpan(Color.RED), 0, s.length(), 0); // This is for typeface and size Typeface typeFace = Functions.getTypeface(this, "Avenir"); if (typeFace != null) { int size = 19; float scaledSizeInPixels = size * getResources().getDisplayMetrics().scaledDensity; CustomTypefaceSpan spanTypeFace = new CustomTypefaceSpan(item.getTitle().toString(), typeFace, scaledSizeInPixels); s.setSpan(spanTypeFace, 0, s.length(), 0); } item.setTitle(s); 

Espero que esto ayude.

List Adapter Layout de su barra de navegación:

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="10dp" android:orientation="horizontal" android:background="@drawable/pressed_state"> <TextView android:id="@+id/textView_list_item" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_toRightOf="@+id/imageView_icons" android:textStyle="bold" android:layout_marginLeft="10dp" android:textColor="@color/white" android:textSize="17sp" /> <ImageView android:id="@+id/list_adapter_image" android:layout_width="10dp" android:layout_height="10dp" android:layout_centerVertical="true" android:layout_alignParentRight="true" android:visibility="visible" android:layout_marginRight="50dp" android:background="@drawable/circle_orange"/> </RelativeLayout> <LinearLayout android:layout_height="1dp" android:layout_width="match_parent" android:background="#EC1294"></LinearLayout> </LinearLayout> 

Este parámetro en RelativeLayout establece el color de fondo -> android: background = "@ drawable / pressed_state"

Haga esto "pressed_state.xml" en la carpeta dibujable.

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@color/light_blue" android:state_pressed="true"/> 

Disculpe por mi inglés.

  • Icono del menú izquierdo en la barra de acciones de Android
  • Desactivar oscurecimiento oscuro en el cajón de navegación
  • Norma de arquitectura de Android MVP para cargar interfaz de usuario con clase Model que tiene recurso android
  • Botón de alternancia en el cajón de navegación
  • Empuje la actividad a la derecha cuando el cajón abierto
  • Cajón de navegación Animación android
  • Eliminación del margen izquierdo del ícono de navegación de Android
  • ¿Cómo abrir un nuevo fragmento del cajón de navegación?
  • ¿Cómo utilizo DrawerLayout para mostrar sobre la Barra de Acción / Barra de herramientas y debajo de la barra de estado?
  • Cómo agregar barra de acción personalizada con el cajón de navegación?
  • El cajón de navegación es lento con vista compleja
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.