preface

I regret writing this article because MVVM is so popular, tutorials are everywhere, and full MVVM project source code is everywhere.

MVP has been used before, plus encapsulated LCE, I feel very good use, quite reluctant to change the frame, but so popular, we have to go with The Times ah, do not learn will be eliminated.

I don’t really know what MVVM is until now. The previous MVC and MVP are well understood, but MVVM is still a little confused. If you feel I wrote something wrong after reading this article, please let me know in the comment section.

The body of the

Two days ago, white whao throw line coroutine live course, throw line said in it, THE VM of MVVM is not ViewModel, after listening to what he said, I feel the world View has been overturned, I always thought that MVVM is Model+View+ViewModel, but now tell me that it is not, DataBinding is MVVM, but I’ve seen a lot of MVVM applications that don’t use DataBinding, which is even more confusing. I personally hate using DataBinding. Personally think Android very not easy layout and logic to separate, and now like JSP all written in a piece, simple page is good, complex page nesting think of the head big, wrote a small Demo after giving up.

Guo God’s third line of code just sold quickly grabbed a signature version, inside the weather forecast actual combat App is MVVM, the introduction of MVVM in the book is as follows:

MVVM (Model+View+ViewModel) is a high-level project architecture pattern, which has been widely used in the field of Android program design. Similar architecture patterns include MVP, MVC and so on. Simply speaking, THE MVVM architecture can divide the program structure into three parts: Model is the data Model part; View is the display part of the page; ViewModel is special, it can be understood as a bridge between the data model and the interface display, so as to achieve the separation of business logic and interface display of the program structure design.

OK, good writing, but I still don’t get it.

At this time, I saw the official JetPack, which has been vigorously promoted. What? What the hell is this? JetPack is a collection of libraries that are being promoted to help us build an MVVM project and simplify the development process and code. The official JetPack diagram includes many controls:

I also according to Guo God wrote a book in the MVVM version of the weather forecast, is a little understanding of MVVM, feeling is ViewModel…… Forget it, don’t tangle this first, understand the Daniel to help share in the comments area, thank you 🙏.

Then I found a picture in the official document that is similar to the one in Guo Shen’s book about MVVM:

If you ask me what MVVM is, sorry, I don’t know!!

Began to blind to write

So far, my understanding of MVVM is that you don’t need to build your own MVP architecture in a project. There are a number of libraries (JetPack) that you can use directly, but you still need to build your own to implement LCE.

So, what should I write? I wrote a version of Flutter to play with Android when I learned about Flutter, so let’s do another one.

Let’s take a look at the app screenshot:

Due to space problems, I won’t put too many pictures, after all, it’s just learning, and it can’t be more beautiful, the pictures in the bottom of the details page are all official, because it’s too much trouble to find pictures…

The feeling of writing a complete small project is not good, many places can be optimized and extracted, and then slowly change it at leisure. Also, LiveData is really useful and feels like the heart of MVVM.

Code link

Since they say, so must implement, not to implement the problem is sorry, um… What should I write? So let’s write the search results page, the search page is very simple, you enter the keyword you want to search, click on the search page, you jump to the search results page, the search results page receives the keyword from the search page to search, very simple, right, start code code.

Let’s start with the code in the ViewModel:

class ArticleListViewModel : ViewModel() {

    val articleList = ArrayList<Article>()

    private val pageLiveData = MutableLiveData<QueryKeyArticle>()

    val articleLiveData = Transformations.switchMap(pageLiveData) { query ->
        Repository.getQueryArticleList(query.page, query.k)
    }

    fun getArticleList(page: Int, k: String) {
        pageLiveData.value = QueryKeyArticle(page, k)
    }

}

data class QueryKeyArticle(var page: Int.var k: String)
Copy the code

Here’s the code for the Activity:

viewModel.articleLiveData.observe(this, Observer {
            if (it.isSuccess) {
                val articleList = it.getOrNull()
                if(articleList ! =null) {
                    loadFinished()
                    if (page == 1 && viewModel.articleList.size > 0) {
                        viewModel.articleList.clear()
                    }
                    viewModel.articleList.addAll(articleList.datas)
                    articleAdapter.notifyDataSetChanged()
                } else {
                    showLoadErrorView()
                }
            } else {
                showBadNetworkView(View.OnClickListener {
                    getArticleList()
                })
            }
        })
Copy the code

Code logic is very simple, to observe the Activity, you have to change to use in the ViewModel getArticleList method tells the ViewModel data needs to be changed, and then through the Transformations. Updating LiveData switchMap, After the update, Activit can receive notification and make corresponding changes. If there are any errors, it can handle them.

conclusion

Well, that’s roughly what I understand MVVM to be.

Finally, the project’s Github address is github.com/zhujiang521… .

If you feel helpful, please point a Star, or point a concern, or point a praise also ah, of course, all point the best 😂.

Ah, or did not understand MVVM, pure blind writing, there is a problem please do not leave the kindness to point out, thank you.