LinearLayout 没有按照我的意愿对齐答案

【问题标题】：LinearLayout not aligned as i wishLinearLayout 没有按照我的意愿对齐
【发布时间】：2023-03-04 18:17:02
【问题描述】：

我们从一张图片开始：

我希望电子邮件地址的 TextView 和 EditText 位于徽标下方，但不知何故位于徽标上方。

我的布局：

<ScrollView 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="com.example.mylifeinformationsharedsocial.LoginActivity" >

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:background="@color/white_1" >

    <!--  Header Starts-->
    <LinearLayout 
        android:id="@+id/linear_layout_header_id"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/header_gradient"
        android:paddingTop="5dip"
        android:paddingBottom="5dip"
        android:orientation="vertical" >

            <!-- Logo Start-->
            <ImageView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/hd_logo"
                android:layout_marginLeft="10dip"
                android:layout_marginStart="10dip"
                android:contentDescription="@string/imgae_view_logo_content_description"
                />

    </LinearLayout>         
            <!-- Logo Ends -->
    <!--  Header Ends -->

    <!-- Footer Start -->
    <LinearLayout
        android:id="@+id/linear_layout_footer_id"
        android:layout_width="fill_parent"
        android:layout_height="90dip"
        android:orientation="vertical"
        android:background="@drawable/header_gradient"
        android:layout_alignParentBottom="true" >
    </LinearLayout>   
    <!-- Footer Ends -->

    <!-- Login Form -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="10dip" >

      <!--  Email Label -->
      <TextView 
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:textColor="@color/black_1"
          android:text="@string/login_page_email_text_view_text"
          />

      <EditText
          android:id="@+id/login_page_email_edit_text_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="5dip"
          android:layout_marginBottom="20dip"
          android:singleLine="true"
          android:hint="@string/login_page_email_edit_text_hint"
          android:inputType="textEmailAddress"
          />

      <!--  Password Label -->
      <TextView 
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:textColor="#372c24"
          android:text="@string/login_page_password_text_vuew_text"
          />

      <EditText
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="5dip"
          android:singleLine="true"
          android:inputType="textPassword"
          android:hint="@string/login_page_password_edit_text_hint"
            />
      <!-- Login button -->
      <Button 
          android:id="@+id/login_page_login_button_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="10dip"
          android:text="@string/login_page_login_button_text"
          />

      <!-- Link to Registration Screen -->
      <TextView 
          android:id="@+id/login_page_go_to_sign_up_page_text_view_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="40dip"
          android:layout_marginBottom="20sp"
          android:text="@string/login_page_go_to_sign_up_page_text_view_text"
          android:gravity="center"
          android:textSize="20sp"
          android:textColor="#0b84aa"
          />

    </LinearLayout>
    <!-- Login Form Ends -->

   </RelativeLayout>

</ScrollView>

我做错了什么？因为所有的LinearLayout 方向都设置为垂直，那么为什么某些视图会在其他视图之上对齐？

【问题讨论】：

@Stefano 你们都是对的。就因为你是第一个。

标签： android android-linearlayout android-imageview android-xml android-relativelayout

【解决方案1】：

你的父容器是一个RelativeLayout，所以孩子们之间必须“以相对的方式”定位。例如：linear_layout_footer_id 应该放在linear_layout_header_id 下使用

android:layout_below="@id/linear_layout_header_id"

其他解决方案：将您的 RelativeLayout 替换为另一个具有垂直方向的 LinearLayout

【讨论】：

【解决方案2】：

由于您的父布局是相对的，因此您需要为视图提供以下条件。这是使用您的 xml 的固定 xml。

<ScrollView 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="com.example.mylifeinformationsharedsocial.LoginActivity" >

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:background="@color/white_1" >

    <!--  Header Starts-->
    <LinearLayout 
        android:id="@+id/linear_layout_header_id"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/header_gradient"
        android:paddingTop="5dip"
        android:paddingBottom="5dip"
        android:orientation="vertical" >

            <!-- Logo Start-->
            <ImageView 
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/hd_logo"
                android:layout_marginLeft="10dip"
                android:layout_marginStart="10dip"
                android:contentDescription="@string/imgae_view_logo_content_description"
                />

    </LinearLayout>         
            <!-- Logo Ends -->
    <!--  Header Ends -->

    <!-- Footer Start -->
    <LinearLayout
        android:id="@+id/linear_layout_footer_id"
        android:layout_width="fill_parent"
        android:layout_height="90dip"
        android:orientation="vertical"
        android:background="@drawable/header_gradient"
        android:layout_alignParentBottom="true" >
    </LinearLayout>   
    <!-- Footer Ends -->

    <!-- Login Form -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_below="@+id/linear_layout_header_id"
        android:padding="10dip" >

      <!--  Email Label -->
      <TextView 
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:textColor="@color/black_1"
          android:text="@string/login_page_email_text_view_text"
          />

      <EditText
          android:id="@+id/login_page_email_edit_text_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="5dip"
          android:layout_marginBottom="20dip"
          android:singleLine="true"
          android:hint="@string/login_page_email_edit_text_hint"
          android:inputType="textEmailAddress"
          />

      <!--  Password Label -->
      <TextView 
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:textColor="#372c24"
          android:text="@string/login_page_password_text_vuew_text"
          />

      <EditText
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="5dip"
          android:singleLine="true"
          android:inputType="textPassword"
          android:hint="@string/login_page_password_edit_text_hint"
            />
      <!-- Login button -->
      <Button 
          android:id="@+id/login_page_login_button_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="10dip"
          android:text="@string/login_page_login_button_text"
          />

      <!-- Link to Registration Screen -->
      <TextView 
          android:id="@+id/login_page_go_to_sign_up_page_text_view_id"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="40dip"
          android:layout_marginBottom="20sp"
          android:text="@string/login_page_go_to_sign_up_page_text_view_text"
          android:gravity="center"
          android:textSize="20sp"
          android:textColor="#0b84aa"
          />

    </LinearLayout>
    <!-- Login Form Ends -->

   </RelativeLayout>

</ScrollView>

如您所见，现在您的登录表单已具备条件

android:layout_below="@+id/linear_layout_header_id"

所以它会出现在标题下方。

【讨论】：

【解决方案3】：

添加此代码

android:layout_below="@+id/linear_layout_header_id"

到应该低于 Logo 的 LinearLayout

【讨论】：

【解决方案4】：

添加android:layout_below="@+id/linear_layout_header_id"为

    <!-- Login Form -->
    <LinearLayout
        android:layout_below="@+id/linear_layout_header_id"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="10dip" >

【讨论】：

你们都对android:layout_below 说得对。但是用垂直方向的LinearLayout 替换RelativeLayout 搞砸了。谢谢你们。

【解决方案5】：

请更改您的文件如下：

<ScrollView 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="com.example.mylifeinformationsharedsocial.LoginActivity" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/white_1" >

        <!--  Header Starts-->
        <LinearLayout
            android:id="@+id/linear_layout_header_id"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/header_gradient"
            android:paddingTop="5dip"
            android:paddingBottom="5dip"
            android:orientation="vertical" >

            <!-- Logo Start-->
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/hd_logo"
                android:layout_marginLeft="10dip"
                android:layout_marginStart="10dip"
                android:contentDescription="@string/imgae_view_logo_content_description"
                />

        </LinearLayout>
        <!-- Logo Ends -->
        <!--  Header Ends -->

        <!-- Footer Start -->
        <LinearLayout
            android:id="@+id/linear_layout_footer_id"
            android:layout_width="fill_parent"
            android:layout_height="90dip"
            android:orientation="vertical"
            android:background="@drawable/header_gradient"
            android:layout_alignParentBottom="true" >
        </LinearLayout>
        <!-- Footer Ends -->

        <!-- Login Form -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="10dip" <!-- Because relative layout arranges all its childs in layer we have to make them separate -->
            android:layout_below="@+id/linear_layout_footer_id">

            <!--  Email Label -->
            <TextView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:textColor="@color/black_1"
                android:text="@string/login_page_email_text_view_text"
                />

            <EditText
                android:id="@+id/login_page_email_edit_text_id"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dip"
                android:layout_marginBottom="20dip"
                android:singleLine="true"
                android:hint="@string/login_page_email_edit_text_hint"
                android:inputType="textEmailAddress"
                />

            <!--  Password Label -->
            <TextView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:textColor="#372c24"
                android:text="@string/login_page_password_text_vuew_text"
                />

            <EditText
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="5dip"
                android:singleLine="true"
                android:inputType="textPassword"
                android:hint="@string/login_page_password_edit_text_hint"
                />
            <!-- Login button -->
            <Button
                android:id="@+id/login_page_login_button_id"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dip"
                android:text="@string/login_page_login_button_text"
                />

            <!-- Link to Registration Screen -->
            <TextView
                android:id="@+id/login_page_go_to_sign_up_page_text_view_id"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="40dip"
                android:layout_marginBottom="20sp"
                android:text="@string/login_page_go_to_sign_up_page_text_view_text"
                android:gravity="center"
                android:textSize="20sp"
                android:textColor="#0b84aa"
                />

        </LinearLayout>
        <!-- Login Form Ends -->

    </RelativeLayout>

</ScrollView>

相对布局将其所有布局相对排列。如果你不指定任何相关属性，那么它的所有子属性都会重叠。

希望对你有帮助。！！

【讨论】：

【解决方案6】：

您将LinerLayouts 安排在RelativeLayouts 中，因此您需要确保您的LinearLayouts 是相对的。尝试添加属性android:layout_below。

【讨论】：