In this article, we are going to see how we can make a MultiSelect DropDown in android studio and will select multiple items from a dropdown list. Advantages of MultiSelect DropDown.
- It is a good replacement for list boxes as it uses less space does the same work as a list box and gives a good look to UI.
- Dropdown lists are familiar selection mechanisms for most users since they are widely used both on the web and in android apps.
- User can select more than one item which he/she likes.
What we are going to build in this article?
In this article, we will be using a TextView, and we will set an onClickListener on that TextView so that whenever the user clicks on it dropdown list occurs. In the dropdown list, we will provide a feature to select multiple items, clear selected items, and a Button for canceling the selection process. Note that we are going to implement this application using Java language. A sample video is given below to get an idea about what we are going to do in this article.
Step by Step Implementation
Step 1: Creating a new project
- Open a new project.
- We will be working on Empty Activity with language as Java. Leave all other options unchanged.
- You can change the name of the project at your convenience.
- There will be two default files named activity_main.xml and MainActivity.java.
If you don’t know how to create a new project in Android Studio then you can refer to How to Create/Start a New Project in Android Studio?
Step 2: Working on activity_main.xml file
Here we will design the user interface of our application. We will be using the following components for their respective works:
- TextView: To allow users to click on it so that a dropdown list can appear and display the selected items in it.
- Drop-down arrow: to indicate to the user that some action will be completed after clicking it.
Use the following code in the activity_main.xml file.
<?xml version="1.0" encoding="utf-8"?>
<!-- Relative layout as parent layout--><RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
tools:context=".MainActivity">
<!-- text view to display selected items-->
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@android:drawable/editbox_background"
android:drawableRight="@android:drawable/arrow_down_float"
android:drawablePadding="16dp"
android:hint="Select Language"
android:padding="12dp" />
</RelativeLayout>
|
After executing the above code design of the activity_main.xml file looks like this.
Step 3: Working with MainActivity.java file
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import java.util.ArrayList;
import java.util.Collections;
public class MainActivity extends AppCompatActivity {
// initialize variables
TextView textView;
boolean[] selectedLanguage;
ArrayList<Integer> langList = new ArrayList<>();
String[] langArray = {"Java", "C++", "Kotlin", "C", "Python", "Javascript"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// assign variable
textView = findViewById(R.id.textView);
// initialize selected language array
selectedLanguage = new boolean[langArray.length];
textView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// Initialize alert dialog
AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
// set title
builder.setTitle("Select Language");
// set dialog non cancelable
builder.setCancelable(false);
builder.setMultiChoiceItems(langArray, selectedLanguage, new DialogInterface.OnMultiChoiceClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i, boolean b) {
// check condition
if (b) {
// when checkbox selected
// Add position in lang list
langList.add(i);
// Sort array list
Collections.sort(langList);
} else {
// when checkbox unselected
// Remove position from langList
langList.remove(Integer.valueOf(i));
}
}
});
builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
// Initialize string builder
StringBuilder stringBuilder = new StringBuilder();
// use for loop
for (int j = 0; j < langList.size(); j++) {
// concat array value
stringBuilder.append(langArray[langList.get(j)]);
// check condition
if (j != langList.size() - 1) {
// When j value not equal
// to lang list size - 1
// add comma
stringBuilder.append(", ");
}
}
// set text on textView
textView.setText(stringBuilder.toString());
}
});
builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
// dismiss dialog
dialogInterface.dismiss();
}
});
builder.setNeutralButton("Clear All", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
// use for loop
for (int j = 0; j < selectedLanguage.length; j++) {
// remove all selection
selectedLanguage[j] = false;
// clear language list
langList.clear();
// clear text view value
textView.setText("");
}
}
});
// show dialog
builder.show();
}
});
}
} |
Output: