Android App Development | Lecture#22 | Hive Learners
𝓖𝓻𝓮𝓮𝓽𝓲𝓷𝓰𝓼
Hello dear Learners, I hope you all are well. Today we will cover the sign-in page in a new activity. We will create a new Empty Activity in our project and design the sign-in page with a forget password button. So let's start with lecture 22. I hope you will learn something new today. Creating a new activity is very important to add multiple screens to our Android App.
GitHub Link
Use this GitHub project to clone into your directory. It will constantly get updated in the following lecture so you will never miss the latest code. Happy Coding!.
What Should I Learn
- Create a new Empty Activity
- Design Sign-in screen
Assignment
- Create a sign-in activity and layout
Procedure
Firstly, we need to add a new Empty Activity in our project. Follow the screenshot steps to add the activity correctly. Also, set the activity name accordingly.
Set the name of the sign-in activity as shown in this screenshot. Don't add any special character to the name. You can use the same name.
Now open the design activity of the sign-in page by going to this location as shown in the screenshot. Here we design in sign-in page.
On this sign-in page, I use the password toggle and input type password text. This will add the dots when a user typing the password. Here is the activity_sign_in.xml
code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:text="Sign In"
android:textSize="26sp"
android:textStyle="bold" />
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter Your Email"
app:boxStrokeColor="@color/black"
app:boxStrokeWidth="1dp">
<EditText
android:id="@+id/signin_email_et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="SpeakableTextPresentCheck" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:hint="Enter Your Password"
app:boxStrokeColor="@color/black"
app:boxStrokeWidth="1dp"
app:passwordToggleEnabled="true">
<EditText
android:id="@+id/signin_pass_et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
tools:ignore="SpeakableTextPresentCheck,SpeakableTextPresentCheck" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.button.MaterialButton
android:id="@+id/signin_btn"
style="@style/Widget.AppCompat.Button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:backgroundTint="#2196F3"
android:text="Sign In"
android:textColor="@color/white"
app:cornerRadius="4dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/forget_pass_btn"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="35dp"
android:layout_gravity="right"
android:background="@null"
android:text="Forget Password"
android:textColor="@color/black"
android:textSize="14sp"
app:backgroundTint="@null"
tools:ignore="TouchTargetSizeCheck" />
</LinearLayout>
</LinearLayout>
Now we also need to declare and initialize the widgets in the sign-up and sign in their java file. Also, implement the button listener.
package com.example.hivelearners2;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import com.google.android.material.button.MaterialButton;
public class SignIn_Activity extends AppCompatActivity {
EditText email_et, pass_et;
MaterialButton signin_btn, forget_pass_btn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_sign_in);
email_et = findViewById(R.id.signin_email_et);
pass_et = findViewById(R.id.signin_pass_et);
signin_btn = findViewById(R.id.signin_btn);
forget_pass_btn = findViewById(R.id.forget_pass_btn);
signin_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
}
});
forget_pass_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
}
});
}
}
package com.example.hivelearners2;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.transition.Fade;
import android.transition.Transition;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import com.google.android.material.button.MaterialButton;
public class MainActivity extends AppCompatActivity {
EditText name_et, email_et, pass_et, confirm_pass_et;
MaterialButton signup_btn, already_act_btn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
name_et = findViewById(R.id.signup_name_et);
email_et = findViewById(R.id.signup_email_et);
pass_et = findViewById(R.id.signup_pass_et);
confirm_pass_et = findViewById(R.id.signup_confirm_pass_et);
signup_btn = findViewById(R.id.signup_btn);
already_act_btn = findViewById(R.id.already_act_btn);
signup_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});
already_act_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});
}
}
Interesting the code for multiple screens!
!1UP
You have received a 1UP from @gwajnberg!
@stem-curator
And they will bring !PIZZA 🍕.
Learn more about our delegation service to earn daily rewards. Join the Cartel on Discord.
Thanks for your contribution to the STEMsocial community. Feel free to join us on discord to get to know the rest of us!
Please consider delegating to the @stemsocial account (85% of the curation rewards are returned).
You may also include @stemsocial as a beneficiary of the rewards of this post to get a stronger support.