Android导航视图：减少图标和文本之间的空格以及`itemBackground`不起作用

Question

有没有一种方法可以在使用菜单xml构建NavigationView时减少图标和文本之间的空隙？

我尝试使用“app:itemTextAppearance”属性的文本“android:drawablePadding”，但这行不通。我尝试设置填充和边距，但仍然不起作用。

另外，当我设置“app:itemBackground”并设置选中状态时，整个菜单项都没有高亮显示，就像下面的图片。

用于创建itemBackground的xml为：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@color/white_alpha_10" />
    <item android:state_checked="true" android:drawable="@color/white_alpha_10" />
    <item android:state_focused="true" android:drawable="@color/white_alpha_10" />
    <item android:state_activated="true" android:drawable="@color/white_alpha_10" />
    <item android:drawable="@android:color/transparent" />
</selector>

任何想法可能发生了什么？很明显，菜单项上有背景颜色，但是菜单xml非常标准。

NavigationView 返回从主题设置的紫色背景：

<!--Activity xml -->
<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    android:layout_gravity="start"
    app:theme="@style/AppTheme.NavigationView"
    app:menu="@menu/menu_nav_drawer"
    app:itemBackground="@drawable/nav_drawer_item"
    app:headerLayout="@layout/nav_header"/>

<!-- styles.xml -->
<style name="AppTheme.NavigationView" parent="Widget.Design.NavigationView">
    <item name="android:background">@color/charcoal_new</item>
    <item name="itemIconTint">@color/nav_drawer_icon</item>
    <item name="android:listDivider">@color/dusk_alpha_50</item>
    <item name="itemTextAppearance">@style/NavigationViewTextAppearance</item>
</style>

<style name="NavigationViewTextAppearance" parent="TextAppearance.Body.Regular">
    <item name="android:textColor">@color/white</item>
    <item name="android:padding">0dp</item>
    <item name="android:layout_margin">0dp</item>
</style>

我正在使用Android支持/设计库23.2.1。

- Ali

---

“Change sec.. Code” 是项目还是标题？如果它是标题，请显示“@layout/nav_header”。 - Volodymyr Kulyk

试着通过以下链接，你可以为每一行获取textview并对其进行自定义 - https://dev59.com/e5Pfa4cB1Zd3GeqPJu7A#35313552 - Wasim K. Memon

我成功地在源代码中找到了维度资源并覆盖了它。只有突出显示的问题仍然存在。 - Ali

你是如何找到维度资源并查看默认值的？ - blackHawk

你需要搜索源代码。我现在记不清确切的过程是什么了，但是阅读源代码总是一个好主意。 - Ali

Answer 1

经过查看源代码，我发现您可以覆盖一个尺寸资源来修复这个问题。

<dimen tools:override="true" name="design_navigation_icon_padding">16dp</dimen>

请注意，这将在所有地方更改该尺寸资源！您还可以复制布局文件并覆盖它：design_navigation_menu.xml

至于不同颜色的边缘，我设置了 app:itemBackground="@android:color/transparent"，然后在 NavigationView 的主题中设置：

<item name="selectableItemBackground">@drawable/nav_drawer_item_selector</item>

您可以按照以下方式在 NavigationView 的主题中处理这两个问题：

    <item name="selectableItemBackground">@drawable/nav_drawer_item_selector</item>
    <item name="itemBackground">@color/transparent</item>

nav_drawer_item_selector.xml的外观如下：

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

- Ali

---

感谢您的回答，您给出的 tools:override 建议帮助我通过覆盖 <dimen tools:override="true" name="design_navigation_separator_vertical_padding">1dp</dimen> 解决了减少分隔符内元素边距的问题。请问能否将您的答案标记为已采纳？ - A.Alqadomi

@Ali，你还有这个工作示例吗？你介意在这里分享一下吗？selectableItemBackground对我来说破坏了整个布局。由于NavigationMenuItemView内部填充设置的边缘，将itemBackground设置为透明似乎对我没有任何作用。 - RobGThai

上面的代码对我仍然有效，问题可能出在其他地方。尝试在 Stack Overflow 上创建一个问题，并提供尽可能多的细节。 - Ali

您还需要将xmlns:tools="http://schemas.android.com/tools"添加到命名空间中。 - Borzh

Answer 2

使用app:itemIconPadding来设置新的材料设计NavigationView中的图标间距。

<com.google.android.material.navigation.NavigationView
                        ...
                        app:itemIconPadding="10dp"/>

- random

---

嘿，这对我很有效，简单而且高效。非常感谢。 - Prakash Jadhav

Answer 3

只需在 dimens.xml 文件中添加此行即可

<dimen tools:override="true" name="design_navigation_icon_padding">10dp</dimen>

这将覆盖NavigationView的填充(padding)

- Ankur Bavishi

---

应该是 dimens.xml，而不是 dimen.xml。 - Shamsul Arefin

Answer 4

在 Material 组件库中使用 NavigationView ，请使用 app:itemIconPadding 属性。

<com.google.android.material.navigation.NavigationView
    app:itemIconPadding="4dp"
    ../>

您还可以定义自定义样式，例如：

  <style name="CustomNavigationView" parent="Widget.MaterialComponents.NavigationView">
    <item name="itemIconPadding">@dimen/....</item>
  </style>

默认值由@dimen/mtrl_navigation_item_icon_padding定义，为14dp。

- Gabriele Mariotti

Answer 5

如果您没有使用Material Design，在您包含NavigationView的.xml文件中，请插入以下代码：

app:itemIconPadding="14dp"

14dp是一个示例，请选择适合自己的值。

示例：

<com.google.android.material.navigation.NavigationView
    android:layout_width="175dp"
    android:layout_height="match_parent" 
    android:id="@+id/navigation_view"
    app:menu="@menu/drawer_menu"
    app:itemIconPadding="14dp"    <------
    app:headerLayout="@layout/drawer_header"
    android:layout_gravity="start"
    android:fitsSystemWindows="true">
</com.google.android.material.navigation.NavigationView>

- Optimiser

Answer 6

如果有人不了解工具，请按照以下步骤操作： 在res->Values->dimens.xml中打开dimens.xml。

<resources xmlns:tools="http://schemas.android.com/tools"> <dimen tools:override="true" name="design_navigation_icon_padding">10dp</dimen> </resources>

- shyam.y