在相对布局中创建布局

Question

我需要创建类似这样的layout但尚未完善。

得到这个

需要这样

我创建这个使用RelativeLayout，需要在此只为打造。我能够使用Linearlayout子布局创建，但可以这样无需使用任何子布局

这是我的代码

<RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="15dp"> 
     <TextView android:text="Title" android:textColor="#ffffff" android:layout_width="wrap_content" 
      android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
      android:background="@drawable/tab_cyan" android:id="@+id/title_add_txt"/> 
     <EditText android:hint="Address Title" android:layout_width="match_parent" android:layout_height="wrap_content" 
      android:id="@+id/address_title" android:layout_toRightOf="@id/title_add_txt"/> 
     <TextView android:text="Address" android:textColor="#ffffffff" android:layout_width="wrap_content" 
      android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
      android:background="@drawable/tab_cyan" android:layout_below="@id/title_add_txt" 
      android:id="@+id/address_txt"/> 
     <EditText android:hint="Address" android:layout_width="match_parent" android:layout_height="wrap_content" 
      android:id="@+id/address" android:layout_below="@id/address_title" android:layout_toRightOf="@id/address_txt"/> 
</RelativeLayout> 

Answer 1

layout_alignBaseline应该解决您的问题 - 它的对齐在同一行的意见文本基线：

<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:padding="15dp" > 

    <TextView 
     android:id="@+id/title_add_txt" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#5500ff00" 
     android:padding="5dp" 
     android:text="Title" 
     android:textColor="#ffffff" 
     android:textSize="18dp" /> 

    <EditText 
     android:id="@+id/address_title" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@id/title_add_txt" 
     android:layout_alignBaseline="@id/title_add_txt" 
     android:hint="Address Title" /> 

    <TextView 
     android:id="@+id/address_txt" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/title_add_txt" 
     android:layout_marginTop="10dp" 
     android:background="#5500ff00" 
     android:padding="5dp" 
     android:text="Address" 
     android:textColor="#ffffffff" 
     android:textSize="18dp" /> 

    <EditText 
     android:id="@+id/address" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/address_title" 
     android:layout_toRightOf="@id/address_txt" 
     android:layout_alignBaseline="@id/address_txt" 
     android:hint="Address" /> 
</RelativeLayout> 

我也TextViews之间增加保证金。它看起来像 - 我没有你的背景图像，以便EditTexts没有正确对齐 - 如果TextViews具有相同的宽度，这将不会是一个问题：

你可以用的EditText的边缘打和TextViews在它们之间添加必要的空间。

Answer 2

看来你TextView和EditText是不一样的尺寸。如果你能使它们的尺寸相同，它们可能会很好地对齐。

提供你的意见的大小，你最好的赌注可能会坚持与你的sub LinearLayouts。

Answer 3

我不能对它进行测试，但看看这可能帮助：

<RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="15dp"> 
    <TextView android:text="Title" android:textColor="#ffffff" android:layout_width="wrap_content" 
     android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
     android:background="@drawable/tab_cyan" android:id="@+id/title_add_txt"/> 
    <EditText android:hint="Address Title" android:layout_width="match_parent" android:layout_height="wrap_content" 
     android:id="@+id/address_title" android:layout_toRightOf="@id/title_add_txt"/> 
    <TextView android:text="Address" android:textColor="#ffffffff" android:layout_width="wrap_content" 
     android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
     android:background="@drawable/tab_cyan" android:layout_below="@id/address_title" 
     android:id="@+id/address_txt"/> 
    <EditText android:hint="Address" android:layout_width="match_parent" android:layout_height="wrap_content" 
     android:id="@+id/address" android:layout_alignTop="@id/address_txt" android:layout_alignLeft="@id/address_title"/> 
</RelativeLayout> 

我所做的是：对准address_txt下面address_title（而不是下面title_add_txt）。我还将address的对齐方式更改为与address_txt的顶部对齐，并且位于address_title的左侧（这可能也可以通过其他方式解决）。

广告我说：我无法验证它，但您至少可以尝试一下。

Answer 4

我会在LinearLayout中包装两个相关控件（标签和相应的输入），并使用android:layout_centerVertical="true"设置TextViews。

财产以后这样的...

<RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="15dp"> 
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" > 

     <TextView android:text="Title" android:textColor="#ffffff" android:layout_width="wrap_content" 
      android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
      android:background="@drawable/tab_cyan" android:id="@+id/title_add_txt" 
      android:layout_centerVertical="true" /> 
     <EditText android:hint="Address Title" android:layout_width="match_parent" android:layout_height="wrap_content" 
      android:id="@+id/address_title" android:layout_toRightOf="@id/title_add_txt"/> 
    </LinearLayout> 
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" > 
     <TextView android:text="Address" android:textColor="#ffffffff" android:layout_width="wrap_content" 
      android:layout_height="wrap_content" android:textSize="18dp" android:padding="5dp" 
      android:background="@drawable/tab_cyan" android:layout_below="@id/title_add_txt" 
      android:id="@+id/address_txt" 
      android:layout_centerVertical="true"/> 
     <EditText android:hint="Address" android:layout_width="match_parent" android:layout_height="wrap_content" 
      android:id="@+id/address" android:layout_below="@id/address_title" android:layout_toRightOf="@id/address_txt"/> 
    </LinearLayout> 
</RelativeLayout>