Android Create aligned fields Layout

问题

Here's my issue I have a login and want to line up the EditText fields. See the mockup picture attached

.
I have tried a few ways and cannot figure out how to make the fields lineup.

I really hate layouts in Android I spend more time just messing with things to line up right. Wish they would just scrap it and use something more intuitive, as its more like using tables in HTML. So in advance thanks for your help and cheers!

回答1:

You could probably play around with RelativeLayout and get just what you want.

Here's an approximation with TableLayout.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TableLayout
        android:layout_marginTop="40dip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        <TableRow>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="right"
                android:padding="10dip"
                android:text="UserID:" />
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="10dip"
                android:text="USER ID" />
        </TableRow>
        <TableRow>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="right"
                android:padding="10dip"
                android:text="Password:" />
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="10dip"
                android:text="PASSWORD" />
        </TableRow>
    </TableLayout>
    <LinearLayout
        android:layout_marginTop="50dip"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:weightSum="3"
        android:gravity="center">
        <Button
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="LOGIN" />
        <Button
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="REGISTER" />
    </LinearLayout>
</LinearLayout>

回答2:

See if this works for you. It doesnt center quite perfectly but it does align well across multiple screen sizes.

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" android:background="#FFFF0000">
  <LinearLayout android:id="@+id/top_row"
            android:layout_height="wrap_content" 
            android:layout_alignParentTop="true"
            android:orientation="vertical" android:layout_centerHorizontal="true" android:layout_width="wrap_content" android:layout_marginTop="25dip">
            <LinearLayout  android:layout_height="wrap_content"  android:orientation="horizontal" android:layout_width="fill_parent">
                <TextView android:layout_height="wrap_content" android:text="User Id" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
                <EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
            </LinearLayout>
            <LinearLayout  android:layout_height="wrap_content"  android:orientation="horizontal" android:layout_width="fill_parent">
                <TextView android:layout_height="wrap_content" android:text="Password" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
                <EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
            </LinearLayout>
  </LinearLayout>
  <LinearLayout
            android:layout_height="wrap_content" 
            android:orientation="horizontal" android:layout_width="wrap_content" android:layout_below="@+id/top_row" android:layout_centerHorizontal="true" android:layout_marginTop="20dip">
        <Button android:layout_width="wrap_content" android:text="LOGIN" android:layout_height="wrap_content" android:layout_marginRight="10dip"></Button>
        <Button android:text="REGISTER" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_marginLeft="10dip"></Button>
  </LinearLayout>
</RelativeLayout>

Here's what it looks like in my IDE...

回答3:

You can do this quick and dirty using TableLayout, just add a TableRow with a TextView and a EditText for the userid and repeat the same for the password.

See http://developer.android.com/resources/tutorials/views/hello-tablelayout.html

来源：https://stackoverflow.com/questions/5642404/android-create-aligned-fields-layout