In the below example I have created login page layout. Here I have used first Main LinearLayout all attributes design with in Main LinearLayout. Then I have used ScollView for scrolling page up and down and all attributes like Logo image, textview, editview, button etc divided in diffrent LinearLayout.
See the below layout code it will clearly described you to create Login Screen Design.
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".LoginActivity"
android:background="@drawable/login_bg"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/ivLogo"
android:src="@drawable/logo"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="35dp"
android:layout_marginRight="35dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/textFields"
android:layout_gravity="center_horizontal"
android:orientation="vertical"
android:layout_marginTop="100dp">
<TextView
android:id="@+id/tvLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textSize="40dp"
android:text="@string/login"
android:layout_marginTop="75dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical"
android:layout_marginTop="10dp"
android:layout_marginLeft="35dp"
android:layout_marginRight="35dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/userNmae">
<ImageView
android:id="@+id/ivName"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="@drawable/name_ic"
android:paddingTop="4dp"/>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/ivName"
android:id="@+id/editName"
android:hint="User Name"
android:focusable="true"
android:textColorHighlight="#ff7eff15"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="8dp"
android:id="@+id/userPass">
<ImageView
android:id="@+id/ivPass"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="@drawable/password_key"
android:paddingTop="9dp"/>
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/ivPass"
android:id="@+id/editPass"
android:hint="Password"
android:focusable="true"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/OtherFields"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:weightSum="2"
android:orientation="horizontal">
<RelativeLayout
android:orientation="vertical"
android:id="@+id/rlRememberCheck"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_alignParentRight="true">
<ImageView
android:id="@+id/chck"
android:src="@drawable/tick"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true" />
<TextView
android:id="@+id/remeber"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:textSize="20dp"
android:text="@string/remember_me"
android:layout_toRightOf="@+id/chck"
android:layout_centerVertical="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_vertical">
<TextView
android:id="@+id/tvForgotPassword"
android:layout_width="wrap_content"
android:textSize="20dp"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:text="@string/forgot_password" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/btn_Login">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/ivLogin"
android:scaleType="fitXY"
android:layout_gravity="center_horizontal"
android:src="@drawable/login_btn"
android:layout_marginLeft="35dp"
android:layout_marginRight="35dp"
android:layout_marginTop="10dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/btn_Facebook">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/ivFacebook"
android:scaleType="fitXY"
android:layout_gravity="center_horizontal"
android:src="@drawable/fb_btn"
android:layout_marginLeft="35dp"
android:layout_marginRight="35dp"
android:layout_marginTop="10dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="@+id/btn_register">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="@drawable/register_here"
android:id="@+id/ivRegister" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
0 Comment(s)