In the previous chapters we have implemented the user interface for all of our screens. In the very last chapter we have implemented the the repository for the queries of the Firebase authentication, and the ViewModel together with the LiveDatas and MutableLiveDatas. Because we want to have the FirebaseViewModel::class as singleton class in the whole app, we gonna add to our app the Koin library, which is a dependency injection framework.
For the interface we made an implementation also, where we have the queries for the authentication and for the Firestore “users” collection, where we are going to store some more information about the users. These informations are stored during the run of the application in a User data class.
What is still missing, is the usage of the ViewModel, which will be responsible to get the data from the repository and notify the user interface about the changes and vice versa. Call the functions after the users’ interactions in the app.
The user first has to provide the name, email and password. When the user clicks on the “Register” button, then some validation functions will be called, and these will check the correctness of the fields. When the texts are ok, then the process will be continued with the Firebase authentication. When the result was successful, then the user gonna be saved with the name in Firestore as well.
Why we will create for this application the icon? In programming it is very important to practice what we have learned, otherwise we gonna forget them.
If you made the tutorial of Teki, then there you saw that we have made also an icon for the game. This chapter will be very similar for this.
In this chapter of the Firebase authentication tutorial we will build up the user interface of the SpalshActivity using ConstraintLayout.
For all UIs we gonna use ConstraintLayout. It is an android.view.ViewGroup which allows us to position and size widgets in a flexible way.
ConstraintLayout allows us to create large and complex layouts with a flat view hierarchy (no nested view groups). It is similar to RelativeLayout in that all views are laid out according to relationships between sibling views and the parent layout, but it’s more flexible than RelativeLayout and easier to use with Android Studio’s Layout Editor.
ConstraintLayout, which is now the default layout in Android Studio, gives us many ways to place objects. We can constrain them to their container, to each other or to guidelines. This allows us to create large, complex, dynamic and responsive views in a flat hierarchy. It even supports animations!