How to add Spinner as an item in Navigation Drawer

Question

I want to add spinner as an item in my navigation drawer. Where should I put the spinner as an item? Where to inflate the layout for the spinner? Where to initialize the spinner? I want it to look like this:

This is where I add my items:

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

<group
    android:id="@+id/group1"
    android:checkableBehavior="single">
    <item
        android:id="@+id/nav_login"
        android:icon="@drawable/ic_login"
        android:title="@string/login_menu_item"/>
    <item
        android:id="@+id/nav_signup"
        android:icon="@drawable/ic_signup"
        android:title="@string/signup_menu_item"/>
    </group>

<item android:title="@string/language">
    <menu>
        <item
            android:id="@+id/nav_eng"
            android:title="@string/english">
        </item>

        <item
            android:id="@+id/nav_heb"
            android:title="@string/hebrew">
        </item>
    </menu>

This is my layout with the drawer:

<LinearLayout 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:layout_width="match_parent"
          android:layout_height="match_parent"
          android:fitsSystemWindows="true"
          android:orientation="vertical">

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar_home"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    app:title="Masü"
    />

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:openDrawer="start">

    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:itemIconTint="@color/colorAccent"
        app:itemTextColor="@color/textColorSecondary"
        app:menu="@menu/activity_home_drawer"/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>

And on click of an item this is how it works:

public boolean onNavigationItemSelected(MenuItem item) {
    int id = item.getItemId();
    mDrawerLayout.closeDrawers();

    if (id == R.id.nav_login) {
        if (mIsLoggedin) {
            logout();
        } else {
            mFragmentTransaction = mFragmentManager.beginTransaction();
            mFragmentTransaction.replace(R.id.fragment_container, new LoginFragment()).commit();
        }

Answer 1

Step 1. Please add item in menu.xml

 <item
            android:id="@+id/navigation_drawer_item3"
            android:icon="@android:drawable/ic_menu_share"
            android:title=""
            app:actionLayout="@layout/spinner"/> 

Step 2. Please create layout for spinner view

<?xml version="1.0" encoding="utf-8"?>
<Spinner xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/spinner"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_vertical"
    android:gravity="center_vertical" />

Step 3. set spinner data in your activity file

Spinner spinner = (Spinner) navigationView.getMenu().findItem(R.id.navigation_drawer_item3).getActionView();
    spinner.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_spinner_dropdown_item,language));
    spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
        @Override
        public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {  
          Toast.makeText(MainActivity.this,language[position],Toast.LENGTH_SHORT).show();
        }
        @Override
        public void onNothingSelected(AdapterView<?> parent) {
        }
    });

Step 4. please add android support design library into project if need.

Answer 2

I will guide you how to make a custom spinner in Toolbar so you can get idea from here.

Step 1 Add support library and create Toolbar layout

toolbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 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/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimaryDark"
    android:minHeight="?attr/actionBarSize"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
     >

    <Spinner
        android:id="@+id/spinner_nav"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</android.support.v7.widget.Toolbar>

Step 2 include toolbar in your activity layout file like this

spintoolbaractivity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#c9c9c9"
    android:orientation="vertical" >

    <include
        android:id="@+id/toolbar"
        layout="@layout/spintoolbar" />


</LinearLayout>

spinner_row.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
   android:background="@drawable/spinner_selector"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tvCategory"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:textSize="18sp"
        />

</RelativeLayout>

values/styles.xml

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

<style name="AppTheme" parent="AppTheme.Base" />

<style name="AppTheme.Base" parent="Theme.AppCompat.NoActionBar">
    <!-- your app branding color for the app bar -->
    <item name="colorPrimary">@color/md_teal_500_primary</item>

    <!-- darker variant for the status bar and contextual app bars -->
    <item name="colorPrimaryDark">@color/md_teal_700</item>

    <!-- theme UI controls like checkboxes and text fields -->
    <item name="colorAccent">@color/md_teal_900</item>


</style>

Step 3 Create this custom adapter for spinner.

CustomSpinnerAdapter.java

 import java.util.ArrayList;
    import android.content.Context;
    import android.content.res.Resources;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ArrayAdapter;
    import android.widget.TextView;

    // Custom Adapter for Spinner
    public class CustomSpinnerAdapter extends ArrayAdapter<String> {

     private Context context1;
     private ArrayList<String> data;
     public Resources res;
     LayoutInflater inflater;

     public CustomSpinnerAdapter(Context context, ArrayList<String> objects) {
      super(context, R.layout.spinner_row, objects);

      context1 = context;
      data = objects;

      inflater = (LayoutInflater) context1
        .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

     }

     @Override
     public View getDropDownView(int position, View convertView, ViewGroup parent) {
      return getCustomView(position, convertView, parent);
     }

     @Override
     public View getView(int position, View convertView, ViewGroup parent) {
      return getCustomView(position, convertView, parent);
     }

     // This funtion called for each row ( Called data.size() times )
     public View getCustomView(int position, View convertView, ViewGroup parent) {

      View row = inflater.inflate(R.layout.spinner_row, parent, false);

      TextView tvCategory = (TextView) row.findViewById(R.id.tvCategory);

      tvCategory.setText(data.get(position).toString());

      return row;
     }
    }

SpinToolbarActivity.java

    import java.util.ArrayList;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.Spinner;
import android.widget.Toast;

public class SpinToolbarActivity extends AppCompatActivity {

 private Toolbar toolbar;

 private Spinner spinner_nav;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.spintoolbaractivity);
  toolbar = (Toolbar) findViewById(R.id.toolbar);
  spinner_nav = (Spinner) findViewById(R.id.spinner_nav);

  if (toolbar != null) {
   setSupportActionBar(toolbar);
   getSupportActionBar().setDisplayShowTitleEnabled(false);

  }
  addItemsToSpinner();

 }

 // add items into spinner dynamically
 public void addItemsToSpinner() {

  ArrayList<String> list = new ArrayList<String>();
  list.add("Top News");
  list.add("Politics");
  list.add("Business");
  list.add("Sports");
  list.add("Movies");

  // Custom ArrayAdapter with spinner item layout to set popup background

  CustomSpinnerAdapter spinAdapter = new CustomSpinnerAdapter(
    getApplicationContext(), list);



  // Default ArrayAdapter with default spinner item layout, getting some
  // view rendering problem in lollypop device, need to test in other
  // devices

  /*
   * ArrayAdapter<String> spinAdapter = new ArrayAdapter<String>(this,
   * android.R.layout.simple_spinner_item, list);
   * spinAdapter.setDropDownViewResource
   * (android.R.layout.simple_spinner_dropdown_item);
   */

  spinner_nav.setAdapter(spinAdapter);

  spinner_nav.setOnItemSelectedListener(new OnItemSelectedListener() {

   @Override
   public void onItemSelected(AdapterView<?> adapter, View v,
     int position, long id) {
    // On selecting a spinner item
    String item = adapter.getItemAtPosition(position).toString();

    // Showing selected spinner item
    Toast.makeText(getApplicationContext(), "Selected  : " + item,
      Toast.LENGTH_LONG).show();
   }

   @Override
   public void onNothingSelected(AdapterView<?> arg0) {
    // TODO Auto-generated method stub

   }
  });

 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 }

 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
  // Handle action bar item clicks here. The action bar will
  // automatically handle clicks on the Home/Up button, so long
  // as you specify a parent activity in AndroidManifest.xml.
  int id = item.getItemId();
  if (id == R.id.action_settings) {
   Toast.makeText(getApplicationContext(), "Settings Clicked",
     Toast.LENGTH_SHORT).show();
   return true;
  } else if (id == R.id.action_search) {
   Toast.makeText(getApplicationContext(), "Search Clicked",
     Toast.LENGTH_SHORT).show();
   return true;
  } else if (id == R.id.action_add) {
   Toast.makeText(getApplicationContext(), "Add Clicked",
     Toast.LENGTH_SHORT).show();
   return true;
  } else if (id == R.id.action_delete) {
   Toast.makeText(getApplicationContext(), "Delete Clicked",
     Toast.LENGTH_SHORT).show();
   return true;
  }
  return super.onOptionsItemSelected(item);
 }
}

See your spinner look like this