Mar 24, 2022
Thinking About Clean Architecture For Enterprise Application (Story-3)
အရင်က article တွေမဖတ်ရသေးရင်ဖတ်ဖို့ပါ။
ဒီတစ်ပတ် Clean ရဲ့ story လေးကတော့ Layer 1 ဖြစ်တဲ့ Presentation Layer ( UI Layer ) လေးပါ။
Presentation Layer or UI Layer
UI or Presentation Layer ဆိုတာ data တွေ information တွေကို screen မှာပြပေးတဲ့ Layer ပါ။ တစ်နည်းအားဖြင့် UI နဲ့ သက်ဆိုင်တဲ့ အလုပ်တွေရယ်၊ UI မှာ ပြမဲ့ data တွေကို organize နဲ့ order လုပ်ပေးရတာပါ။
သူ့မှာ business logic လဲမရှိသလို data တွေကို UI နဲ့သက်ဆိုင်တာလောက်ပဲorganize လုပ်ပီးပြပေးရတာပါ။
ဥပမာ… data တွေကို database ထဲထည့်မယ်ဆိုရင်တောင် viewmodelကနေ တိုက်ရိုက်ထည့်ပိုင်ခွင့်မရှိပါဘူး။ ဘာလို့လဲ ဆိုတော့ database သည် အောက်ဆုံးlayer ဖြစ်တဲ့အတွက် Data Layerနဲ့ Domain Layer တွေနဲ့ communicate ပဲလုပ်သင့်ပါတယ်
ဒါလေးကိုကြည့်လိုက်ရင် ဘာလို့မလုပ်သင့်ဘူးလဲဆိုတာ သဘောပေါက်မှာပါ။
Info About UI Layer Architecture
UI layer ရဲ့အဆင့်ဆင့်လုပ်ဆောင်ပုံတွေကတော့
၁. UI မှာပြချင်တဲ့ data or Information တွေကို data or domain layer ကနေ consume လုပ်ရမယ်။
၂. Consume လုပ်ထားတဲ့ data တွေကို Presentation Layer အတွက် သင့်တော်တဲ့ object ပြန်ပြောင်းပေးရမယ် အဲ့နေရာမှာဘာလို့ပြန်ပြောင်းရလဲဆိုတော့ consume လုပ်ထားတဲ့ data တွေမှာ မလိုအပ်တာတွေပါနေတတ်တယ်ဒီအတိုင်းတန်းထည့်ရင်လဲရပါတယ်
data class UIConsumeData(
val id: Long,
val originalLanguage: String,
val originalTitle: String,
val overview: String,
val posterPath: String,
val releaseDate: LocalDate,
val title: String,
val video: Boolean,
val voteAverage: Float,
val voteCount: Int,
val isFavorite: Boolean
)to transform Map ->data class UIData(
val id: Long,
val originalTitle: String,
val isFavorite: Boolean,
val posterPath: String
)
အဲ့တော့ မလိုအပ်တဲ့ data တွေမထည့်တာကအကောင်းဆုံးပါပဲ၊။
Movie Appရဲ့အရှေ့မှာပြမဲ့ List က data ဟာ Consumeလုပ်ထားတဲ့ data ထဲကအတိုင်း field အများကြီးမလိုပါဘူး။ အဲ့တော့ လိုအပ်တာလောက်ပဲmapလုပ်လိုက်ပါ။ Clean မှာတော့ အဲ့လိုလုပ်ဖို့ကိုလုပ်သင့်ပါတယ်။
၃. Map ထားတဲ့ data တွေ UI မှာပြမဲ့အပိုင်း
အဲ့အပိုင်းမှာတော့ အနည်းဆုံးအနေနဲ့ UI State သုံးခုပြသင့်ပါတယ် ( Success, Loading နဲ့ Error ) State တွေပါ။အဲ့ထက် ပိုရင်လဲကောင်းပါတယ်၊
sealed class UIState<out T>(
class Loading<out T> : UIState<T>()
data class Success<out T>(val value: T) : UIState<T>()
data class Error<out T>(val error: Throwable) : UIState<T>()
)၄. User Input နဲ့ပတ်သတ်တဲ့ interaction အလျောက် state ပြောင်းလဲပီး UI Element မှာပြဖို့
အဓိက မြင်သာတဲ့အချက်ကတော့ Recyclerview ထဲမှာရှိတဲ့ Movie တစ်ခုချင်းစီကို download ဆွဲမဲ့ progress ထည့်မယ်ဆိုရင် ပြောင်းနေတဲ့ progress တန်ဖိုးကို Recyclerview Holder ထဲမှာတန်း observe မလုပ်သင့်ပါဘူး။
ဒါပေမဲ့ အဲ့ progress က UI နဲ့လဲ ဆက်စပ်နေတာဆိုတော့ business Logic ထဲမှာရေးလို့မရတာလဲဖြစ်တတ်ပါတယ်။ အဲ့လိုဆိုရင် Viewmodel ထဲမှာ လိုသလိုပုံပြောင်းနိုင်တဲ့ object လေးဆောက်ပီး ပြန် observe လုပ်သင့်ပါတယ် recyclerview or acitvity/fragment မှာမလုပ်သင့်ပါဘူး။ဥပမာ
data class EpisodeItem(
val episodeID: String,
val episodeTitle: String,
val episodeTime: String,
val episodeUrl: String,
val episodeImage: String,
val episodeDescription: String,
val episodeDuration: String,
val stationTitle: String
)ကနေ ဒီလိုလေးပြောင်းပီးမှ recyclerview အတွက် object အနေနဲ့
EpisodeRVViewItem(
id = episodeItem.episodeID,
title = episodeItem.episodeTitle,
releaseDateTime = episodeItem.episodeTime,
songUrl = when (downloadedEpisodeUrl[episodeItem.episodeID].isNullOrEmpty()) {
true -> episodeItem.episodeUrl
false -> downloadedEpisodeUrl[episodeItem.episodeID]!!
},
imageUrl = episodeItem.episodeImage,
downloadStatus = when (downloadStatus) {
is EpisodeDownloadStatus.Downloading -> {
EpisodeRVViewItemDownloadStatus.Downloading(downloadStatus.progress)
}
is EpisodeDownloadStatus.Downloaded -> {
EpisodeRVViewItemDownloadStatus.Downloaded(downloadStatus.shareAbleSongUrl)
}
EpisodeDownloadStatus.NotDownloaded -> {
EpisodeRVViewItemDownloadStatus.NotDownloaded
}
},
isPlaying = isPlaying,
description = episodeItem.episodeDescription,
duration = episodeItem.episodeDuration,
stationTitle = episodeItem.stationTitle
)
}ပြောင်းသင့်ပါတယ်
အခု UI Layer လေးကိုအခြေခံအချက်လုပ်ရမှာတွေပဲပြောထားတာပါ၊ ဒီထက်သတိထားရမှာတွေလုပ်ရမှာတွေရှိပါသေးတယ်၊ တကယ်လို့မှားနေသေးတဲ့နေရာတွေရှိရင်လဲထပ်ပြောနိုင်ပါတယ်၊ ရိုးရိုးMVVM ပုံစံကိုပဲ object mapတာပဲကွဲသွားတယ်ထင်တဲ့အတွက်ထပ်မပြောမိတာမို့ နားလည်မယ်လို့ထင်ပါတယ်။
See you Next Story Guys😉😉
References
