Android Screen Clipped at Bottom

Question

I am developing an Android app (see screenshots).

I have a layout that looks fine in the graphical editor. However, the bottom 1/4 of the screen is clipped from view when the app is run in the emulator. The app has several activities, and the problem seems to be widespread to all.

View from Eclipse gui builder View from the android emulator/actual phone

The emulator target is android 2.3, and the problem also occurred on a 2.2 phone.

    <?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="fill_parent"
    android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent">
    <ImageView android:layout_height="wrap_content" android:src="@drawable/simpsonstextblack" android:layout_width="fill_parent" android:id="@+id/TitleImage" android:layout_gravity="center_horizontal" android:paddingBottom="20dp"></ImageView>
    <RelativeLayout android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/RelativeLayout1" android:padding="5dp">
        <Button android:text="Take the Simpsons Challenge" android:gravity="center" android:clickable="true" android:id="@+id/ChallengeButton" android:layout_width="fill_parent" android:layout_height="50dp" android:textSize="20dp" android:background="@drawable/buttonbackgroundblue"></Button>
        <TextView android:layout_width="fill_parent" android:layout_below="@+id/ChallengeButton" android:layout_alignLeft="@+id/ChallengeButton" android:id="@+id/spacer1" android:layout_height="5dp"></TextView>
        <Button android:layout_width="fill_parent" android:text="Free Play" android:clickable="true" android:id="@+id/FreePlayButton" android:layout_height="50dp" android:textSize="20dp" android:background="@drawable/buttonbackgroundblue" android:layout_below="@+id/spacer1"></Button>
        <TextView android:layout_width="fill_parent" android:id="@+id/spacer2" android:layout_below="@+id/FreePlayButton" android:layout_alignLeft="@+id/FreePlayButton" android:layout_height="5dp"></TextView>
        <Button android:layout_height="50dp" android:textSize="20dp" android:id="@+id/HighScoreButton" android:background="@drawable/buttonbackgroundblue" android:layout_width="fill_parent" android:text="High Scores" android:layout_below="@+id/spacer2"></Button>
        <TextView android:layout_width="fill_parent" android:id="@+id/spacer3" android:layout_below="@+id/HighScoreButton" android:layout_alignLeft="@+id/HighScoreButton" android:layout_height="5dp"></TextView>
        <Button android:layout_height="50dp" android:textSize="20dp" android:id="@+id/HelpButton" android:background="@drawable/buttonbackgroundblue" android:layout_width="fill_parent" android:text="Help" android:layout_below="@+id/spacer3"></Button>
    </RelativeLayout>
    <RelativeLayout android:layout_width="fill_parent" android:id="@+id/RelativeLayout1" android:layout_height="fill_parent">
        <TextView android:id="@+id/textView1" android:layout_width="fill_parent" android:layout_height="50dp"></TextView>
        <TextView android:layout_below="@+id/textView1" android:layout_height="wrap_content" android:layout_width="fill_parent" android:textAppearance="?android:attr/textAppearanceMedium" android:id="@+id/QuoteText" android:text='"A woman is a lot like a refrigerator. Six feet tall, 300 pounds…it makes ice."'></TextView>
        <TextView android:layout_below="@+id/QuoteText" android:layout_width="fill_parent" android:id="@+id/QuoteTextSpeaker" android:gravity="right" android:textAppearance="?android:attr/textAppearanceMedium" android:layout_height="wrap_content" android:text=" - Homer"></TextView>
    </RelativeLayout>
</LinearLayout>

Thank You

Can you post the layout file? – 500865 Oct 23 '11 at 06:08 — 500865, Oct 23 '11 at 06:08

score 1 · Accepted Answer · answered Nov 10 '11 at 16:05

1

I had been targeting SDK 3 when it should have been 4. Apparently targeting SDK 3 causes android to clip the screen if it overextends, rather than shrinking it to fit.

answered Nov 10 '11 at 16:05

Rob

762
2
21
44

score 0 · Answer 2 · answered Oct 23 '11 at 22:56

0

You should not be using so many dummy LinearLayouts inside other LinearLayouts. You need to use RelativeLayouts for these kind of views.

answered Oct 23 '11 at 22:56

500865

6,920
7
44
87

I know, a hideous solution no doubt. Would conversion to relativelayout actually solve the problem? I mean, I am fixing the size of those dummy layouts. I just don't understand why the bottom 1/4 of my screen is clipped. But I can try it. – Rob Oct 23 '11 at 23:12
I'm sure it will. You need to take a look at this : http://stackoverflow.com/questions/2961049/effective-android-programming-techniques/3020898#3020898 . Item #3 is what I was reffering. – 500865 Oct 23 '11 at 23:34
I changed the layouts to relative layouts, and I replaced the linear layout spacers with empty text views. However, the problem persists exactly as shown in the screenshots. I don't see what RelativeLayouts have to do with the bottom 1/4 of the screen being clipped from view. – Rob Oct 24 '11 at 01:56
The screen ends at the point where the view is getting clipped. You use couple of hardcoded layout_heights. Try using wrap content there and see if it works. You just need to try different combinations. Try using RelativeLayout as the root layout and place all other elements inside that. Anyway, good luck. – 500865 Oct 24 '11 at 02:15

Android Screen Clipped at Bottom

2 Answers2