Prerequisite: How to Connect Android App with Back4App?
We have seen adding Back4App in our Android App. In this article, we will take a look at adding a User Registration form in Android App so that users can register themselves in the app.
What we are going to build in this article?
We will be building a simple application in which we will be adding a simple user registration form so that users can register themselves with their username and password. Below is the video in which we will get to see what we are going to build in this article.
Step by Step Implementation
This article is the continuation of How to Connect Android App with Back4App.
Step 1: 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"?><RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <!--text view for heading--> <TextView android:id="@+id/idTVHeader" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="30dp" android:gravity="center_horizontal" android:padding="5dp" android:text="Welcome to Geeks for Geeks \n Register Form" android:textAlignment="center" android:textColor="@color/purple_700" android:textSize="18sp" /> <!--edit text for user name--> <EditText android:id="@+id/idEdtUserName" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/idTVHeader" android:layout_marginStart="10dp" android:layout_marginTop="50dp" android:layout_marginEnd="10dp" android:hint="Enter UserName" android:inputType="textEmailAddress" /> <!--edit text for user password--> <EditText android:id="@+id/idEdtPassword" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/idEdtUserName" android:layout_marginStart="10dp" android:layout_marginTop="20dp" android:layout_marginEnd="10dp" android:hint="Enter Password" android:inputType="textPassword" /> <!--button to register our new user--> <Button android:id="@+id/idBtnRegister" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/idEdtPassword" android:layout_marginStart="10dp" android:layout_marginTop="20dp" android:layout_marginEnd="10dp" android:text="Register User" android:textAllCaps="false" /></RelativeLayout> |
Step 2: Creating a new activity to redirect our user after registration
Navigate to the app > java > your app’s package name > Right-click on it > New > Empty Activity and name it as HomeActivity. or you may also refer to this article How to Create New Activity in Android Studio?
Step 3: Working with the activity_home.xml file
Navigate to the app > res > layout > activity_home.xml file and add the below code to it.
XML
<?xml version="1.0" encoding="utf-8"?><RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".HomeActivity"> <!--text view for displaying heading--> <TextView android:id="@+id/idTVHeader" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:gravity="center_horizontal" android:text="Welcome to Geeks for Geeks" android:textAlignment="center" android:textColor="@color/purple_700" android:textSize="18sp" /> <!--text view for displaying user name--> <TextView android:id="@+id/idTVUserName" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/idTVHeader" android:layout_centerInParent="true" android:layout_marginTop="20dp" android:gravity="center_horizontal" android:text="UserName" android:textAlignment="center" android:textColor="@color/purple_700" android:textSize="25sp" /></RelativeLayout> |
Step 4: Working with the HomeActivity.java file
Navigate to the app > java > your app’s package name > HomeActivity.java file and add the below code to it. Comments are added inside the code to understand the code in more detail.
Java
import android.os.Bundle;import android.widget.TextView;import androidx.appcompat.app.AppCompatActivity;public class HomeActivity extends AppCompatActivity { // creating a variable for our text view.. private TextView userNameTV; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_home); // initializing our variables userNameTV = findViewById(R.id.idTVUserName); // getting data from intent. String name = getIntent().getStringExtra("username"); // setting data to our text view. userNameTV.setText(name); }} |
Step 5: Working with the MainActivity.java file
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
Java
import android.content.Intent;import android.os.Bundle;import android.text.TextUtils;import android.view.View;import android.widget.Button;import android.widget.EditText;import android.widget.Toast;import androidx.appcompat.app.AppCompatActivity;import com.parse.ParseException;import com.parse.ParseUser;import com.parse.SignUpCallback;public class MainActivity extends AppCompatActivity { // creating variables for our edit text and buttons. private EditText userNameEdt, passwordEdt; private Button registerBtn; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // initializing our edit text and buttons. userNameEdt = findViewById(R.id.idEdtUserName); passwordEdt = findViewById(R.id.idEdtPassword); registerBtn = findViewById(R.id.idBtnRegister); // adding on click listener for our button. registerBtn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // on below line we are getting data from our edit text. String userName = userNameEdt.getText().toString(); String password = passwordEdt.getText().toString(); // checking if the entered text is empty or not. if (TextUtils.isEmpty(userName) && TextUtils.isEmpty(password)) { Toast.makeText(MainActivity.this, "Please enter user name and password", Toast.LENGTH_SHORT).show(); } // calling a method to register a user. registerUser(userName, password); } }); } private void registerUser(String userName, String password) { // on below line we are creating // a new user using parse user. ParseUser user = new ParseUser(); // Set the user's username and password, // which can be obtained from edit text user.setUsername(userName); user.setPassword(password); // calling a method to register the user. user.signUpInBackground(new SignUpCallback() { @Override public void done(ParseException e) { // on user registration checking if // the error is null or not. if (e == null) { // if the error is null we are displaying a toast message and // redirecting our user to new activity and passing the user name. Toast.makeText(MainActivity.this, "User Registered successfully", Toast.LENGTH_SHORT).show(); Intent i = new Intent(MainActivity.this, HomeActivity.class); i.putExtra("username", userName); startActivity(i); } else { // if we get any error then we are logging out // our user and displaying an error message ParseUser.logOut(); Toast.makeText(MainActivity.this, "Fail to Register User..", Toast.LENGTH_SHORT).show(); } } }); }} |
Now run your app and see the output of the app.
Output:
Check out the project on the below link: https://github.com/ChaitanyaMunje/GFG-Back4App/tree/RegisterUser
