android spinner dropdown checkbox

Question

I have Spinner like this :

<Spinner
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/spinner1"
                android:background="@drawable/spinner_bg"
                android:popupBackground="@drawable/spinner_bg"/>

this is spinner_bg.xml :

<item>
    <layer-list>
        <item>
            <shape>
                <gradient
                    android:startColor="#ffffff"
                    android:centerColor="#111111"
                    android:endColor="#000000"
                    android:angle="-90" />

                <stroke
                    android:width="2dp"
                    android:color="#ffffff" />

                <corners
                    android:radius="2dp" />

                <padding
                    android:left="10dp"
                    android:right="10dp"/>
            </shape>
        </item>
        <item >
            <bitmap
                android:gravity="right"
                android:src="@android:drawable/arrow_down_float" />
        </item>
    </layer-list>
</item>

this is my code to Custom spinner :

ArrayAdapter<ClassId> adapter = new ArrayAdapter<ClassId>(getActivity(),
                        R.layout.list_id, idList);
                adapter.setDropDownViewResource(R.layout.list_id_select);

this is layout of list_id.xml :

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:singleLine="true"
android:ellipsize="end"
android:textColor="#ff0004"
android:textSize="14sp"
android:paddingTop="10dp"
android:paddingBottom="10dp"/>

this is layout of list_id_select.xml :

<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:singleLine="true"
android:ellipsize="end"
android:textColor="#0004ff"
android:textSize="14sp"
android:checked="true"
android:checkMark="@drawable/custom_checkbox"
android:paddingTop="10dp"
android:paddingBottom="10dp"/>

and this is custom_checkbox.xml :

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true"
    android:drawable="@android:drawable/checkbox_on_background" /> 

<item android:state_pressed="true"
    android:drawable="@android:drawable/checkbox_on_background" /> 

<item android:drawable="@android:drawable/checkbox_off_background" /> 

this is my result when dropdown of spinner show : _________________________________________________
__________________________checkbox_______________
____text_________________________________________

that mean text and checkbox not in line (checkbox higher than text).
how to fix it?

Answer 1

For that you have to Create Custom Adapter and set TextView and CheckBox inside that below way.

Define Spinner in xml

<Spinner
        android:id="@+id/spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp" />

Create spinner_item.xml file in layout folder.

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

    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:text="text"
        android:textAlignment="gravity" />

    <CheckBox
        android:id="@+id/checkbox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true" />
</RelativeLayout>

Now create StateVO.java class that can contain the TextView and CheckBox value.

public class StateVO {
    private String title;
    private boolean selected;

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public boolean isSelected() {
        return selected;
    }

    public void setSelected(boolean selected) {
        this.selected = selected;
    }
}

Now in your Activity inititlize the Spinner and set CustomAdapter below way.

 final String[] select_qualification = {
                "Select Qualification", "10th / Below", "12th", "Diploma", "UG",
                "PG", "Phd"};
        Spinner spinner = (Spinner) findViewById(R.id.spinner);

        ArrayList<StateVO> listVOs = new ArrayList<>();

        for (int i = 0; i < select_qualification.length; i++) {
            StateVO stateVO = new StateVO();
            stateVO.setTitle(select_qualification[i]);
            stateVO.setSelected(false);
            listVOs.add(stateVO);
        }
        MyAdapter myAdapter = new MyAdapter(Main2Activity.this, 0,
                listVOs);
        spinner.setAdapter(myAdapter);

And Finally Create CustomAdapter class like below way.

MyAdapter.java

public class MyAdapter extends ArrayAdapter<StateVO> {
    private Context mContext;
    private ArrayList<StateVO> listState;
    private MyAdapter myAdapter;
    private boolean isFromView = false;

    public MyAdapter(Context context, int resource, List<StateVO> objects) {
        super(context, resource, objects);
        this.mContext = context;
        this.listState = (ArrayList<StateVO>) objects;
        this.myAdapter = this;
    }

    @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);
    }

    public View getCustomView(final int position, View convertView,
                              ViewGroup parent) {

        final ViewHolder holder;
        if (convertView == null) {
            LayoutInflater layoutInflator = LayoutInflater.from(mContext);
            convertView = layoutInflator.inflate(R.layout.spinner_item, null);
            holder = new ViewHolder();
            holder.mTextView = (TextView) convertView
                    .findViewById(R.id.text);
            holder.mCheckBox = (CheckBox) convertView
                    .findViewById(R.id.checkbox);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        holder.mTextView.setText(listState.get(position).getTitle());

        // To check weather checked event fire from getview() or user input
        isFromView = true;
        holder.mCheckBox.setChecked(listState.get(position).isSelected());
        isFromView = false;

        if ((position == 0)) {
            holder.mCheckBox.setVisibility(View.INVISIBLE);
        } else {
            holder.mCheckBox.setVisibility(View.VISIBLE);
        }
        holder.mCheckBox.setTag(position);
        holder.mCheckBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                int getPosition = (Integer) buttonView.getTag();

                if (!isFromView) {
                    listState.get(position).setSelected(isChecked);
                }
            }
        });
        return convertView;
    }

    private class ViewHolder {
        private TextView mTextView;
        private CheckBox mCheckBox;
    }
}

Output :