iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 9
0

上一篇完成了 viewModel 的基礎使用,那如果要在程式碼裡去改變 viewModel 的值該怎麼寫呢

回到 Activity

binding.userName = "Curry"

這裡直接透過 DataBinding 拿到的 userName 是一個 TextView,是 DataBinding 自動生成的, 這個 ViewDataBinding 類拿到的都是我們在 xml 定義的 UI 元件,如果直接透過 binding 去拿 UI 元件做操作,
那不就跟原本的 textView.setText 方式是一樣的嗎。

所以比較正確的作法應該是去通知 viewModel,請他做事情,viewModel 的數據一更新,由於 DataBinding 的關係,UI 會自動更新,不用像 MVP 模式一樣還要再呼叫 View 刷新 UI

比較符合 MVVM 的做法

MainActivity

viewModel.updateUserName("Curry")

MainViewModel

fun updateUserName(userName: String) {

    this.userName = userName
}

監聽點擊事件

先在 MainActivity 定義好方法

fun onProfileBtnClick() {

//    doSomething...
}

xml

<Button
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:onClick = "onProfileBtnClick"
android:text = "go to Profile" />

直接在 onClick 裡面把方法名稱複製貼上就可以了
如果需要知道這個 view 的話,修改一下 fun

fun onProfileBtnClick(view: View) {

//    doSomething...
}

這裡呼叫的是 View 裡面的方法,還記得我們最上面引進了一個 viewModel 類,如果可以使用裡面的變數,同理也可以使用裡面的方法,語法會稍微不同,基本上,需要用到 ViewModel 的地方都是要用 @{} 包起來就是了,請看以下

不帶參數

ViewModel

fun onClick(){
        
//  doSomething...
}

xml

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="@{() -> viewModel.onClick()}" />

帶 view 的參數

ViewModel

fun onClick(view: View){
        
//  doSomething...
}

xml

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="@{viewModel.onClick}" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="@{viewModel::onClick}" />

帶 viewModel 的參數

ViewModel

fun onClick(id: Int){
        
//    doSomething...
}

xml

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="@{() -> viewModel.onClick(viewModel.id)}" />

這個 id 可以是任意型態,只要型態跟 ViewModel 裡的 fun 參數 對應到即可

最後,如果這個 xml 的元件很多,每個元件都要各自處理不同的 click 事件,依照官方文檔的建議,
可以再建立一個 Handler 類別,專門處理這些事情,免得 ViewModel 變得太過肥大而且擁有一堆 onXXXClick 的 function,使用時一樣把 Handler 引入即可

 <data>
       <variable name="handlers" type="com.example.MainViewModel"/>
       <variable name="handlers" type="com.example.MainHandlers"/>
 </data>
 
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@{viewModel.userName}"
        android:onClick="@{handlers::onConfirmBtnClick}"
        />
...

監聽事件大概到這邊一個段落

有任何問題或講得不清楚的地方歡迎留言和我討論。

更歡迎留言糾正我任何說錯的地方!

下一篇:Data Binding (三) Data Binding 在 xml 裡的各種語法


上一篇
Day 8 Data Binding (一) 介紹與基本使用
下一篇
Day 10 Data Binding (三) 在 xml 裡的各種語法
系列文
Android Architecture Components 學習心得筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言