Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add custom views in the new NavigationView

I'm trying to add a switch as menuitem in NavigationView like this

enter image description here

I used the the actionViewClass attribute but it only shows the title.

<item
android:id="@+id/navi_item_create_notifications_sound"
android:title="Notifications Sounds"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:actionViewClass="android.support.v7.widget.SwitchCompat"
app:showAsAction="always" />
like image 397
atabouraya Avatar asked Jun 21 '15 11:06

atabouraya


People also ask

What is customized view?

Custom Views is just a way to make an android developer a painter. When you need to create some custom and reuse the views when it is not provided by the Android Ecosystem. Custom Views can be used as widgets like TextView, EditText etc.

What is NavigationView in Android?

com.google.android.material.navigation.NavigationView. Represents a standard navigation menu for application. The menu contents can be populated by a menu resource file. NavigationView is typically placed inside a DrawerLayout .


2 Answers

The new support library 23.1

allows using a custom view for the items in Navigation View using app:actionLayout or using MenuItemCompat.setActionView().

enter image description here

Here's how I managed to display a SwitchCompat

menu_nav.xml

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

    <group
        android:id="@+id/first"
        android:checkableBehavior="single">

        <item
            android:id="@+id/navi_item_1"
            android:icon="@drawable/ic_feed_grey_500_24dp"
            android:title="Feed" />
        <item
            android:id="@+id/navi_item_2"
            android:icon="@drawable/ic_explore_grey_500_24dp"
            android:title="Explore" />
        <item
            android:id="@+id/navi_item_4"
            android:icon="@drawable/ic_settings_grey_500_24dp"
            android:title="Settings" />

    </group>
    <group
        android:id="@+id/second"
        android:checkableBehavior="single">
        <item xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/navi_item_create_notifications_sound"
            android:title="Notifications Sounds"
            app:actionLayout="@layout/menu_swich"
            app:showAsAction="always" />

    </group>
</menu>

menu_switch.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.SwitchCompat xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="right|center_vertical"
    app:buttonTint="@color/colorPrimary"
    app:switchPadding="@dimen/spacing_small" />

To get the View and assign events to it, you should do :

SwitchCompat item = (SwitchCompat) navigationView.getMenu().getItem(3).getActionView();
        item.setOnCheckedChangeListener( new CompoundButton.OnCheckedChangeListener(){
            @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                Logr.v(LOG_TAG, "onCheckedChanged" + isChecked);
            }
        });
like image 137
atabouraya Avatar answered Oct 22 '22 10:10

atabouraya


Simple solution as you are using NavigationView

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:menu="@menu/activity_main_drawer">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:orientation="horizontal">

        <android.support.v7.widget.SwitchCompat
            android:id="@+id/mSwitch"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:text="Night Mode" />

    </LinearLayout>

</android.support.design.widget.NavigationView>
like image 32
Aks4125 Avatar answered Oct 22 '22 10:10

Aks4125