Building Modern Apps using Android Architecture Components

Building Modern Apps using
Android Architecture
Components
Hassan Abid
GDE Android - Singapore
@hassanabidpk

Google I/O Talks
! Android Jetpack: what's new in Android Support Library
! Android Jetpack: what's new in Architecture Components
! Modern Android development: Android Jetpack, Kotlin, and more
! Android Jetpack: how to smartly use Fragments in your UI
! Android Jetpack: manage UI navigation with Navigation Controller
! Android Jetpack: manage infinite lists with RecyclerView and Paging
! Android Jetpack: easy background processing with WorkManager
! Android Slices: build interactive results for Google Search
! Android Jetpack: sweetening Kotlin development with Android KTX
! Protips: a fresh look at advanced topics for Android experts

Android Dev Summit 2018 Talks
! https://www.youtube.com/playlist?list=PLWz5rJ2EKKc8WFYCR9esqGGY0vOZm2l6e

AndroidX : Android Extension Libraries
! AndroidX fully replaces the Support Library by
providing feature parity and new libraries
! Added to Android Open Source Project

AndroidX
AndroidX: "Android Extension Libraries"
android.support.v4.view.ViewCompat
→ androidx.core.view.ViewCompat
android.support.v7.app.AppCompatActivity
→ androidx.appcompat.app.AppCompatActivity
android.arch.persistence.room.RoomDatabase
→ androidx.room.RoomDatabase

AndroidX
! Strict Semantic versioning rule
○ Reset to 1.0.0

Refactor to AndroidX
Migration from 28.0.0

Architecture Components
! LifeCycle (2.0.0 Stable)
! Data-binding (Stable, 3.2 New!)
! ViewModel (Stable, New!)
! LiveData (Stable, New!)
! Room (2.1 New!)
! Paging (2.1 New)
! WorkManager (New!)
! Navigation (New!)
https://developer.android.com/jetpack/docs/release-notes

Adding Components to your project
allprojects {
repositories {
jcenter()
google()
}
}

Example : LifeCycle - include ViewModel and
LiveData (Pre-AndroidX)
dependencies {
def lifecycle_version = “2.0.0“
// ViewModel and LiveData
implementation "android.arch.lifecycle:extensions:$lifecycle_version"
// alternatively - just ViewModel. use -ktx for Kotlin
implementation "android.arch.lifecycle:viewmodel:$lifecycle_version"
}

Example : LifeCycle (AndroidX)
dependencies {
def lifecycle_version = "2.0.0"
// ViewModel and LiveData
implementation "androidx.lifecycle:lifecycle-extensions:$lifecycle_version"
// alternatively - just ViewModel use -ktx for Kotlin
implementation "androidx.lifecycle:lifecycle-viewmodel:$lifecycle_version" }

LifeCycle Problem
internal class MyLocationListener(
private val context: Context,
private val callback: (Location) -> Unit
) {
fun start() {
// connect to system location service
}
fun stop() {
// disconnect from system location service
}
}

LifeCycle Problem
class MyActivity : AppCompatActivity() {
private lateinit var myLocationListener: MyLocationListener
override fun onCreate(...) {
myLocationListener = MyLocationListener(this) { location ->
// update UI
}
}
public override fun onStart() {
super.onStart()
myLocationListener.start()
// manage other components that need to respond
// to the activity lifecycle
}
public override fun onStop() {
super.onStop()
myLocationListener.stop()
// manage other components that need to respond
// to the activity lifecycle
}
}

Solution
! LifeCycle Owners : Objects with LifeCycle like Activities and
Fragments
! LifeCycle Observers : Observe Lifecycle owners and are
notified life cycle changes

Solution
class MyActivity : AppCompatActivity() {
private lateinit var myLocationListener: MyLocationListener
override fun onCreate(...) {
myLocationListener = MyLocationListener(this, lifecycle) { location ->
// update UI
}
Util.checkUserStatus { result ->
if (result) {
myLocationListener.enable()
}
}
}
}

Solution
internal class MyLocationListener(
private val context: Context,
private val lifecycle: Lifecycle,
private val callback: (Location) -> Unit
) {
private var enabled = false
@OnLifecycleEvent(Lifecycle.Event.ON_START)
fun start() {
if (enabled) {
// connect
}
}
fun enable() {
enabled = true
if (lifecycle.currentState.isAtLeast(Lifecycle.State.STARTED)) {
// connect if not connected
}
}
@OnLifecycleEvent(Lifecycle.Event.ON_STOP)
fun stop() {
// disconnect if connected
}
}

Fragment View Lifecycle (ViewModel)
viewModel.plantAndGardenPlantings.observe(viewLifecycleOwner, Observer { result -> 
if (result != null && result.isNotEmpty()) 
adapter.submitList(result) 
})

LifeCycle Benefits
! Avoid Lifecycle related UI state loss: View Model
! Observability for your UI: LiveData
! Avoid Lifecycle related memory leak
! LiveData transformations
! UI-Database observations : LiveData /Room
! XML-ViewModel observations: DataBinding
! Query and Observe UI Lifecycle State

Use cases for lifecycle-aware components
! Switching between coarse and fine-grained location
updates.
! Stopping and starting video buffering.
! Starting and stopping network connectivity.
! Pausing and resuming animated drawables.

Databinding
A support library that allows you to bind UI components in your
layouts to data sources in your app using a declarative format
rather than programmatically.
TextView textView = findViewById(R.id.sample_text);
textView.setText(viewModel.getUserName());
<TextView
android:text="@{viewmodel.userName}" />

Databinding 💕 LiveData
class PlantDetailViewModel() : ViewModel() { 
val plant: LiveData<Plant> = ... 
 
} 
<data> 
<variable 
name="viewModel" 
type="viewmodels.PlantAndGardenPlantingsViewModel"/> 
</data> 
<ImageView 
android:layout_width="match_parent" 
android:layout_height="100dp" 
android:scaleType="centerCrop" 
app:imageFromUrl="@{viewModel.imageUrl}" 
/>

Databinding : One More thing
android { 
dataBinding { 
enabled = true 
}
}
val binding = DataBindingUtil.inflate<FragmentPlantDetailBinding>( 
inflater, R.layout.fragment_plant_detail, container, false).apply { 
viewModel = plantDetailViewModel 
setLifecycleOwner(this@PlantDetailFragment) 
}

ViewModel
! Provide data for UI Components
! Survive Configuration changes
ViewModel
Hold UI Data
Repository
API for loading and saving
data
Activity
Drawing UI
User Interactions
Presenter
Process Data for UI

ViewModel
class PlantDetailViewModel() : ViewModel() { 
val plant: LiveData<Plant> 
}
override fun onCreateView( 
inflater: LayoutInflater, 
container: ViewGroup?, 
savedInstanceState: Bundle? 
): View? { 
val plantDetailViewModel = ViewModelProviders.of(this, factory) 
.get(PlantDetailViewModel::class.java) 
 
}
Don’t store activity context in
ViewModel

LiveData
LiveData is an observable data holder. It is lifecycle aware
public class ProductViewModel extends AndroidViewModel { 
private final LiveData<ProductEntity> mObservableProduct; 
// .... 
public LiveData<ProductEntity> getObservableProduct() { 
return mObservableProduct; 
}
}
// Observe product data and
model.getObservableProduct().observe(this, new Observer<ProductEntity>() { 
@Override 
public void onChanged(@Nullable ProductEntity productEntity) { 
// update UI 
} 
});

ViewModel + LiveData +
DataBinding = Reactive UI

Room
! Object Mapping for SQLite Database
! Raw Queries are supported
! Support for RxJava
! Work with java.util.Optional

Room - Entity
@Entity(tableName = "plants") 
data class Plant( 
@PrimaryKey @ColumnInfo(name = "id") val plantId: String, 
val name: String, 
val description: String, 
val growZoneNumber: Int, 
val wateringInterval: Int = 7, 
val imageUrl: String = "" 
)

Room - Dao
@Dao 
interface PlantDao { 
@Query("SELECT * FROM plants ORDER BY name") 
fun getPlants(): LiveData<List<Plant>> 
@Query("SELECT * FROM plants WHERE growZoneNumber = :growZoneNumber ORDER BY name") 
fun getPlantsWithGrowZoneNumber(growZoneNumber: Int): LiveData<List<Plant>> 
@Query("SELECT * FROM plants WHERE id = :plantId") 
fun getPlant(plantId: String): LiveData<Plant> 
@Insert(onConflict = OnConflictStrategy.REPLACE) 
fun insertAll(plants: List<Plant>) 
}
Observable queries

Room - RoomDatabase
@Database(entities = [GardenPlanting::class, Plant::class], version = 1, exportSchema = false) 
@TypeConverters(Converters::class) 
abstract class AppDatabase : RoomDatabase() { 
abstract fun gardenPlantingDao(): GardenPlantingDao 
abstract fun plantDao(): PlantDao 
 
... 
}

Modern Android App
Architecture

Paging
! Fetch from database, Network, or both into RecycleView
! Extension of observable List Pattern (e.g LiveData<List>)
! Configurable Load Size, prefetch, placeholders
! Integrates with Room, LiveData, RX
! Stable release

Paging - core components 1/2
! PagedList
○ Load data in pages
○ Async data loading
! DataSource and DataSource.Factory
○ Base class for loading snapshots of data into PagedList
○ Backed by Network or Database

Paging - core components 2/2
! LivePagedListBuilder
○ Build a LiveData<PagedList> based on DataSource.Factory and
a PagedList.config
! BoundaryCallBack
○ Signals when PagedList has reached end of available data
! PagedListAdapter
○ A RecyclerView.Adapter that presents data from PagedLists

Paging - simplified
UI
PageListAdapter
PagedList
--------------
--------------
--------------
Data Layer
DataSource.Factory
BoundyCallBack
Data Source
OnItemAtEndLoaded()
Save data
Get Data
ViewModel
LiveData<PagedList>
Repository
LivePagedListBuilder
LiveData<PagedList>
create()
Build
--------------
Load
more

DataSource
! PageKeyedDataSource
! ItemKeyedDataSource
! PositionalDataSource

BoundaryCallBack
class ConcertBoundaryCallback(
private val query: String,
private val service: MyService,
private val cache: MyLocalCache
) : PagedList.BoundaryCallback<Concert>() {
override fun onZeroItemsLoaded() {
requestAndSaveData(query)
}
override fun onItemAtEndLoaded(itemAtEnd: Concert) {
requestAndSaveData(query)
}
}

Navigation - Challenges
! Passing Arguments
! Deep Links
! Fragment Transactions
! Testing

Navigation - Only available in Android Studio 3.3

Navigation
<navigation xmlns:app="http://schemas.android.com/apk/res-auto" 
xmlns:android="http://schemas.android.com/apk/res/android" 
app:startDestination="@+id/garden_fragment"> 
<fragment 
android:id="@+id/plant_list_fragment" 
android:name="com.google.samples.apps.sunflower.PlantListFragment">
<argument 
.../> 
<action 
android:id="@+id/action_plant_list_fragment_to_plant_detail_fragment" 
app:destination="@id/plant_detail_fragment" 
app:enterAnim="@anim/slide_in_right" 
app:exitAnim="@anim/slide_out_left" 
app:popEnterAnim="@anim/slide_in_left" 
app:popExitAnim="@anim/slide_out_right" /> 
</fragment>
.... 
</navigation>

Navigation - Add Navgraph
<fragment 
android:id="@+id/garden_nav_fragment" 
android:name="androidx.navigation.fragment.NavHostFragment" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
app:defaultNavHost="true" 
app:navGraph="@navigation/nav_garden"/>

Navigation - NavigationController
val navController = Navigation.findNavController(this, R.id.garden_nav_fragment) 
 
// Set up ActionBar 
setSupportActionBar(binding.toolbar) 
NavigationUI.setupActionBarWithNavController(this, navController, drawerLayout) 
 
// Set up navigation menu 
binding.navigationView.setupWithNavController(navController)

Navigation - NavigationOnClickListener
private fun createOnClickListener(plantId: String): View.OnClickListener { 
val bundle = bundleOf(PlantDetailFragment.ARG_ITEM_ID to plantId) 
return Navigation.createNavigateOnClickListener( 
R.id.action_plant_list_fragment_to_plant_detail_fragment, bundle) 
}
<action 
android:id="@+id/action_plant_list_fragment_to_plant_detail_fragment" 
app:destination="@id/plant_detail_fragment"/>

Navigation - CodeLab
https://codelabs.developers.google.com/codelabs/android-navigation
Adding arguments via Navigation Component : https://codelabs.developers.google.com/codelabs/android-
navigation/#7

WorkManager
! WorkManager might use JobScheduler, Firebase
JobDispatcher, or AlarmManager
! Work Manager will use best option for you!

WorkManager Basics
! Worker
! WorkRequest
! OneTimeWorkRequest
! PeriodicWorkRequest
! WorkManager
! WorkInfo

Typical Flow (Compress Images example)
class CompressWorker(context : Context, params : WorkerParameters)
: Worker(context, params) {
override fun doWork(): Result {
// Do the work here--in this case, compress the stored images.
// In this example no parameters are passed; the task is
// assumed to be "compress the whole library."
myCompress()
// Indicate success or failure with your return value:
return Result.SUCCESS
// (Returning RETRY tells WorkManager to try this task again
// later; FAILURE says not to try again.)
}
}

Typical Flow (Compress Images example)
// Create a Constraints object that deﬁnes when the task should run
val myConstraints = Constraints.Builder()
.setRequiresDeviceIdle(true)
.setRequiresCharging(true)
// Many other constraints are available, see the
// Constraints.Builder reference
.build()
// ...then create a OneTimeWorkRequest that uses those constraints
val compressionWork = OneTimeWorkRequestBuilder<CompressWorker>()
.setConstraints(myConstraints)
.build()
WorkManager.getInstance().enqueue(compressionWork)

Typical Flow - Cancelling a task
val compressionWorkId:UUID = compressionWork.getId()
WorkManager.getInstance().cancelWorkById(compressionWorkId)

Samples and Code Lab
Android SunFlower https://github.com/googlesamples/android-sunflower
Universal Music Player https://github.com/googlesamples/android-UniversalMusicPlayer/blob/master/app/build.gradle
Architecture Components https://github.com/googlesamples/android-architecture-components
Plaid 2.0 https://github.com/nickbutcher/plaid
Code Labs https://codelabs.developers.google.com/?cat=Android
Guide to Architecture Components https://developer.android.com/jetpack/docs/guide
Code Highlighter : https://romannurik.github.io/SlidesCodeHighlighter/

Conclusion
! Finally Android platform got an Architecture
! Highly Recommended for New Apps
! Try out samples and code-labs

Thank You!
Twitter : @hassanabidpk
Github : hassanabidpk

Building Modern Apps using Android Architecture Components

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

Similaire à Building Modern Apps using Android Architecture Components

Similaire à Building Modern Apps using Android Architecture Components (20)

Plus de Hassan Abid

Plus de Hassan Abid (10)

Dernier

Dernier (20)

Building Modern Apps using Android Architecture Components