Android应用程序的布局在设备上大不相同

Question

我构建了一个简单的，曾经是屏幕的Android应用程序 - 它有edittext个用户名，密码等的框。这就是它在AVD / Eclipse中的样子：

然而，当我将它部署到我的HTC Evo 4G时，它的外观如下：

如果重要，Project Build Target在Eclipse中是Android 4.0，但我的HTC Evo 4g运行的是Android 2.3.3。这是否会造成这种巨大差异？布局不应该向后兼容吗？

我刚刚意识到这一点：
当我将设备旋转到横向视图时，我只看到电子邮件编辑文本，但当设备处于纵向状态时，我只看到密码编辑文本（如上图所示）。

这是我的main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >



    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="40dp"
        android:layout_weight="0.34"
        android:scaleType="center"
        android:src="@drawable/shift" />


    <TextView
        android:id="@+id/txtLogin"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginBottom="20dp"
        android:layout_marginTop="20dp"
        android:text="@string/login"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <FrameLayout
        android:id="@+id/frameLayout1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <TextView
            android:id="@+id/txtEmail"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="20dp"
            android:text="@string/email"
            android:textAppearance="?android:attr/textAppearanceSmall" />

        <EditText
            android:id="@+id/txtEmail"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="50dp"
            android:inputType="textEmailAddress" >            
        </EditText>        

        <TextView
            android:id="@+id/txtPass"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:layout_marginTop="120dp"
            android:text="@string/password"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:hint = "Email address" />

        <EditText
            android:id="@+id/editText2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="150dp"
            android:inputType="textPassword"            
            android:hint="Password"/>


        <Button
            android:id="@+id/btnLogin"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="200dp"
            android:text="Login" />

        <requestFocus/>

    </FrameLayout>

</LinearLayout>

Answer 1

在进一步研究和修改UI XML之后，我意识到问题是我的大多数控件都在framelayout中。

现在，我不确定framelayout究竟是什么，但它似乎将所有控件叠加在一起（并忽略边距）。我只能看到密码edittext的原因是因为它被放置在元素堆栈的顶部。