Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Align controls in the center of screen

I have controls that I want to center them on the center of screen so I used the following code

<?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:gravity="center_vertical|center_horizontal"
    android:background="#DDDDDD">
    <TextView
        android:id="@+id/tv_un"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="10pt"
        android:textColor="#444444"

        android:layout_marginRight="9dip"
        android:layout_marginTop="20dip"
        android:layout_marginLeft="10dip"

        android:text="User Name:"/>
    <EditText
        android:id="@+id/et_un"
        android:layout_width="150dip"
        android:layout_height="wrap_content"
        android:background="@android:drawable/editbox_background"
        android:layout_toRightOf="@id/tv_un"

        android:layout_alignTop="@id/tv_un"/>
     <TextView
        android:id="@+id/tv_pw"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="10pt"
        android:textColor="#444444"

        android:layout_below="@id/tv_un"
        android:layout_marginRight="9dip"
        android:layout_marginTop="15dip"
        android:layout_marginLeft="10dip"

        android:text="Password:"/>
    <EditText
        android:id="@+id/et_pw"
        android:layout_width="150dip"
        android:layout_height="wrap_content"
        android:background="@android:drawable/editbox_background"
        android:layout_toRightOf="@id/tv_pw"
        android:layout_alignTop="@id/tv_pw"
        android:layout_below="@id/et_un"
        android:layout_marginLeft="17dip"

        android:password="true"        />
    <Button
        android:id="@+id/btn_login"
        android:layout_width="100dip"
        android:layout_height="wrap_content"
        android:layout_below="@id/et_pw"

        android:layout_marginTop="15dip"
        android:layout_marginLeft="110dip"

        android:text="Login" />
     <TextView
        android:id="@+id/tv_error"
        android:layout_width="fill_parent"
        android:layout_height="40dip"
        android:textSize="7pt"

        android:layout_below="@id/btn_login"
        android:layout_marginRight="9dip"
        android:layout_marginTop="15dip"
        android:layout_marginLeft="15dip"
        android:textColor="#AA0000"

        android:text=""/>
</RelativeLayout>

but the output became as the following image

enter image description here

any idea how to center them regardless the orientation of the screen

Best regards

like image 291
AMH Avatar asked Dec 06 '22 14:12

AMH


2 Answers

Try android:layout_centerInParent = "true" This can solve your issue.. You can apply this attribute to any element you want to display in the center of the screen.

like image 150
Ghost Avatar answered Dec 24 '22 09:12

Ghost


edited your code

here it is

<?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:layout_centerHorizontal="true"
android:background="#DDDDDD"
android:gravity="center_vertical|center_horizontal" >

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv_un"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="User Name:"
            android:textColor="#444444"
            android:textSize="10pt" />

        <EditText
            android:id="@+id/et_un"
            android:layout_width="150dip"
            android:layout_height="wrap_content"
            android:layout_alignTop="@id/tv_un"
            android:layout_toRightOf="@id/tv_un"
            android:background="@android:drawable/editbox_background" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv_pw"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_un"
            android:text="Password:"
            android:textColor="#444444"
            android:textSize="10pt" />

        <EditText
            android:id="@+id/et_pw"
            android:layout_width="150dip"
            android:layout_height="wrap_content"
            android:layout_alignTop="@id/tv_pw"
            android:layout_below="@id/et_un"
            android:layout_marginLeft="17dip"
            android:layout_toRightOf="@id/tv_pw"
            android:background="@android:drawable/editbox_background"
            android:password="true" />
    </LinearLayout>

    <Button
        android:id="@+id/btn_login"
        android:layout_width="100dip"
        android:layout_height="wrap_content"
        android:layout_below="@id/et_pw"
        android:layout_marginLeft="110dip"
        android:layout_marginTop="15dip"
        android:text="Login" />

    <TextView
        android:id="@+id/tv_error"
        android:layout_width="fill_parent"
        android:layout_height="40dip"
        android:layout_below="@id/btn_login"
        android:layout_marginLeft="15dip"
        android:layout_marginRight="9dip"
        android:layout_marginTop="15dip"
        android:text=""
        android:textColor="#AA0000"
        android:textSize="7pt" />
</LinearLayout>

like image 30
Akram Avatar answered Dec 24 '22 10:12

Akram