导航抽屉列表中的下划线菜单项

时间:2016-03-07 17:00:02

标签: android xml navigation-drawer menuitem

如何在导航栏中勾选菜单项?

期望

enter image description here

现实

enter image description here

@菜单/ activity_navigation_drawer:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

<group android:checkableBehavior="single">
    <item
        android:id="@+id/nav_open_account"
        android:title="@string/na_navigate_open_account" />
    <item
        android:id="@+id/nav_login"
        android:title="@string/na_navigate_login" />
    <item
        android:id="@+id/nav_stock_signals"
        android:title="@string/na_navigate_stock_signals" />

    ...

</group>

导航抽屉活动布局:

<?xml version="1.0" encoding="utf-8"?>
<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="end">

<include
    layout="@layout/app_bar_navigation"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="end"
    android:fitsSystemWindows="true"
    android:background="@color/primary_asphalt_dark"
    app:headerLayout="@layout/nav_header_navigation"
    app:menu="@menu/activity_navigation_drawer" /> 

</android.support.v4.widget.DrawerLayout>

告诉我是否需要更多代码。

2 个答案:

答案 0 :(得分:8)

每个组以行分隔符结束。因此,如果菜单中的每个项目都有自己的组,您将获得所需的图形输出:

<?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android">

    <group android:id="@+id/nav_open_account_group"
        android:checkableBehavior="single">
        <item
            android:id="@+id/nav_open_account"
            android:title="@string/na_navigate_open_account" />
        </group>
    <group android:id="@+id/nav_login_group"
        android:checkableBehavior="single">
        <item
            android:id="@+id/nav_login"
            android:title="@string/na_navigate_login" />
    </group>
    <group android:id="@+id/nav_stock_signals_group"
        android:checkableBehavior="single">
        <item
            android:id="@+id/nav_stock_signals"
            android:title="@string/na_navigate_stock_signals" />
     </group>

        ...

    </menu>

enter image description here

请注意,每个组的不同ID都是必需的。

答案 1 :(得分:0)

按两次Shift

design_navigation_menu_item.xml

打开文件com.android.support:design-26.1.0

将文件design_navigation_menu_item.xml复制到\app\src\main\res\layout以覆盖它

android:paddingStart="@dimen/design_navigation_icon_padding"添加到CheckedTextView,使文件如下所示:

<merge xmlns:android="http://schemas.android.com/apk/res/android">

<CheckedTextView
        android:id="@+id/design_menu_item_text"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:drawablePadding="@dimen/design_navigation_icon_padding"
        android:paddingStart="@dimen/design_navigation_icon_padding"
        android:gravity="center_vertical|start"
        android:maxLines="1"
        android:textAppearance="@style/TextAppearance.AppCompat.Body2"/>

<ViewStub
        android:id="@+id/design_menu_item_action_area_stub"
        android:inflatedId="@+id/design_menu_item_action_area"
        android:layout="@layout/design_menu_item_action_area"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"/>

</merge>

activity_main.xml添加到NavigationView app:itemBackground="@drawable/drawer_item_background_selector"后,应该是这样的:

<android.support.design.widget.NavigationView
      ...
        app:itemBackground="@drawable/drawer_item_background_selector"
      .../>

创建drawable/drawer_item_background_selector.xml

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

创建drawable/drawer_item_background_default.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/drawer_transparent" />
    <stroke
        android:width="1dp"
        android:color="@color/appGrayLight" />
    <padding
        android:bottom="1dp"
        android:left="-2dp"
        android:right="-2dp"
        android:top="-2dp" />
</shape>

enter image description here