How to Create Material Design Signup Form in Android Studio & User Login and registration with username and password in Android studio. Create beautiful login screen – Android Studio Tutorial Android Apps | Login Screen. Simple Login App Tutorial Using Android Studio | UI Design. Android Studio Tutorial
How to Create Beautiful Android Login Form – Material Design signup form in Android Studio Tutorial – Firebase Authentication User Login with Email & Password.
Table of Contents
Drawable Folder Download – CLICK HERE
ADD DEPENDENCY IN BUILD.APP
implementation 'androidx.cardview:cardview:1.0.0'gradle.app
apply plugin: 'com.android.application'
android {
compileSdkVersion 30
buildToolsVersion "30.0.2"
defaultConfig {
applicationId "com.technic.signupform"
minSdkVersion 21
targetSdkVersion 30
versionCode 1
versionName "1.0"
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'androidx.appcompat:appcompat:1.2.0'
implementation 'androidx.constraintlayout:constraintlayout:2.0.2'
implementation 'androidx.cardview:cardview:1.0.0'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'androidx.test.ext:junit:1.1.2'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.3.0'
}ActivitySignUp.java
package com.technic.signupform;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
public class Activity_SignUp extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_sign_up);
}
}
YOUTUBE VIDEO
material design Signup forms layout xml file
activity_sign_up.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".Activity_SignUp">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginBottom="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="20dp"
app:cardCornerRadius="10dp"
app:cardElevation="3dp"
app:cardPreventCornerOverlap="false"
app:cardUseCompatPadding="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="@+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginTop="20dp"
android:background="@drawable/circle"
android:padding="10dp"
android:src="@drawable/img_register"
app:tint="@color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:layout_marginTop="10dp"
android:fontFamily="sans-serif-medium"
android:text="REGISTER"
android:textColor="@color/white"
android:textSize="22sp" />
</LinearLayout>
<ImageView
android:id="@+id/imageView1"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_below="@+id/linearLayout1"
android:layout_centerHorizontal="true"
android:layout_marginTop="-10dp"
android:rotation="45"
android:src="@drawable/square" />
<RelativeLayout
android:id="@+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/imageView1"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="30dp">
<ImageView
android:id="@+id/imgView_userIcon"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@color/colorPrimary"
android:padding="8dp"
android:src="@drawable/img_user"
app:tint="@color/white" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imgView_userIcon"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imgView_userIcon"
android:background="@color/editTextBG"
android:hint="Username"
android:paddingLeft="20dp"
android:textSize="15sp" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/relativeLayout1"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="15dp">
<ImageView
android:id="@+id/imgView_passwordIcon"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@color/colorPrimary"
android:padding="8dp"
android:src="@drawable/img_authentication"
app:tint="@color/white" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imgView_passwordIcon"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imgView_passwordIcon"
android:background="@color/editTextBG"
android:hint="Password"
android:inputType="textPassword"
android:paddingLeft="20dp"
android:textSize="15sp" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/relativeLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/relativeLayout2"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="15dp">
<ImageView
android:id="@+id/imgView_repasswordIcon"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@color/colorPrimary"
android:padding="8dp"
android:src="@drawable/img_authentication"
app:tint="@color/white" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imgView_repasswordIcon"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imgView_repasswordIcon"
android:background="@color/editTextBG"
android:hint="Re-type Password"
android:inputType="textPassword"
android:paddingLeft="20dp"
android:textSize="15sp" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/relativeLayout4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/relativeLayout3"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="15dp">
<ImageView
android:id="@+id/imgView_emailIcon"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@color/colorPrimary"
android:padding="8dp"
android:src="@drawable/img_email"
app:tint="@color/white" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imgView_emailIcon"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imgView_emailIcon"
android:background="@color/editTextBG"
android:hint="Email"
android:paddingLeft="20dp"
android:textSize="15sp" />
</RelativeLayout>
<CheckBox
android:id="@+id/chkBox1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/relativeLayout4"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="15dp"
android:fontFamily="sans-serif"
android:text="I agree to the Terms of Service"
android:textColor="@color/textColor" />
<Button
android:id="@+id/btn_signUp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/chkBox1"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="15dp"
android:background="@color/colorPrimary"
android:fontFamily="sans-serif-medium"
android:text="SIGN UP"
android:textColor="@color/white" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/btn_signUp"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:layout_marginBottom="15dp"
android:background="@color/transparent"
android:fontFamily="sans-serif"
android:text="Already a member? Login Here"
android:textAllCaps="false"
android:textColor="@color/textColor"
android:textSize="13sp" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
</RelativeLayout>
Material Design Signup Forms
Download Source Code
Click below to get the full source code android login Application Android Project application.
Drawable Folder Download – CLICK HERE
Get the full source code android sign up form App Android Project application.
Cheers!
READ MORE ANDROID APPS
Wallpaper Android App- CLICK HERE
All IN ONE Status Saver App – CLICK HERE
Photo Video Maker Android App – CLICK HERE
Video Downloader Android App – CLICK HERE
College Student Portal System App – CLICK HERE
Call Recorder Android App – CLICK HERE
PDF App with firebase – CLICK HERE
BarChart Graph App – CLICK HERE
PDF Reader App with firebase – CLICK HERE
ShareIt Clone App – CLICK HERE
Modern Profile UI Design – CLICK HERE
Don’t Forget to Share this Post.
ShareTweetShare
