Menu
I want to design a layout for my login screen, I tried the following codes. Using some hardcoded values I got my center green color layout center for some screen sizes. I know using hardcoded values wont work on different screen sizes. I tried numerous stuffs on SO. Please provide me the best way
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/background" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/register_header"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:orientation="horizontal" >
<ImageView
android:id="@+id/title_image"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:src="@drawable/logo_blue" />
</RelativeLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="150dp"
android:layout_marginRight="150dp"
android:layout_marginTop="50dp"
android:layout_marginBottom="50dp"
android:orientation="vertical" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/UserInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/WelcomeInfo"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="@+id/user"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="User Name"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/username"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enter username"
android:singleLine="true"
android:textColor="#000000" >
</EditText>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/PassInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/UserInfo"
android:orientation="horizontal" >
<TextView
android:id="@+id/pwd"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Password"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/password"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enterpassword"
android:singleLine="true"
android:textColor="#000000" />
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/StoreNumInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/WelcomeInfo"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="@+id/num"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Store Number"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/store_num"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enter the Store number"
android:imeOptions="actionDone"
android:password="true"
android:textColor="#000000" >
</EditText>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/Options"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/PassInfo"
android:orientation="horizontal" >
<CheckBox
android:id="@+id/signed_in"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Stay Signed-in"
android:textColor="#000000" />
<Button
android:id="@+id/login"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Login"
android:textSize="28dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout> </ScrollView>
371
Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical" >
// put all your xml code here
</LinearLayout>
Try the edited Code:
NEW EDIT:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:weightSum="1">
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/register_header"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.1"
android:orientation="horizontal" >
<ImageView
android:id="@+id/title_image"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:gravity="center"
android:src="@drawable/logo_blue" />
</RelativeLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="0.9"
android:gravity="center"
android:orientation="vertical" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/UserInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/WelcomeInfo"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="@+id/user"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="User Name"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/username"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enter username"
android:singleLine="true"
android:textColor="#000000" >
</EditText>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/PassInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/UserInfo"
android:orientation="horizontal" >
<TextView
android:id="@+id/pwd"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Password"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/password"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enterpassword"
android:singleLine="true"
android:textColor="#000000" />
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/StoreNumInfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/WelcomeInfo"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="@+id/num"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Store Number"
android:textColor="#000000"
android:textSize="10pt"
android:textStyle="bold" />
<EditText
android:id="@+id/store_num"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:hint="Enter the Store number"
android:imeOptions="actionDone"
android:password="true"
android:textColor="#000000" >
</EditText>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/Options"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/PassInfo"
android:orientation="horizontal" >
<CheckBox
android:id="@+id/signed_in"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Stay Signed-in"
android:textColor="#000000" />
<Button
android:id="@+id/login"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Login"
android:textSize="28dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Use your cover of your green layout as RelativeLayout. and then define your greenLayout like this.
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
Look at my xml it can center all screen
<?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:orientation="vertical" >
<LinearLayout
android:id="@+id/lin_all"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
</LinearLayout>
</RelativeLayout>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
