Refactoring source code construction
– Android TV app hands on Tutorial 14

Refactoring

I have explained Android TV specific UI implementations (sample source code referenced from Android TV sample application) through this tutorial. So I conclude this project by reorganizing the source code files. I did refactoring based on the role of each classes, and finished with below structure.

  • com.corochann.androidtvapptutorial
    • common – common functions. This module has no dependency of this application’s specific implementation so that you can “re-use” the code in other project as well.
      •  PlaybackController
      • Utils
    • datathe data set of “Model”
      • MovieProvider
    • model “Model” part of MVP architecture
      • Movie
    • recommendationRecommendation function part
      • RecommendationBuilder
      • RecommendationFactory
    • ui UI handling modules (Activity & Fragments)
      • MainActivity & MainFragment
      • DetailsActivity & VideoDetailsFragment
      • PlaybackOverlayActivity & PlaybackOverlayFragment
      • SearchActivity & SearchFragment
      • ErrorActivity & ErrorFragment
      • GuidedStepActivity
        • presenter – “Presenter” part of MVP architecture
          • CardPresenter
          • (GridItemPresenter) * It is defined in MainFragment, but you may move to here.
          • DescriptionPresenter
          • DetailsDescriptionPresenter
        • view – “View” part of MVP architecture
          •  Nothing in this Tutorial. Custom designed View came this place. For example, ImageCardView will be placed here, if it is not provided by Leanback support library.
        • background – The modules which handles background. It is also a commonly useful modules.
          • SimpleBackgroundManager
          • PicassoBackgroundManager

I continue little supplemental explanation below.

UI handling modules

At first, I want to differentiate the part which handles UI and doesn’t. The modules which is updating UI is the following,

  • ~Activity – Main component of constituting current Activity.
  • ~Fragment – Fragment supports UI of Activity by  filling up specific sub-component.
  • ~Presenter – Presenter defines how to show specific “item”, which is explained detail later.

Let’s make new package “ui” and replace above inside this package. It can be done by right click on package name → New → Package → type “ui”. Then new folder “ui” appears in your Android studio.

Model-View-Presenter (MVP) architectural pattern

Through this tutorial, we are using Movie class as a item to show, and we are displaying its instance with ImageCardView. It is achieved by the mediator CardPresenter which specifies how to show this Movie instance to ImageCardView.

This architecture is called Model-View-Presenter (MVP) architectural pattern. Model is the definition of item to handle it as “object” which is a base of Object Oriented Programming, View is the actual UI to show this item, and Presenter intermediates Model and View. 

In our case, we can write this correspondence.

Model String Movie
View TextView ImageCardView
Presenter GridItemPresenter CardPresenter

If you have the experience of Web application development, you will probably remind Model-View-Controller (MVC) pattern, (especially for ruby on rails developer). Below is the comparison between MVC & MVP

MVC

testing_methodologies_mvc

MVP

testing_methodologies_mvp

Cite from http://www.gwtproject.org/articles/testing_methodologies_using_gwt.html

Model, View and Presenter for each module are separated to each modules after refactoring. I put View and Presenter in “ui” package since it is changing UI.

References

Conclusion of this Tutorial

So far, I have explained about Leanback support library which makes our UI design of Android TV application much easier, simpler. I would say it was not a short tutorial, but now almost all the Android TV specific UI designs (until API level 22) are covered! I hope you get basics of Android TV app development, and you don’t lost a way to start developing your own design application.

The source code can be found on github.

Sponsored Links

2 responses

Leave a Reply

Your email address will not be published.