Alice W.
Alice W.

Reputation: 81

How would I create a tab indicator in NavigationDrawer?

How do I create a navigation draw tab indicator like this? Does the NavigationDrawer class have an indicator like TabLayout?

enter image description here

Upvotes: 2

Views: 57

Answers (1)

sanoJ
sanoJ

Reputation: 3128

You can define a custom drawable with a left border and set it as the background of the selected item. Follow the steps given below,

Step 1: Define a drawable with left border(selected_item.xml) in drawables

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#000000" />
    </shape>
</item>
<item android:left="2dp">
    <shape android:shape="rectangle">
        <solid android:color="#FF0000" />
    </shape>
</item>
</layer-list>

Step 2: Define a selector(navi_selector.xml) in drawables

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

    <item android:state_checked="true" android:drawable="@drawable/selected_item"/>
    <item android:state_pressed="true" android:drawable="#000000"/>

</selector>

Step 3: set the navi_selector for app:itemBackground

 <android.support.design.widget.NavigationView
        app:itemTextColor="@android:color/white"
        android:fitsSystemWindows="true"
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/activity_main_drawer"
        android:background="#000000"
        app:itemBackground="@drawable/navi_selector"/>

Upvotes: 1

Related Questions