ViewModel & MVVM Architecture

စိတ်လျှော့ပါ။ ဒီခန်းကို စာအုပ်လိုမဟုတ်ဘဲ စကားပြောသလိုပဲ၊ နားလည်လွယ်အောင် ရှင်းပါမယ်။

ခဏလေး ဒီလိုပဲ စဉ်းစားကြည့်

MVVM (Model-View-ViewModel) က UI (View/Composable) ကို business logic (ViewModel) ကနေ ခွဲထုတ်ထားတဲ့ architecture pattern ပါ — Model က data (database, API), View က UI (Composable), ViewModel က ၂ ခုကြားက middleman (data ကို fetch/transform ပြီး View ဆီ expose) ပါ။ `ViewModel` class က Activity/screen rotate (Advanced concept) ကို survive လုပ်ပါတယ် — Composable ထဲက local state (`remember`) နဲ့ မတူဘဲ, ViewModel ရဲ့ data က configuration change ကြားထိ ကျန်ရှိနေပါတယ်.

လက်တွေ့ scenario နဲ့ ချိတ်ကြည့်မယ်

`TodoViewModel : ViewModel() { val todos = mutableStateListOf<TodoItem>(); fun addTodo(title: String) { todos.add(TodoItem(...)) } }` လို့ ရေးထားရင် — Composable ထဲမှာ `val viewModel: TodoViewModel = viewModel()` နဲ့ instance ကို ရယူပြီး, `viewModel.todos` ကို `LazyColumn` ထဲမှာ display လုပ်နိုင်ပါတယ် — button click ရင် `viewModel.addTodo(...)` ခေါ်ရုံပါပဲ, UI code ထဲမှာ business logic ရောစပ်စရာ မလိုတော့ပါ.

MVVM = Model (data) / View (UI) / ViewModel (logic middleman) ခွဲထားသော architecture
ViewModel = screen rotate ကို survive လုပ်နိုင်သော, business logic ကို ကိုင်တွယ်သော class
UI (Composable) က ViewModel ကို observe လုပ်ရုံပဲ, logic ကို ကိုယ်တိုင် မကိုင်တွယ်

အတူတူ ကြည့်မယ်

kotlin

class TodoViewModel : ViewModel() {
    private val _todos = mutableStateListOf<TodoItem>()
    val todos: List<TodoItem> = _todos

    fun addTodo(title: String) {
        _todos.add(TodoItem(id = UUID.randomUUID().toString(), title = title))
    }
}

@Composable
fun TodoScreen(viewModel: TodoViewModel = viewModel()) {
    LazyColumn {
        items(viewModel.todos) { todo -> Text(todo.title) }
    }
}

You should see

Screen rotate ပြီးတောင် ViewModel ထဲက todos list ပျောက်မသွားဘဲ ဆက်ရှိနေတာ တွေ့ရမည်။

၅ မိနစ် စမ်းကြည့်

`TodoViewModel` ကို ကိုယ်တိုင်ရေးပြီး, todo item ၂-၃ ခု `addTodo()` နဲ့ ထည့်ကြည့်ပါ — emulator ကို rotate (Ctrl+F11) လုပ်ကြည့်ပြီး todo list ပျောက်မသွားကြောင်း confirm လုပ်ကြည့်ပါ။

သတိလေးတစ်ချက်

ViewModel ထဲက state ကို mutable public property (`var todos = mutableListOf<...>()`) အနေနဲ့ expose ခြင်းကို ရှောင်ပါ — View ဘက်ကနေ state ကို တိုက်ရိုက် modify လုပ်နိုင်သွားလို့, `private set` ဒါမှမဟုတ် immutable exposure pattern ကို သုံးသင့်ပါတယ်။