Android Kotlin MVVM Networking dengan RX Java dan RX Android (1)

Setelah sebelumnya membuat basic android MVVM. sekarang lanjut ke networking, mendapatkan data dari API dan menampilkannya dalam aplikasi.

contoh API nya diambil dari sini. yang nantinya akan ditampilkan berbentuk list.

untuk librarynya disini menggunakan Retrofit, OkHttp Loging, Rx Java dan Rx Android. langsung saja setelah membuat project android baru aktifkan mode data binding dan tambahkan library yang akan dipakai.

oke done, sebelum lanjut ke pembuatan layout siapkan class viewmodel. pertama siapkan viewmodel untuk main activity. buat nama class nya MainViewModel.
 

kemudian class view model untuk item. kasih nama ItemPlaceViewModel.

persiapan selesai lanjut ke pembuatan layout. pertama layout untuk item place. buat seperti berikut. beri nama item_place.xml dan set data variabel nya ke class view model yang telah dibuat sebelumnya.

	<?xml version="1.0" encoding="utf-8"?>
	<layout xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:tools="http://schemas.android.com/tools"
	xmlns:app="http://schemas.android.com/apk/res-auto">
	<data>
	<variable
	name="itemPlace"
	type="com.yoesuv.mvvmnetworking.viewmodels.ItemPlaceViewModel"/>
	</data>
	<RelativeLayout
	android:layout_width="match_parent"
	android:layout_height="wrap_content">
	<!-- imageView item place -->
	<android.support.v7.widget.AppCompatImageView
	android:id="@+id/imageViewItemPlace"
	android:layout_width="70dp"
	android:layout_height="70dp"
	app:srcCompat="@drawable/sample_image"/>
	<LinearLayout
	android:id="@+id/layoutText"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:orientation="vertical"
	android:layout_toRightOf="@id/imageViewItemPlace"
	android:layout_toEndOf="@id/imageViewItemPlace"
	android:layout_centerVertical="true"
	android:layout_marginLeft="8dp"
	android:layout_marginStart="8dp">
	<!-- textView title item place -->
	<android.support.v7.widget.AppCompatTextView
	android:id="@+id/textTitle"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:textSize="18sp"
	android:textStyle="bold"
	tools:text="Place Name"/>
	<!-- textView location item place -->
	<android.support.v7.widget.AppCompatTextView
	android:id="@+id/textLocation"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	tools:text="Place Location"/>
	</LinearLayout>
	</RelativeLayout>
	</layout>

view raw item_place.xml hosted with ❤ by GitHub

Lanjut  ke layout utama.  sama seperti layout diatas jangan lupa set data variabel viewmodel.

	<?xml version="1.0" encoding="utf-8"?>
	<layout xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:tools="http://schemas.android.com/tools"
	tools:context=".views.MainActivity">
	<data>
	<variable
	name="main"
	type="com.yoesuv.mvvmnetworking.viewmodels.MainViewModel"/>
	</data>
	<RelativeLayout
	android:id="@+id/layoutMain"
	android:layout_width="match_parent"
	android:layout_height="match_parent">
	<android.support.v7.widget.RecyclerView
	android:id="@+id/recyclerViewPlace"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	tools:listitem="@layout/item_place"/>
	</RelativeLayout>
	</layout>

view raw activity_main.xml hosted with ❤ by GitHub

nah sekarang design aplikasinya sudah terlihat.

lanjut ke pembuatan class untuk networking. sebelum itu siapkan class model untuk API nya. bisa lewat plugin android studio atau lewat online pojo generator. kurang lebihnya class modelnya seperti berikut ini.

sekarang baru lanjut ke handle API nya. pertama buat interface. buat seperti berikut.

setelah itu buat class untuk networking service.

nah ini adalah class custom untuk Observer. ini akan digunakan di setiap repository yang nanti akan dibuat.

seperti ini contoh repositorynya. dalam hal ini cuma satu MainRepository.

class untuk networking sudah siap, sekarang ubah MainViewModel. gunakan repositorynya disini. lihat gambar berikut ini.

sip, untuk logic mendapatkan data dari API sedah selesai. tinggal test lewat MainActivitynya. buat seperti berikut ini.

sekarang coba jalankan dan lihat log nya. jika hasilnya seperti berikut ini. maka sudah berhasil mengkoneksikan data API dengan Rx Java dan Rx Android.

selamat mencoba.
artikel bersambung kesini.