如何更改 NavigationView 的项目文本大小？

Google 最近被释放 android.support.design.widget.NavigationView小部件作为 com.android.support:design:22.2.0库的一部分，它极大地简化(并标准化)了创建 NavigationDrawer 的过程。

但是根据 设计规格，列表项应该是 中型机器人，14% ，87% # 000000。NavigationView没有公开 textSize或 textStyle来定制这个。

Material design specs Font style info

如果我迂腐地维护正确的设计规范 使用谷歌提供的 NavigationView(或以任何其他方式定制它) ，我的选择是什么？

94943 次浏览
小开

列出导航栏的适配器布局:

<?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>

RelativeLayout 中的这个参数设置背景颜色—— > android: behind = “@draable/press _ state”

在可绘制文件夹中创建这个“ press _ state.xml”。

<?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"/>

请原谅我的英语不好。

小开

我在 源代码中找到了这个布局文件

平台/框架/支持/.../design/res/layp/design _ pull _ item. xml

具有以下属性

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

这意味着我们所要做的就是在我们的项目中覆盖 textAppearanceListItem风格。

Res/value/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>

我不完全确定这还会影响什么，但如果有人有更好的答案，我很乐意接受！

小开
最佳答案

自从 Android 支持库22.2.1以来，Google 已经将 NavigationView中默认的 textSize 从16sp 改为14sp，这非常符合“材料设计”的指导方针。但是，在某些情况下(例如，当您想要支持中文语言时) ，似乎大一些的 textSize 更好。解决办法很简单:

  1. 在 layout.xml 中将 app:theme="@style/yourStyle.Drawer"添加到 NavigationView
  2. 在 styles.xml 中，以样式 yourStyle.Drawer添加 android:textSize="16sp"
小开

这对我很有效:

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" />

Xml

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

在文件 app/src/main/res/values/styles.xml创建新样式

<style name="NavigationDrawerStyle">


<item name="android:textSize">20sp</item><!-- text size in menu-->


<!-- item size in menu-->
<item name="android:listPreferredItemHeightSmall">40dp</item>
<item name="listPreferredItemHeightSmall">40dp</item>


<!-- item padding left in menu-->
<item name="android:listPreferredItemPaddingLeft">8dp</item>
<item name="listPreferredItemPaddingLeft">8dp</item>


<!-- item padding right in menu-->
<item name="android:listPreferredItemPaddingRight">8dp</item>
<item name="listPreferredItemPaddingRight">8dp</item>
</style>

加入你的 main_layout.xml

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




</android.support.design.widget.NavigationView>

导航项的所有参数(可以更改)都位于此处(文件 ...\sdk\extras\android\support\design\res\layout\design_navigation_item.xml的路径)

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" />

也可以覆盖 *.xml文件(从 ...\sdk\extras\android\support\design\res\layout\design_navigation_item.xml复制文件) ，只需在 app/src/main/res/layout文件夹中创建一个名为相同 design_navigation_item.xml的布局。

所有可以被覆盖的布局都位于这里 ...\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

[ UPDATE ] 每个版本的 com.android.support:design-{version} lib 都有不同的项要重写。 检查所有你需要的东西

enter image description here

[2020年4月14日更新]

如果您使用的是 com.google.android.material.navigation.NavigationView 然后打开课堂，你会看到:

public NavigationView(@NonNull Context context, @Nullable AttributeSet attrs) {
this(context, attrs, R.attr.navigationViewStyle);
}

因此，你可以使用 attr navigationViewStyle通过你的应用程序的主题为 NavigationView 设置你自己的风格:

注意: AppTheme 的父主题应该是 Theme.MaterialComponents

    <style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar.Bridge">
...
<item name="navigationViewStyle">@style/AppNavigationViewStyle</item>
...
</style>


<style name="AppNavigationViewStyle" parent="Widget.MaterialComponents.NavigationView">
<item name="itemTextAppearance">@style/AppNavigationViewItemTextAppearance</item>
</style>
<style name="AppNavigationViewItemTextAppearance" parent="@style/TextAppearance.MaterialComponents.Subtitle2">
<item name="android:textSize">18sp</item>
</style>

只要打开父主题就可以查看所有的 <item name attrs 以进行覆盖

小开

您可以在 style.xml 中自定义从文本颜色到大小和字体的所有内容

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

然后在你的 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
...
android:itemTextAppearance="@style/NavDrawerTextStyle"
/>

小开

您可以在 xml 文件中使用此属性

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

或者短信

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

或大文本

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

也许会有帮助，最近我不得不通过程序来做这件事。 我用了这门课:

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];
}
};
}

然后我这样说:

// 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);

希望这个能帮上忙。

小开
  1. 打开或创建数据量值 diments.xml
  2. 添加以下代码:
<dimen name="design_bottom_navigation_text_size" tools:override="true">11sp</dimen>
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>

应该可以

小开

Goto activity _ main.xml 并在设计中选择 nav _ view，您可以通过更新 外观和 项目文本颜色来更改菜单项文本大小，如下所示 navigation_view_item_style

小开

对于 com.google.android.material.navigation.NavigationView，您应该使用自定义样式的 应用程序名称空间: app:itemTextAppearance="@style/NavDrawerTextStyle"


提交答案