how can i underline each character in edittext?

Question

I'm trying to write a word guessing game like hangman in android. let's say if the word is 'apple'. I want to display 5 underlines to tell the player that the word is 5 chars long, and they should be displayed/filled like below

i cant think of a way to do so easily. i found this to be exact the same what Im looking for but there's no answer given and somehow got a lot of downvotes.

my initial thought is creating edittext with underline to be the hint and loop through all the characters. this will create # of edittext based on how many characters, but underline will be gone once a char is filled, and i need to create links to the previous/next edittext when the char is deleted/filled.

any idea on how to accomplish this? or is there a lib to use? Thank you so much!!

Answer 1

i think you dont need to use edittext for achieve it. You can add a horizontal linearlayout which is do not contain any view inside in your layout.

And than you can create a layout which will be populate in the horizontal linearlayout as a view. (thats name can be row_word) This layout will be include the underline below every edittext. You can use linearlayout for achive it.

In your fragment you can write a populate method which likes below:

public class Character
{
    public String char;

    public boolean isFilled;

}

 ArrayList<Character> words = new ArrayList();
 words.addAll(_yourWords);

 linearlayout.removeAllViews();
 for(int i = 0 ; i < words.size(); i++)
    {
        LayoutInflater inflater = (LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View v = inflater.inflate(R.layout.row_word, horizontalLinearLayout, false);

        EditText editText = v.findViewById(R.id.textView);
        //you must declare focusable and focusableintouchmode values false in 
        //the your row_word
        if(!word.isFilled)
        {
          edittext.setFocusable(true);
          edittext.setFocusableontouhcmode(true);
          editText.requestFocus();
        }
         else{
          edittext.setFocusable(false);
          edittext.setFocusableontouhcmode(false);
          edittext.clearfocus();
         } 



      edittex.setOnFocusChangeListener(new OnFocusChangeListener() {
      public void onFocusChange(View v, boolean hasFocus) {
      populate();
      } 

        .
        .
        .
        .
        .
        .

        horizontalLinearLayout.addView(v);

    }

if you want to use textview in your row_word then override the below method in your activity for get the pressed key value from the keyboard(With using interface of course). Otherwise you dont need to use below codes.

@Override
public boolean dispatchKeyEvent(KeyEvent event) {
    Log.i("key pressed", String.valueOf(event.getKeyCode()));
    return super.dispatchKeyEvent(event);
    callBack.setValue(String.valueOf(event.getKeyCode())

}

Your interface is like:

public interface pressedKeyCallback {

void onKeyPressed(String pressedKey);}

for showing keyboard:

InputMethodManager imm = (InputMethodManager)
                                 getSystemService(Context.INPUT_METHOD_SERVICE);
if(imm != null){
        imm.toggleSoftInput(InputMethodManager.SHOW_IMPLICIT, 0);
    }

Answer 2

The EditText has an underline by default, so you could just edit the colors in your style to make it darker. Add these in your style.

<item name="android:textColorSecondary">@android:color/black</item>
<item name="colorAccent">@android:color/black</item>

I'd also add this so that you don't have that blinking cursor.

editText.setCursorVisible(false);

Answer 3

I think you should you the built in hint feature of edittext. Check this out.