Login Page Design in Android Studio using Xml || Ui Design In Android Studio Using Xml.
What is a Login Page ?
login page is a web page that prompts users to enter their login , such as a username and password, in order to gain access to a secure area of a application.Typically, the login page will verify the user's credentials against a database of authorized users and, if successful, grant the user access to their account or the protected content on the website or application.Login pages are commonly used on applications that require some level of authentication, such as email services, social media platforms, online banking and e-commerce websites. They are an important security , helping to protect users' personal information and prevent unauthorized access to sensitive data
Download background Image:
Add the color in the colors.xml file as given:
<color name="colour1">#EFE5E5</color>
<color name="colour2">#8692F7</color>
<color name="colour3">#E8DADA</color>
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#ffffffff"/>
<stroke android:width="3dp"
android:color="@color/colour1" />
<padding android:left="1dp"
android:top="1dp"
android:right="1dp"
android:bottom="1dp" />
<corners android:radius="20dp" />
</shape>
Rounded Corner (2) Code :
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#ffffffff"/>
<stroke android:width="3dp"
android:color="@color/colour2" />
<padding android:left="1dp"
android:top="1dp"
android:right="1dp"
android:bottom="1dp" />
<corners android: radius="18dp" />
</shape>
Login Page (Login Activity):
<?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"
android:background="@drawable/background"
tools:context=".LoginActivity">
<LinearLayout
android:id="@+id/from_layout"
android:layout_width="350dp"
android:layout_height="260dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="240dp"
android:backgroundTint="@color/colour3"
android:orientation="vertical"
android:gravity="center_horizontal"
android:background="@drawable/rounded_corner">
<EditText
android:id="@+id/emai_id"
android:layout_width="270dp"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:hint=" Email Id"
android:background="@drawable/rounded_corner2"
/>
<EditText
android:id="@+id/pass_word"
android:layout_width="270dp"
android:layout_height="50dp"
android:layout_marginTop="13dp"
android:hint=" Password"
android:background="@drawable/rounded_corner2"
/>
<android.appcompat.widget.AppCompatButton
android:id="@+id/login_btn"
android:layout_width="270dp"
android:layout_height="50dp"
android:layout_marginTop="23dp"
android:backgroundTint="@color/colour2"
android:background="@drawable/rounded_corner2"
android:text="Login"
android:textColor="@color/black"
android:textSize="18sp"
/>
</LinearLayout>
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/from_layout"
android:layout_marginTop="30dp"
android:layout_centerHorizontal="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="No Any Account?"
android:textSize="15sp"
/>
<TextView
android:id="@+id/login_text_view_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:textSize="17sp"
android:textColor="@color/black"
android:textStyle="bold"
/>
</LinearLayout>
</RelativeLayout>
Output
टिप्पणियाँ
एक टिप्पणी भेजें