模拟器上的布局问题

Question

我尝试在我的Android应用程序中订购4x2矩阵中的一些按钮。在eclipse中，它看起来很完美：

我的问题是，在我的设备上/在模拟器中，所有按钮几乎都在彼此之上：

在第二个屏幕截图中，您只看到一个按钮，因为其他按钮设置为不可见。当我按下按钮时，一个不同的按钮显示在几乎与之前相同的地方。

这是我的布局：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button1"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:layout_marginLeft="17dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button2"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:layout_marginLeft="17dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button3"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:layout_marginLeft="17dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button4"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:layout_marginRight="17dp"
            android:background="@drawable/willi"
            android:text="Button" />

    </TableRow>


    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <Button
            android:id="@+id/button5"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button6"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button7"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:background="@drawable/willi"
            android:text="Button" />

        <Button
            android:id="@+id/button8"
            android:layout_width="50dp"
            android:layout_height="80dp"
            android:background="@drawable/willi"
            android:text="Button" />

    </TableRow>

</TableLayout>

这是我第一次使用TableLayout所以我不明白为什么会这样。