How to make text in NumberPicker clickable

Question

I would like to know if is possible to make the text inside the NumberPicker clickable and to behave the same when I click the white area or the text area. The reason why I try to do such a thing, is that when I have a long string in the bar it becomes really difficult to select that area. I attached my code so far.

MainActivity.java

package com.yardimobileinterns.numberpicker;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.EditText;

public class MainActivity extends AppCompatActivity {

    private EditText editText;
    private String[] values = {"University1", "University2", "University3"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        editText = (EditText) findViewById(R.id.editText);

        editText.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                editText.setMovementMethod(null);
                editText.setSelection(editText.getText().length());

                showDialog(editText, values);
            }
        });

    }

    public void showDialog(EditText editText, String[] values) {
        EditTextDialogFragment editTextDialogFragment = EditTextDialogFragment.getNewInstance(editText,values);
        editTextDialogFragment.show(getFragmentManager(), "dialog");
    }

}

EditTextDialogFragment.java

package com.yardimobileinterns.numberpicker;

import android.app.DialogFragment;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.NumberPicker;


public class EditTextDialogFragment extends DialogFragment {

    public static final String EDIT_TEXT = "EDIT_TEXT";
    public static final String VALUES = "VALUES";


    private String[] mValues;
    private NumberPicker numberPicker;
    private EditText mEditText;
    private String selectedValue;


    public EditTextDialogFragment() {

    }

    public static EditTextDialogFragment getNewInstance(EditText editText, String[] values) {
        EditTextDialogFragment editTextDialogFragment = new EditTextDialogFragment();

        Bundle bundle = new Bundle();

        bundle.putStringArray(VALUES, values);
        editTextDialogFragment.setEditText(editText);
        editTextDialogFragment.setArguments(bundle);

        return editTextDialogFragment;
    }

    public void setEditText(EditText editText) {
        mEditText = editText;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRetainInstance(true);

        mValues = getArguments().getStringArray(VALUES);
    }

    @Override
    public View onCreateView(LayoutInflater layoutInflater, ViewGroup viewGroup, Bundle savedInstanceState) {

        View view = layoutInflater.inflate(R.layout.university_picker, viewGroup, false);

        getDialog().getWindow().setGravity(Gravity.FILL_HORIZONTAL | Gravity.BOTTOM);

        numberPicker = (NumberPicker) view.findViewById(R.id.numberPicker);

        numberPicker.setMinValue(0);

        selectedValue = (mValues.length == 0) ? "" : mValues[0];

        numberPicker.setMaxValue(mValues.length - 1);

        numberPicker.setDisplayedValues(mValues);

        numberPicker.setWrapSelectorWheel(false);

        numberPicker.setClickable(true);

        numberPicker.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
            @Override
            public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
                selectedValue = mValues[newVal];
            }
        });

        numberPicker.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                getDialog().dismiss();
                mEditText.setText(selectedValue);
            }
        });


        return view;
    }

}

university_picker.xml

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="com.yardimobileinterns.numberpicker.MainActivity"
    android:background="#ffffff">

    <NumberPicker
        android:id="@+id/numberPicker"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:descendantFocusability="blocksDescendants"
        >

    </NumberPicker>

</RelativeLayout>

Here is how it looks: Thanks!

I was trying to use SpannableString, but in a NumberPicker I can only use int or String as values. — Ghiurutan Alexandru, Jul 10 '17 at 09:09

score 0 · Answer 1 · answered Jul 14 '17 at 09:34

The actual solution that I found was to emulate onClick with onTouch, in order to allow the text to be clicked. It works well now.

package com.yardimobileinterns.numberpicker;

import android.app.DialogFragment;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.NumberPicker;


public class EditTextDialogFragment extends DialogFragment {

    public static final String EDIT_TEXT = "EDIT_TEXT";
    public static final String VALUES = "VALUES";


    private String[] mValues;
    private NumberPicker numberPicker;
    private EditText mEditText;
    private String selectedValue;

    private int lastAction = -1;

    public EditTextDialogFragment() {

    }

    public static EditTextDialogFragment getNewInstance(EditText editText, String[] values) {
        EditTextDialogFragment editTextDialogFragment = new EditTextDialogFragment();

        editTextDialogFragment.setValues(values);
        editTextDialogFragment.setEditText(editText);

        return editTextDialogFragment;
    }

    public void setEditText(EditText editText) {
        mEditText = editText;
    }

    public void setValues(String[] values) {
        mValues = values;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRetainInstance(true);
    }

    @Override
    public View onCreateView(LayoutInflater layoutInflater, ViewGroup viewGroup, Bundle savedInstanceState) {

        View view = layoutInflater.inflate(R.layout.university_picker, viewGroup, false);

        getDialog().getWindow().setGravity(Gravity.FILL_HORIZONTAL | Gravity.BOTTOM);

        numberPicker = (NumberPicker) view.findViewById(R.id.numberPicker);

        numberPicker.setMinValue(0);

        selectedValue = (mValues.length == 0) ? "" : mValues[mValues.length / 2];

        numberPicker.setMaxValue(mValues.length - 1);

        numberPicker.setDisplayedValues(mValues);

        numberPicker.setValue(mValues.length / 2);

        numberPicker.setWrapSelectorWheel(false);

        numberPicker.setClickable(true);

        numberPicker.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
            @Override
            public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
                selectedValue = mValues[newVal];
            }
        });


        numberPicker.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                boolean solution = false;

                switch (event.getAction()) {
                    case (MotionEvent.ACTION_DOWN):
                        lastAction = MotionEvent.ACTION_DOWN;
                        solution = false;
                        break;
                    case (MotionEvent.ACTION_UP):
                        if (lastAction == MotionEvent.ACTION_DOWN) {
                            solution = true;
                        }
                        lastAction = MotionEvent.ACTION_UP;
                        break;
                    case (MotionEvent.ACTION_SCROLL):
                        lastAction = MotionEvent.ACTION_SCROLL;
                        solution = false;
                        break;
                    default:
                        lastAction = -1;
                        solution = false;
                        break;
                }

                if (solution) {
                    getDialog().dismiss();
                    mEditText.setText(selectedValue);
                }

                return solution;
            }
        });

        return view;
    }
}

I actually find out that this isn't the best approach, because it is dependent on the screen of the device. More precisely on the sensibility of the screen. The final approach, was to pass the MotionEvent to a GestureListener and let him determine what type of event it was. — Ghiurutan Alexandru, Jul 29 '17 at 11:08

How to make text in NumberPicker clickable

1 Answers1