Android Design Navigation Drawer - How to add a sw

Question

I am using the new Android Design Navigation Drawer. I want to add a switch in the drawer. Is there a away to implement this?

this is the menu xml:

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group
        android:id="@+id/nav_view_menu_group_1"
        android:checkableBehavior="single">
        <item
            android:id="@+id/nav_view_menu_item_myschedule"
            android:icon="@drawable/ic_navview_my_schedule"
            android:title="@string/navview_menu_item_myschedule"
            android:titleCondensed="@string/navview_menu_item_myschedule" />
        <item
            android:id="@+id/nav_view_menu_item_iolive"
            android:icon="@drawable/ic_navview_play_circle_fill"
            android:title="@string/navview_menu_item_iolive"
            android:titleCondensed="@string/navview_menu_item_iolive"
            android:visible="false"/>
        <item
            android:id="@+id/nav_view_menu_item_explore"
            android:icon="@drawable/ic_navview_explore"
            android:title="@string/navview_menu_item_explore"
            android:titleCondensed="@string/navview_menu_item_explore" />
        <item
            android:id="@+id/nav_view_menu_item_map"
            android:icon="@drawable/ic_navview_map"
            android:title="@string/navview_menu_item_map"
            android:titleCondensed="@string/navview_menu_item_map"
            android:visible="false"/>
    </group>

</menu>

How can I change one <item> to be switch:

<Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Switch"
        android:id="@+id/switch1"
        android:layout_gravity="center_horizontal" />

I am currently using the default layout:

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

Just Like this Image under Android Notification http://i.stack.imgur.com/M9nD7.png

I really Appreciate any feedback. Thank you.

Answer 1

We can do it by the following way

@Override
public boolean onPrepareOptionsMenu(Menu menu) {

    //Get a reference to your item by id
    MenuItem item = menu.findItem(R.id.menu_pick_color);

    //Here, you get access to the view of your item, in this case, the layout of the item has a FrameLayout as root view but you can change it to whatever you use
    FrameLayout rootView = (FrameLayout)item.getActionView();

    //Then you access to your control by finding it in the rootView
    YourControlClass control = (YourControlClass) rootView.findViewById(R.id.control_id);

    //And from here you can do whatever you want with your control

    return true;
}

Answer 2

One way I have found of doing this would be to use setActionView on the menuItem you want:

    mNavigationView.getMenu().findItem(R.id.nav_connect)
            .setActionView(new Switch(this));

    // To set whether switch is on/off use:
    ((Switch) mNavigationView.getMenu().findItem(R.id.nav_connect).getActionView()).setChecked(true);

Probably want a click listener as well to change the state of the Switch:

    mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
        @Override
        public boolean onNavigationItemSelected(MenuItem menuItem) {

            switch (menuItem.getItemId()) {
                case R.id.nav_connect:
                    ((Switch) menuItem.getActionView()).toggle();
                    return true;
            }
        }
    }

I haven't tried, but you could probably use android:actionLayout="@layout/switch_layout" in xml and point to a custom layout you created.

Also could try using an ActionProvider which might offer a little more robustness. I haven't tried this method either though.

Answer 3

If you only want to check for the changes in the switch, you can set onCheckedChangeListener only for the switch like so

((Switch) navigationView.getMenu().findItem(R.id.darkModeSwitch).getActionView())
            .setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
            if(isChecked) {
                Toast.makeText(MainActivity.this, "Checked", Toast.LENGTH_SHORT).show();
            } else {
                Toast.makeText(MainActivity.this, "Unchecked", Toast.LENGTH_SHORT).show();
            }
        }
    });

If you want to be cool use lambda

((Switch) navigationView.getMenu().findItem(R.id.darkModeSwitch).getActionView())
            .setOnCheckedChangeListener((buttonView, isChecked) -> {
                if(isChecked) {
                    Toast.makeText(MainActivity.this, "Checked", Toast.LENGTH_SHORT).show();
                } else {
                    Toast.makeText(MainActivity.this, "Unchecked", Toast.LENGTH_SHORT).show();
                }
            });