Android TextView offset downwards

Question

I have an activity with two Buttons and a TextView in a LinearLayout. My TextView is offset downwards and the text doesn't fit inside the box. Can you explain what is happening? I think it is related to padding, and I've read several discussions about the perils of TextView padding, but that doesn't explain why the text is cut off at the bottom.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="#800080">

    <Button
        android:text="This"
        android:background="@drawable/button_red" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    />
    <Button
        android:text="That"
        android:background="@drawable/button_green" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
    />
    <TextView 
        android:text="Copious amounts of text that overflows onto several lines on a small screen, causing the TextView to dangle below the buttons.  Why it does this I can't imagine.  I only hope someone can help me with this." 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#533f93"
    />
</LinearLayout>

This code produces this display:

The purple is the LinearLayout, the blue is the TextView. As you can see, the TextView's top is below those of the buttons and its bottom is below the bottom of the LinearLayout. As I add text to the TextView, the LinearLayout increases its height appropriately, but because the TextView is offset, I always lose the bottom of the last line.

I ran Hierarchy Viewer and it gave me this wireframe:

Which shows the vertical offset at the top, but misses the bottom of the TextView. The same wireframe with the LinearLayout selected looks like this:

According to Hierarchy Viewer, the top of the buttons is at 0, but the top of the TextView is at 7. I've tried various fixes, mostly culled from this site:

    android:paddingTop="0dp"
    android:background="@null"
    android:includeFontPadding="false"

None of these fixed my issue.

Hodosh

Answer 1

Set android:baselineAligned property of your LinearLayout to false.

From documentation:

When set to false, prevents the layout from aligning its children's baselines. This attribute is particularly useful when the children use different values for gravity. The default value is true.

Rosalbarosalee

Yes, that works! I don't understand why the default is for the LinearLayout to push the text beyond its borders. – Hodosh

You can read, for example, this post to understand what does baseline mean. So, by default each succeeding widget in LinearLayout is baseline-aligned to its preceding widget. In our case first line of TextView is baseline-aligned to the Button's text. I agree, it is not intuitive behaviour, but it is. – Rosalbarosalee

Answer 2

give the layout_gravity of the Textview to be center_vertical

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" 
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#800080">

<Button
    android:text="This"

    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
/>
<Button
    android:text="That"

    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
/>
<TextView 
    android:text="Copious amounts of text that overflows onto several lines on a small screen, causing the TextView to dangle below the buttons.  Why it does this I can't imagine.  I only hope someone can help me with this." 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#533f93"
android:layout_gravity="center_vertical"/>
</LinearLayout>

Bacteroid

Gah! So easy, thanks! The default seems to be NONE. Any idea why by default it pushes the text partially out of sight? – Hodosh

Answer 3

Try setting the layout_gravity for the TextView like this:

<TextView 
    android:text="Copious amounts of text that overflows onto several lines on a small screen, causing the TextView to dangle below the buttons.  Why it does this I can't imagine.  I only hope someone can help me with this." 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#533f93"
    android:layout_gravity="top"
/>

Romonaromonda

Answer 4

If you have this problem with several TextViews you can add android:gravity="center_vertical" to LinearLayout

Ferdelance