Custom EditText vertical alignment

3.3k views Asked by At

I created a custom EditText (actually, I just set a background drawable). The problem is that its text is always top-aligned, and I want it to be vertical-center-aligned. I've already tried to set its gravity to CENTER_VERTICAL, but it doesn't work. This is the drawable I created:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   android:shape="rectangle" android:gravity="center_vertical">
 <solid android:color="#FFFFFF"/>
 <stroke android:width="1dp" android:color="#88BA52" />  
 <corners
     android:bottomRightRadius="10dp"
     android:bottomLeftRadius="10dp"
     android:topLeftRadius="10dp"
     android:topRightRadius="10dp"/>
</shape>

And here's how I create it:

searchEditText = new EditText(getContext());
searchEditText.setTextSize(12);
searchEditText.setSingleLine();
searchEditText.setGravity(Gravity.CENTER_VERTICAL);
searchEditText.setHint(R.string.search_hint);
searchEditText.setBackgroundDrawable(
        getResources().getDrawable(R.drawable.search_field));
addView(searchEditText);
3

There are 3 answers

2
Vivienne Fosh On
searchEditText.setGravity(Gravity.CENTER | Gravity.LEFT); 

This might help

0
fpillet On

I'm seeing the same issue. Programmatically creating an EditText resulted in the gravity being vertically forced to TOP (while horizontal centering still works) ... until I commented out the calls that set the background! In this case, vertical and horizontal gravity are both honored.

Here is my code:

inputField.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT));
inputField.setLinksClickable(false);
inputField.setInputType(ie.getInputType());
inputField.setFadingEdgeLength(0);
inputField.setHorizontalFadingEdgeEnabled(false);
inputField.setPadding(borderWidth.left,borderWidth.top,borderWidth.right,borderWidth.bottom);
inputField.setOnEditorActionListener(this);
inputField.setHint(hint);
inputField.setCompoundDrawables(null, null, null, null);

// comment out the next two lines to see gravity working fine
inputField.setBackgroundDrawable(null);
inputField.setBackgroundColor(Color.WHITE);

inputField.setTextColor(Color.BLACK);
inputField.setTextSize(TypedValue.COMPLEX_UNIT_PX, 20);
inputField.setGravity(Gravity.CENTER_HORIZONTAL | Gravity.CENTER_VERTICAL);

Now, step tracing in the OS source code reveals that the computation for vertical centering strangely relies on the height reported by the background. Defaut in EditText is a NinePatchDrawable with a 64 pixels high default bitmap. If your EditText is this height, your text will be centered. Otherwise, it will be closer to top than it should. Setting a background color will internally use a ColorDrawable which reports an intrinsic height of zero, therefore only using the text height and vertically aligning it to TOP.

The way to fix this issue is to create your own Drawable subclass, set it as the background of the EditText instance, make sure you call setBounds() on the drawable so it has a height to report, and override the getIntrinsicHeight() method of the drawable to report the height that was set using setBounds().

0
mx2602 On

Try reducing your font size. For whatever reasons, I have found if your font size is too large, even if it appears to you the EditText should be tall enough to hold the text, the text will appear to be higher than properly centered vertically.

Adjust your font size down, or specify a font size if you are using default value, until you find a font size value small enough for it to appear properly centered.