Let's develop the signup user interface. First, we have to implement the necessary views, starting from the layout of SignUpActivity. We do not need much in terms of elements for our SignUpActivity layout. We need three input fields to take the username, password, and phone number of a user to be registered. In addition, we need a button to submit the signup form as well as a progress bar to show when the signup is in progress.

The following is our activity_sign_up.xml layout:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
    tools:context=".ui.signup.SignUpActivity"
    android:paddingTop="@dimen/default_padding"
    android:paddingBottom="@dimen/default_padding"
    android:paddingStart="@dimen/default_padding"
    android:paddingEnd="@dimen/default_padding"
    android:orientation="vertical"
    android:gravity="center_horizontal">
    <EditText
        android:id="@+id/et_username"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/username"
        android:inputType="text"/>
    <EditText
        android:id="@+id/et_phone"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/default_margin"
        android:hint="@string/phone_number"
        android:inputType="phone"/>
    <EditText
        android:id="@+id/et_password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/default_margin"
        android:hint="@string/password"
        android:inputType="textPassword"/>
    <Button
        android:id="@+id/btn_sign_up"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/default_margin"
        android:text="@string/sign_up"/>
    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/default_margin"
        android:visibility="gone"/>
</android.support.constraint.ConstraintLayout>

The visual translation of the XML layout written earlier is as follows:

As you can see, the layout we designed contains all the necessary elements we previously mentioned.