Gain insights into MVVM architecture in Android with Kotlin. Learn about networking with Retrofit, local storage with Room, and pagination. Discover how to build scalable, maintainable apps.

Mastering MVVM architecture with Kotlin-01.png

tarball.tar.gz

postman

The course focuses on the MVVM (Model-View-ViewModel) architecture in Android development using Kotlin. The MVVM is widely recommended due to its robustness, scalability, and ease of maintenance. It is a valuable skill to have for building high-performance Android applications.

Firstly, you will learn the basics of MVVM architecture and its advantages over other approaches to Android development. Then, you'll start from scratch and create layouts for a news application. Next, you'll use the Retrofit and OkHttp networking libraries and get to familiarize yourself with APIs. You'll get hands-on experience in storing data locally via the Room library. Finally, you'll be introduced to both the repository and ViewModel patterns, as well as how to work with the Paging library and deliver data to our fragments.

By the time you’re done with the course, you’ll be able to use MVVM in your Android projects, interact with APIs, store data locally, and implement pagination.

Mastering MVVM Architecture in Android Development using Kotlin

# Setting up navigation components

In this lesson, we’ll learn how to set up navigation components in our activities. Since we’ve already connected our bottom navigation bar to the navigation graph, we’ll use the components to create different destinations for the navigation drawer.



# Adding destinations to the navigation drawer

To comprehend what’s happening, we will go line by line, providing a proper explanation for each one.

The code block below represents the `NewsActivity` class we created earlier. Let’s go through the navigation `drawerLayout` setup.



package com.example.globalnewsapp.ui

import android.content.Intent
import android.content.Intent.ACTION_VIEW
import android.net.Uri
import android.os.Bundle
import android.view.MenuItem
import androidx.appcompat.app.ActionBarDrawerToggle
import androidx.appcompat.app.AppCompatActivity
import androidx.lifecycle.ViewModelProvider
import androidx.navigation.fragment.NavHostFragment
import androidx.navigation.ui.setupWithNavController
import com.example.globalnewsapp.R
import com.example.globalnewsapp.databinding.ActivityNewsBinding
import com.example.globalnewsapp.db.ArticleDatabase
import com.example.globalnewsapp.repository.NewsRepository
import com.example.globalnewsapp.ui.viewmodel.NewsViewModel
import com.example.globalnewsapp.ui.viewmodel.NewsViewModelProvider

class NewsActivity : AppCompatActivity() {
    lateinit var toggle: ActionBarDrawerToggle

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val binding = ActivityNewsBinding.inflate(layoutInflater)
        setContentView(binding.root)

        setUpNavigation(binding)

        toggle = ActionBarDrawerToggle(this, binding.drawerLayout, R.string.open, R.string.close)
        binding.drawerLayout.addDrawerListener(toggle)
        toggle.syncState()
        supportActionBar?.setDisplayHomeAsUpEnabled(true)
        binding.navMenu.itemIconTintList = null

        binding.navMenu.setNavigationItemSelectedListener {
            when (it.itemId) {
                R.id.github_repo ->
                    startActivity(
                        Intent(
                            ACTION_VIEW,
                            Uri.parse("https://github.com/Peter-cloud-web/GlobalNewsApp")
                        )
                    )
                R.id.developer ->
                    startActivity(
                        Intent(
                            ACTION_VIEW,
                            Uri.parse("https://t.co/Y6b7mMOtRr?amp=1")
                        )
                    )
            }
            true
        }

    }

    override fun onOptionsItemSelected(item: MenuItem): Boolean {
        if (toggle.onOptionsItemSelected(item)) {
            return true
        }
        return super.onOptionsItemSelected(item)
    }

    private fun setUpNavigation(binding: ActivityNewsBinding) {
        val navHostFragment = supportFragmentManager.findFragmentById(R.id.newsNavHostFragment) as NavHostFragment
        val navController = navHostFragment.navController
        binding.bottomNavigationView.setupWithNavController(navController)

    }
}

```
 toggle = ActionBarDrawerToggle(this, binding.drawerLayout, R.string.open, R.string.close)
```

In the code snippet above, we created an instance of the `ActionBarDrawerToggle`, which provides a way to tie together the `drawerLayout` and the action bar so they’re in sync and can provide seamless app navigation to different destinations.

Within its constructor, we provide the activity using the keyword `this`, then reference our `drawerLayout` ID using `ViewBinding.`We describe our open/close mechanism for opening and closing the `drawerLayout` using a string resource as described in the string file in the resource folder.

```
  binding.drawerLayout.addDrawerListener(toggle)
```
 In the code snippet above, we provide a `drawerlistener` to our navigation drawer to listen and monitor events and actions from the user, like opening and closing the `drawerLayout`. We do this by passing `toggle` as an argument to the `addDrawerListener()` method.


``` 
 toggle.syncState()
        supportActionBar?.setDisplayHomeAsUpEnabled(true)
        binding.navMenu.itemIconTintList = null
```
The `toggle.syncState()` method is used to animate the arrow on the `ActionBar` by rotating it to display an arrow icon when the `drawerLayout` is open and a drawer icon when closed. Try it out in our app and observe what happens. This way, you’ll have a better understanding of how each line of code affects the overall functionality of the application.

Then, we set the `setDisplayHomeAsEnabled()` method to `True,` which is used to display an icon that’s used to return the user to the home screen of the application when it is clicked.

The menu items can have a tint around them that affects the original color of the items, mostly slightly affected by the color of the parent view. To avoid this color tint in our items, we set the view to null.

In the lines of code below, we have the `when` case blocks, which have intents that open different destinations outside the application.
 

```binding.navMenu.setNavigationItemSelectedListener {
            when (it.itemId) {
                R.id.github_repo ->
                    startActivity(
                        Intent(
                            ACTION_VIEW,
                            Uri.parse("https://github.com/Peter-cloud-web/GlobalNewsApp")
                        )
                    )
                R.id.developer ->
                    startActivity(
                        Intent(
                            ACTION_VIEW,
                            Uri.parse("https://t.co/Y6b7mMOtRr?amp=1")
                        )
                    )
            }
            true
        }

    }
```
The first one opens the GitHub account of the developer, while the second one opens the bio of the developer. We can replace this with our own personal links.


Learn how to integrate navigation components in our activities.

Introduction

MVVM Architecture

Layouts

Layout Design Assessment

API

Android Web Services Assessment

Utility Classes

Repository Pattern

ViewModel Pattern

Android Business Logic Assessment

Views

Conclusion

Appendix

News Activity

Setting up navigation components

Adding destinations to the navigation drawer