KOTLIN PART III MVP ANDROID
kali bakal mengbahas pattern yang sering dipakai developer sejagat,yap MVP .
MVP atau model view presenter adalah sebuah konsep memisahkan antara logic business dengan view.Logic business nanti di posisikan di presenter,selain untuk nyimpan logic semua view,presenter juga nanti penyedia data ke model,biasanya semua logic business kita bikin activity/view sekarang di pisah .Lebih simplenya presenter nanti sebagai mengolah data yang akan di tampilkan di view.
kira-kira schemanya seperti ini.ada view — presenter — Model .dischema ada login,register dan yang lainnya.Di Login fragment nanti ada button untuk sign in,username dan password dari dikirim ke presenter di olah disana,apakah login berhasil apa enggak semua informasi dari loginterus simpan data di model,dari model bawa nilai ke view.
Kenapa memakai MVP ?
- Dengan menerapkan MVP di project android meringan tugas view yang sebelum ditumpuk di Activity/fragment.
- Dengan MVP gampang untuk melakukan testing
- Dengan MVP gampang untuk maintenance
IMPLEMENTASI
sekarang mari kita coba implementasi MVP versi kotlin dengan berbagai versi.Untuk sekarang membuat inputan user dan tampil di listview.Dan untuk implementasi sekarang menggunakan anko common,belum tau anko common apa,check sini.
silakan bikin class dan interface seperti gambar diatas.ada satu class presenter dan 2 interface.
silakan buat layout seperti diatas.atas pake codingan dibawah ini .
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:padding="20dp"
tools:context="id.co.digitalindo.samplemvpv1.MainActivity">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-condensed"
android:hint="Input some"
android:gravity="center"
android:background="@android:drawable/editbox_background_normal"
android:id="@+id/inputText"
/>
<Button
android:layout_width="match_parent"
android:layout_height="35dp"
android:text="Submit"
android:id="@+id/buttonSubmit"
android:textAllCaps="false"
android:layout_marginTop="10dp"
android:textColor="@android:color/white"
android:background="@android:color/holo_green_dark"/>
</LinearLayout>buat sebuah model
class ModelMVP(var textmsgg : String)selanjutnya di bagian class FirstView
interface FirstView {
fun berhasil(hasil : ModelMVP)
fun error()
}FirstView nanti sebagai membawa data dari presenter ke activity.selanjutnya tambahkan dibagian FirstPresenter
interface FirstPresenter {
fun tambahData(msg : String)
}class dari FirstPresenter nanti sebagai struktur dibagian presenter utama(FirstPresenterImp).
dibagian FirsPresenterImp panggil FirstView
class FirstPresenterImp (model : FirstView) {
var viewmodel : FirstView? = null
init {
viewmodel = model
}
}dan masih dibagian FirstPresenterImp implmentasikan FirstPresenter
silakan pilih “implement members”.dan langsung oke.jadinya seperti ini
class FirstPresenterImp (model : FirstView) : FirstPresenter {
var viewmodel : FirstView? = null
init {
viewmodel = model
}
override fun tambahData(msg: String) {
}
}silahkan tambahkan logic untuk tambahkan data kemodel dan view
class FirstPresenterImp (model : FirstView) : FirstPresenter {
var viewmodel : FirstView? = null
init {
viewmodel = model
}
override fun tambahData(msg: String) {
//TODO 1 check inputan
if(msg.isNotEmpty()){
//TODO 2
var model = ModelMVP(msg)
//TODO 3 add ke view
viewmodel?.berhasil(model)
}else{
//TODO 4 kalau seandainya kosong
viewmodel?.error()
}
}
}sekarang masuk eksekusi dibagian viewnya.bikin deklrasi presenter dan inisialisasi.
class MainActivity : AppCompatActivity() {
//TODO 8 deklrasi presenter
lateinit var presenterImp: FirstPresenterImp
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//TODO 9 inisialisasi presenter
presenterImp = FirstPresenterImp(this)
}
}nanti bakal merah dibagian “this” .silakan di implementasi.pilih let itu ya.
jadinya seperti ini.
package id.co.digitalindo.samplemvpv1
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import id.co.digitalindo.samplemvpv1.model.ModelMVP
class MainActivity : AppCompatActivity(), FirstView {
//TODO 8 deklrasi presenter
lateinit var presenterImp: FirstPresenterImp
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//TODO 9 inisialisasi presenter
presenterImp = FirstPresenterImp(this)
}
override fun berhasil(hasil: ModelMVP) {
TODO("not implemented") //To change body of created functions use File | Settings | File Templates.
}
override fun error() {
TODO("not implemented") //To change body of created functions use File | Settings | File Templates.
}
}didalam FirstPresenterImp ada funtion “addData” silahkan panggil funtion itu ketika event klik dari button submit.tambahkan di onCreate .
buttonSubmit.onClick {
presenterImp.tambahData(inputText.text.toString())
}itu baru menambahkan datanya ke model.sekarang mari kita lanjutkan dengan menampilkan data yang di model di alert.dan full codingan di activity seperti ini.
class MainActivity : AppCompatActivity(), FirstView {
//TODO 5 deklrasi presenter
lateinit var presenterImp: FirstPresenterImp
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//TODO 6 inisialisasi presenter
presenterImp = FirstPresenterImp(this)
buttonSubmit.onClick {
presenterImp.tambahData(inputText.text.toString())
}
}
override fun berhasil(hasil: ModelMVP) {
//TODO 6 TAMPILAN DI ALERT
alert {
title = hasil.textmsgg
noButton {
}
yesButton {d ->
d.dismiss()
}
}
.show()
}
override fun error() {
//TODO 7
toast("tidak boleh kosong")
}
}hasilnya udah ketebak ya.
oke,jadi intinya logic proses data di presenter.atau proses event klik button atau view yang lain pindahkan ke presenter.
sample 2 MVP dengan gaya yang berbeda.Menghitung bangun datar sederhana.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:padding="30dp"
android:layout_height="match_parent"
tools:context="id.co.digitalindo.mvpkotlinv2.MainActivity">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/input1"
android:hint="Input 1"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/input2"
android:hint="Input 2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/submitHitung"
android:text="hitung"/>
</LinearLayout>
silahkan tambahkan directory class seperti ini.
ubah isi BaseView jadi seperti dibawah ini
interface BasePresenter<in T : BaseView> {
fun onAttach(view : T)
fun onDettach()
}didalam class diatas ada 2 function,onAttach digunakan nanti memindahkan data kemodel atau ke view,dan onDettach kalau sendainya proses onAttach selesai.Bingung “T” itu gunanya apa ? itu sebagai variable generator saja,bebas mas “N”,”A” atau yang lainnya.jadi intinya nanti yang di dalam kurung sikut itu bebas mau interface apapun tidak ada pengecualian.atau bisa di pakai oleh presenter manapun.
ubah BaseView jadi dibawah ini .
interface BaseView {
fun onAttachView()
fun onDettachView()
}class ini gunanya apa ? cass ini nanti yang memindahkan proses model ke view.teru apa beda kedua funtion ini .onAttachView untuk proses memindahkan data ke View.onDettachView proses memindahkan ke view selesai.
proses ini sama kek proses gaya MVP yang pertama.buat modelview.
interface MainView : BaseView{
fun success(hasil : Hasilmodel)
fun error()
}ubah MainPresenter dan buat logic kalkulasi hitung bangun datar
class MainPresenter : BasePresenter<MainView> {
//TODO 1 deklrasi
var modelview : MainView? = null
//TODO 2 klik kanan -> generate-> secondary contrucktor
constructor(model: MainView?) {
this.modelview = model
}
//TODO 3 buat function sendiri
fun hitung(satu : String,dua : String){
//TODO 4 kondisional
if(satu.isNotEmpty() && dua.isNotEmpty()){
val nilai1 = satu.toDouble()
val nilai2 = dua.toDouble()
val hasil = nilai1 * nilai2
val model = Hasilmodel(hasil.toString())
//TODO 5 masukkan k view
modelview?.success(model)
}
else{
//TODO 6 response ke view kalau string kososng
modelview?.error()
}
}
override fun onAttach(view: MainView) {
modelview = view
}
override fun onDettach() {
modelview = null
}eksekusi dibagian activity
lengkap kek gini
//TODO 7
class MainActivity : AppCompatActivity(),MainView {
//TODO 8 deklrasi
lateinit var presenter: MainPresenter
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//TODO 9 INISIAL
presenter = MainPresenter(this)
//TODO 14
submitHitung.onClick {
presenter.hitung(input1.text.toString(),input2.text.toString())
}
}
override fun onAttachView() {
//TODO 10
presenter.onAttach(this)
}
override fun onDettachView() {
//TODO 11
onDettachView()
}
//TODO 15
override fun success(hasil: Hasilmodel) {
alert {
title =hasil.hasilmodel
noButton { }
yesButton { }
}
.show()
}
//TODO 16
override fun error() {
toast("hei tidak boleh kosong")
}
//TODO 12
override fun onStart() {
super.onStart()
onAttachView()
}
//TODO 13
override fun onDestroy() {
super.onDestroy()
onDettachView()
}
} //TODO 7
hasilnya
oke,mau pake yang mana ?
intinya sebenarnya sama.logic nya tidak boleh di activity.jadikan activity sebagai component bodoh yang tidak bisa berpikir dan serahkan bagian pikir memikir ke presenter.
kalau berniat untuk berbagi,dan orang menerima bantuan kita begitu senang menerima apa yang kita bagikan,kesenangan itu jauh luarbiasa.teruslah berbagi dan selalu berdo’a di tempatkan dengan orang-orang yang membutuhkan bantuan kita.bantuannya kek apapun itu.
