How to Design Transparent Login Form in Android Studio Using Java? - GeeksforGeeks

09 Sep, 2021
We will be designing a simple application in which we make a transparent login screen in our MainActivity that takes the Username and Password from the user. A sample image is given below to get an idea about what we are going to do in this article.
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. 
Step 2: Download any background image that you want to use in your application and add it to the drawable section which is a subpart of the resource folder.
fig = image file in drawable 
Step 3: Make custom buttons that you need in the application by following steps. Right-click on project name file(transparent login form in this case) -> New -> Android Resource File.
circle.xml file: 
XML
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="oval">     <corners android:radius="100dp" />    <stroke        android:width="2dp"        android:color="#ffffff" />    <size        android:width="80dp"        android:height="80dp" /> </shape>
  
custombutton.xml file:
 
XML
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <solid android:color="#3fff" />    <corners android:radius="50dp" /></shape>
  
custombutton2.xml file: 
 
XML
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android">    <solid android:color="#03A679" />    <corners android:radius="50dp" /></shape>
  
Step 4: Working with the activity_main.xml file
 
Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. 
 
XML
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout    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"    android:background="@drawable/wallpaper"    tools:context=".MainActivity">     <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="vertical"        android:background="#3fff"        android:gravity="center"        android:padding="10dp">         <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="Moon light"            android:background="@drawable/circle"            android:gravity="center"            android:textColor="#ffffff"/>        <EditText            android:layout_marginTop="15dp"            android:gravity="center"            android:layout_width="250dp"            android:layout_height="40dp"            android:hint="Username"            android:textColorHint="#FFFBF6"            android:background="@drawable/custombutton"            />        <EditText            android:layout_marginTop="15dp"            android:gravity="center"            android:layout_width="250dp"            android:layout_height="40dp"            android:hint="Password"            android:textColorHint="#FFFBF6"            android:background="@drawable/custombutton"/>            <CheckBox                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="Keep me Signed in "                android:textColor="#FFFBF6"                android:hint="#FFFBF6"                android:layout_marginTop="15dp"                android:buttonTint="#FFFBF6"            />        <Button            android:layout_width="250dp"            android:layout_height="40dp"            android:text="Signin"            android:textAllCaps="false"            android:layout_marginTop="10dp"            android:background="@drawable/custombutton2"            android:textColor="#FFFBF6"/>        <View            android:layout_width="fill_parent"            android:layout_height="2dp"            android:background="#3fff"            android:layout_marginTop="15dp"/>        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="Forget Password"            android:textSize="18dp"            android:layout_marginTop="15dp"            android:textColor="#FFFBF6"            />     </LinearLayout>     </androidx.constraintlayout.widget.ConstraintLayout>
  
Output:
 
FIG = Transparent login page 
 
Project Link: Click Here
 
sagartomar9927
Android-Studio
Android
Java
Java
Android
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Flutter - Custom Bottom Navigation Bar
How to Read Data from SQLite Database in Android?
Retrofit with Kotlin Coroutine in Android
Android Listview in Java with Example
How to Change the Background Color After Clicking the Button in Android?
Arrays in Java
Split() String method in Java with examples
For-each loop in Java
Arrays.sort() in Java with examples
Reverse a string in Java