Search code examples
androidxmlandroid-relativelayout

Centering EditText views in a RelativeLayout


enter image description here

If you notice the EditText views for Email and Password, the line isn't centered. In the design and preview modes in Android Studio, they looked centered, but when I ran it on my phone this is what showed. I'm having trouble making it centered. Here's my code of what it currently is:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="@string/email"
        android:id="@+id/emailTextLabel"
        android:layout_marginTop="42dp"
        android:layout_alignParentTop="true"
        android:layout_alignLeft="@+id/passwordTextLabel"
        android:layout_alignStart="@+id/passwordTextLabel"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="@string/password"
        android:id="@+id/passwordTextLabel"
        android:layout_marginLeft="27dp"
        android:layout_marginStart="27dp"
        android:layout_marginTop="50dp"
        android:layout_below="@+id/emailTextLabel"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"/>

    <EditText
        android:layout_width="325dp"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress"
        android:ems="10"
        android:id="@+id/emailEditText"
        android:layout_below="@+id/emailTextLabel"
        android:layout_alignLeft="@+id/emailTextLabel"
        android:layout_alignStart="@+id/emailTextLabel"/>

    <EditText
        android:layout_width="325dp"
        android:layout_height="wrap_content"
        android:inputType="textPassword"
        android:ems="10"
        android:id="@+id/passwordEditText"
        android:layout_below="@+id/passwordTextLabel"
        android:layout_alignLeft="@+id/passwordTextLabel"
        android:layout_alignStart="@+id/passwordTextLabel"/>

    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/keep_me_signed_in"
        android:id="@+id/keepMeSignedInCheckBox"
        android:layout_below="@+id/passwordEditText"
        android:layout_alignLeft="@+id/passwordEditText"
        android:layout_alignStart="@+id/passwordEditText"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sign_in"
        android:id="@+id/sign_in_button"
        android:layout_alignTop="@+id/sign_up_button"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="90dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sign_up"
        android:id="@+id/sign_up_button"
        android:layout_marginTop="40dp"
        android:layout_below="@+id/keepMeSignedInCheckBox"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_marginRight="90dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/use_without_account"
        android:id="@+id/use_without_account_button"
        android:layout_marginTop="8dp"
        android:layout_below="@+id/sign_in_button"
        android:layout_centerHorizontal="true"/>

</RelativeLayout>

Solution

  • set EditText width to match_parent and give margin from left and right, and remove android:layout_alignLeft , android:layout_alignStart

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textEmailAddress"
        android:ems="10"
        android:layout_marginLeft="27dp"
        android:layout_marginRight="27dp"
        android:id="@+id/emailEditText"
        android:layout_below="@+id/emailTextLabel"/>