Android login screen using jetpack compose [Part-2]

MaKB
2 min readApr 8, 2022

--

In this part we will add some more screens and will create some common components as well to reuse them across the app.

Configuration used while creating this post — ,

  • Compose version : 1.1.0-alpha06
  • Kotlin version: 1.5.31
  • Android studio : Android Studio Bumblebee | 2021.1.1 Patch 3

Step 1 : Let’s create common TopAppBar component first. create new package named component\ inside this package create new file and named it as component\CustomTopAppBar.kt Paste below code snippet in this file

Step 2: Create new file screen\SignUp.kt and add below code in it

Step 3: Create new file screen\ForgotPassword.kt and add below code in it

Step 4: Now we will add navigation for above screens we just created. In order to do that update ScreenMain.kt with below code

Step 5: To navigate to signup screen from Login screen add below code to onClick of sign up text in Login.kt.

Step 6: To navigate to ForgotPassword screen from Login screen add below code to onClick of forgot password text in Login.kt.

That’s it, you are done with Login UI using jetpack compose.

Find complete code on GitHub, Don’t forget to follow 😊

Please follow to get updated posts and hit like to motivate me

Thanks 😊🙏

If this post was helpful, please click the clap 👏 button below a few times to show your support!

--

--

MaKB
MaKB

Written by MaKB

Experienced software engineer with demonstrated history of working in telecommunications industry along with many other sectors like education, e-commerce etc.

No responses yet