Remove space between stacked TextViews

Question

I have a vertical LinearLayout with two TextView inside it. The former contains a static text property (it's text never change) and the last contains a regressive timer. The image below shows both items:

I want to eliminate the blank space that both texts have both top and bottom. I've tried several approaches...

android:includeFontPadding="false"
android:lineSpacingMultiplier="1"
android:lineSpacingExtra="0dp"
android:paddingTop="0dp"
android:paddingBottom="0dp"
android:layout_marginTop="0dp"
android:layout_marginBottom="0dp"

...but none of them removed the space above the text. How can I make both texts close to each other without any extra space?

PS: I've found this similar question, but no one answered it.

---

Full layout code:

<LinearLayout 
    android:id="@+id/boxTime"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="20dp" >

    <TextView
        android:id="@+id/textRemainingTime2"
        android:layout_width="wrap_content"
        android:layout_heigh="wrap_content"
        android:layout_gravity="center"
        android:gravity="center_horizontal"
        android:textSize="70sp"
        android:includeFontPadding="false"
        android:lineSpacingMultiplier="1"
        android:lineSpacingExtra="0dp"
        android:paddingTop="0dp"
        android:paddingBottom="0dp"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="0dp"
        android:text="@string/title" />

    <TextView
        android:id="@+id/textRemainingTime"
        android:layout_width="wrap_content"
        android:layout_heigh="wrap_content"
        android:layout_gravity="center"
        android:gravity="center_horizontal"
        android:includeFontPadding="false"
        android:lineSpacingMultiplier="1"
        android:lineSpacingExtra="0dp"
        android:paddingTop="0dp"
        android:paddingBottom="0dp"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="0dp"
        android:textSize="107sp"
        android:text="@string/timer" />

</LinearLayout>

Answer 1

Try using negative margins. It may take a bit of playing with the numbers to get it right, but I've done it before and it worked out well.

android:layout_marginTop="-5dp"

Answer 2

By default, a TextView includes some padding to leave space for accent characters. You can turn that off with:

 android:includeFontPadding="false"

or

 textView.setIncludeFontPadding(false)

Answer 3

Make baseline of the text equal to the bottom of the TextView.

public class BaselineTextView extends TextView {

    public BaselineTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        int yOffset = getHeight() - getBaseline();
        canvas.translate(0, yOffset);
        super.onDraw(canvas);
    }

}

NOTE: To avoid chopping off descenders call setClipChildren(false) on your TextView's parent ViewGroup (android:clipChildren="false" in XML).

Answer 4

If you set includeFontPadding to false it helps.

android:includeFontPadding="false"

but if you know you don't have any descenders because you set

android:textAllCaps="true"

or you know there are no characters which have descender, you can make a custom TextView and set the height to the baseline.

public class ExTextView extends TextView {

    public ExTextView(Context context) {
        this(context, null);
    }

    public ExTextView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public ExTextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    public ExTextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        setHeight(getBaseline());  // <--- Shrink size to baseline
        super.onDraw(canvas);
    }
}

The source code is included in my UiComponents test app. https://github.com/landenlabs/UiComponents