Simple Login App Design Using Android Studio

In this tutorial i am discussing regarding a simple login App design in Android.This is simple design for login page,so java coding is not included.Also you need some images which you can download easily from the internet.

The code is very simple ,here we are using Constrain layout and Relative layout. The code is as follows:-

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:app="http://schemas.android.com/apk/res-auto"   
xmlns:tools="http://schemas.android.com/tools" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent"   
tools:context=".MainActivity">


    <ImageView     
android:id="@+id/imageView"   
android:layout_width="200dp"       
android:layout_height="219dp"       
android:layout_marginStart="141dp"       
android:layout_marginLeft="141dp"
android:layout_marginEnd="141dp"       
android:layout_marginRight="141dp"     
app:layout_constraintEnd_toEndOf="parent"       
app:layout_constraintStart_toStartOf="parent" 
      app:srcCompat="@drawable/mainlogo"       
tools:layout_editor_absoluteY="2dp" />

    <RelativeLayout       
android:id="@+id/rel1"     
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="20dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="220dp"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="200dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">


        <ImageView
android:id="@+id/imageView4"       
android:layout_width="72dp"
android:layout_height="64dp"
app:srcCompat="@drawable/user" />

        <EditText         
android:id="@+id/editText3" 
style="@android:style/Widget.AutoCompleteTextView" 
android:layout_width="match_parent"     
android:layout_height="wrap_content"     
android:layout_toRightOf="@id/imageView4" 
android:ems="10"     
android:hint="Enter Name"
android:inputType="textPersonName"         
android:paddingTop="22dp"            />

        <ImageView         
android:id="@+id/imageView5"     
android:layout_width="70dp"       
android:paddingTop="10dp"         
android:layout_below="@id/imageView4"       
android:layout_height="59dp"     
app:srcCompat="@drawable/pass" />

        <EditText   
android:id="@+id/editText4"
android:layout_width="match_parent"       
android:layout_height="wrap_content"     
android:layout_below="@id/editText3"       
android:paddingTop="30dp"       
android:layout_toRightOf="@id/imageView5"       
android:hint="Enter Password"         
android:ems="10"         
android:inputType="textPassword" />

        <Button         
android:id="@+id/button2"   
        style="@style/Widget.AppCompat.Button.Borderless.Colored" 
android:layout_width="wrap_content"         
android:layout_height="wrap_content"       
android:layout_below="@id/editText4"       
android:layout_centerInParent="true"       
android:text="Log In" />
    </RelativeLayout>

Just copy this code and paste it in your XML file.

The video of the same tutorial is also available in my youtube channel.