Android-Login-UI diffrent design

Simple Mobile Login UI Design Android Studio with Java and XML

The constraint layout used here.

Some screen-shots running through the Pixel_2_API_25 emulator

MainActivity.java

package com.example.loginui;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}

activity_main.xml

<?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"

android:background="@drawable/background"

tools:context=".MainActivity">

<com.google.android.material.textfield.TextInputLayout

android:id="@+id/txtUsername"

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

android:layout_width="271dp"

android:layout_height="63dp"

android:layout_marginStart="70dp"

android:layout_marginTop="240dp"

android:layout_marginEnd="70dp"

android:hint="Username"

android:textColorHint="#A7A7A7"

app:boxStrokeColor="#EAEAEE"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent">

<com.google.android.material.textfield.TextInputEditText

android:id="@+id/inputUsername"

android:layout_width="match_parent"

android:layout_height="55dp"

android:textColor="#5B5B5B"

android:textSize="15sp"

android:textStyle="bold"

tools:ignore="TouchTargetSizeCheck" />

</com.google.android.material.textfield.TextInputLayout>

<com.google.android.material.textfield.TextInputLayout

android:id="@+id/txtPassword"

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

android:layout_width="271dp"

android:layout_height="63dp"

android:layout_marginStart="70dp"

android:layout_marginTop="310dp"

android:layout_marginEnd="70dp"

android:hint="Password"

android:textColorHint="#A7A7A7"

app:endIconMode="password_toggle"

app:boxStrokeColor="#EAEAEE"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent">

<com.google.android.material.textfield.TextInputEditText

android:id="@+id/inputPassword"

android:layout_width="match_parent"

android:layout_height="55dp"

android:textColor="#5B5B5B"

android:textSize="15sp"

android:textStyle="bold"

tools:ignore="TouchTargetSizeCheck" />

</com.google.android.material.textfield.TextInputLayout>

<Button

android:id="@+id/button4"

android:layout_width="271dp"

android:layout_height="55dp"

android:layout_marginTop="200dp"

android:text="LOGIN"

android:textAlignment="center"

android:textColor="#FFFFFF"

android:textSize="16sp"

android:textStyle="bold"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent" />

<TextView

android:id="@+id/textView4"

android:layout_width="139dp"

android:layout_height="15dp"

android:layout_marginStart="70dp"

android:layout_marginTop="8dp"

android:layout_marginEnd="283dp"

android:text="Don't have account?"

android:textColor="#A7A7A7"

android:textSize="13sp"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintHorizontal_bias="0.0"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toBottomOf="@+id/button4" />

<TextView

android:id="@+id/textView6"

android:layout_width="135dp"

android:layout_height="16dp"

android:layout_marginStart="7dp"

android:layout_marginTop="8dp"

android:layout_marginEnd="68dp"

android:text="Create a new account"

android:textColor="#3BA8BE"

android:textSize="12sp"

android:textStyle="bold"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toEndOf="@+id/textView4"

app:layout_constraintTop_toBottomOf="@+id/button4" />

<TextView

android:id="@+id/textView7"

android:layout_width="286dp"

android:layout_height="66dp"

android:text="MOBILE APPLICATION DEVELOPMENT"

android:textAlignment="center"

android:textColor="#4E4E4E"

android:textSize="24sp"

android:textStyle="normal|bold"

app:layout_constraintBottom_toTopOf="@+id/txtUsername"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintHorizontal_bias="0.496"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintVertical_bias="0.407" />

<TextView

android:id="@+id/textView8"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginStart="228dp"

android:layout_marginTop="6dp"

android:layout_marginEnd="70dp"

android:text="Forgot Password?"

android:textColor="#3BA8BE"

app:layout_constraintBottom_toTopOf="@+id/button4"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toBottomOf="@+id/txtPassword" />

</androidx.constraintlayout.widget.ConstraintLayout>

ic_launcher_background.xml

<?xml version="1.0" encoding="utf-8"?>

<vector xmlns:android="http://schemas.android.com/apk/res/android"

android:width="108dp"

android:height="108dp"

android:viewportWidth="108"

android:viewportHeight="108">

<path

android:fillColor="#3DDC84"

android:pathData="M0,0h108v108h-108z" />

<path

android:fillColor="#00000000"

android:pathData="M9,0L9,108"

android:strokeWidth="0.8"