在相對佈局中創建佈局

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>