Android layout is missing elements when debugging on phone

Question

I am experiencing some strange behaviour with my layouts. As you can see from the screenshot below (of the layout in eclipse) the 'register' button appears just fine at the bottom of the screen. Before

However, if you now take a look at the following screenshot taken on my phone (HTC ONE X) whilst debugging, the button is completely cut off with plenty of space. After

The code for the register page is as follows (where the button is contained within the relative layout)

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

<TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:gravity="center"
    android:text="Register"
    android:textSize="18sp" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="25dp"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_weight="0.25"
        android:text="Title:" />

    <EditText
        android:id="@+id/txtTitle"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="0.75"
        android:ems="10"
        android:text="" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_weight="0.25"
        android:text="First Name:" />

    <EditText
        android:id="@+id/txtFirstName"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="0.75"
        android:ems="10"
        android:text="" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_weight="0.25"
        android:text="Surname:" />

    <EditText
        android:id="@+id/txtSurname"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="0.75"
        android:ems="10"
        android:text="" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_weight="0.25"
        android:text="Email:" />

    <EditText
        android:id="@+id/txtEmail"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="0.75"         
        android:ems="10"
        android:text="" />
</LinearLayout>

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_weight="0.25"
        android:text="Age:" />

    <EditText
        android:id="@+id/txtAge"
        android:layout_width="10dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_weight="0.75"
        android:ems="10"
        android:text="" />
</LinearLayout>

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_marginTop="10dp"
    android:orientation="vertical"
    android:stretchColumns="*"
    android:weightSum="4" >

    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <TextView
            android:id="@+id/txtGender"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_weight="0.25"
            android:text="Gender" />

        <TextView
            android:id="@+id/txtTypeOfUser"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_weight="0.25"
            android:text="Type of User" />
    </TableRow>

    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <RadioGroup
            android:id="@+id/radioSex"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <RadioButton
                android:id="@+id/radioMale"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:checked="true"
                android:text="Male" />

            <RadioButton
                android:id="@+id/radioFemale"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Female" />
        </RadioGroup>

        <RadioGroup
            android:id="@+id/radioTypeOfUser"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <RadioButton
                android:id="@+id/radioUser"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:checked="true"
                android:text="User" />

            <RadioButton
                android:id="@+id/radioDoctor"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Doctor" />
        </RadioGroup>
    </TableRow>
</TableLayout>

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="20dp"
        android:layout_marginRight="20dp"
        android:text="Register" />
</RelativeLayout>

</LinearLayout>

Answer 1

Your TableLayout has layout_height set to fill_parent, change it to wrap_content.

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:orientation="vertical"
    android:stretchColumns="*"
    android:weightSum="4" >