¿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.

  • ActionLayout para los elementos de la vista de navegación se muestra en el lado derecho
  • OnCreateOptionsMenu () en el fragmento que no reemplaza los menús de ActionBar
  • Android Design Navigation Drawer - ¿Cómo agregar un conmutador en el navegador xml?
  • Cómo ocultar OptionsMenu en NavigationDrawer utilizando Fragmentos?
  • Dinámico añadiendo elemento a NavigationView en Android
  • Cajón de navegación con la actividad y el niño Fragmentos
  • Diseño del cajón de navegación el título en la barra de herramientas no cambia
  • No abra el cajón de navegación de forma predeterminada
  • Cajón de navegación de estilo de material, el color de la barra de estado se pone demasiado oscuro
  • ¿Cómo agregar un título en el diseño del cajón de navegación?
  • Empuje la actividad a la derecha cuando el cajón abierto
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.