组件间通信方案(四):ViewModel通信方案

在这里插入图片描述

ViewModel 简述

ViewModel 旨在以生命周期感知的形式存储和管理 UI 控制器(Activity/Fragment 等)相关的数据,可以解决 UI 控制器中数据无法正确保留以及数据在其复杂的生命周期中难以维护的痛点,它的生命周期感知能力需要配合 Lifecycles 组件才能实现,本文聚焦于 ViewModel 所以先不讲 Lifecycles ,关于 Lifecycles 我会在其它文章详细介绍

为什么使用 ViewModel ?

我觉得这个问题很重要,当我们使用任何一个新工具的时候都需要弄清楚这个问题,要结合实际情况而非盲目跟随,接下来我会逐一尝试说明 ViewModel 对比传统方案的优劣

只要你接触 Android 开发一段时间,都不可避免的会遇到 “转屏” 问题

在这里插入图片描述

好好的数据在你转屏的瞬间,莫名其妙的消失了

发生以上情况和 Activity 的配置更改有关, 屏幕旋转属于配置更改(Activity 生命周期内自行处理的配置更改)的情况之一,其它类似的还包括接入外置键盘、检测到了 SIM 并更新了 MNC、布局方向发生了变化等十几种情况,发生这些情况时系统默认会关闭并重建 Activity ,这就导致了上面数据莫名其妙消失的问题。而我们传统的处理办法就是在配置变更期间保留对象和自行处理配置变更这两种,这两种方式都有很多坑(看看官方文档就知道了),尤其是需要恢复的数据比较多的时候,而 ViewModel 就非常适合处理这些情况

在下图中,你可以看到一个 Activity 旋转过程的生命周期,绿色部分是与此 Activity 相关联的 ViewModel 的生命周期,图例中只展示了 Activity ,而 ViewModel 也同样可以和 Fragment 配合使用

在这里插入图片描述

ViewModel 会从你第一次创建(通常在 onCreate 时)直到此 Activity 完成并销毁,Activity 在生命周期中可能会多次销毁创建 ,但 ViewModel 始终存活

如何使用 ViewModel ?

我用一个非常简单的 Demo 来展示它的基础用法,通常我们为 app 集成 ViewModel 遵循如下几个步骤:

1、创建一个继承 ViewModel 的类来分离出 UI 控制器中的数据

2、建立 ViewModel 和 UI 控制器之间的通信

3、在 UI 控制器中使用 ViewModel

1、创建 ViewModel

创建 MainActivityViewModel 并继承 ViewModel

class MainActivityViewModel : ViewModel(){}

以上面的计时器为例,我们需要 UI 保持持续更新时间的状态,所以在 ViewModel 添加一个 startTime 变量用于存储不断累计的时间

class MainActivityViewModel : ViewModel(){
    private val _startTime = null
    var startTime:Long? = _startTime
}

2、关联 UI 控制器和 ViewModel

UI 控制器必须知道自己和哪个 ViewModel 进行关联,这样它才能知道去哪里取回数据,注意,不要在 ViewModel 中持有任何 Activity、Fragment 或 View 的引用,因为大部分情况 ViewModel 的生命周期比它们都长,持有一个已经销毁对象的引用意味着内存泄露,对于必须使用 Context 的 ViewModel 可以继承 AndroidViewModel 类,AndroidViewModel 中包含 Application 的引用

class MainActivity : AppCompatActivity() {
    private val viewModel by lazy {
        ViewModelProviders.of(this).get(MainActivityViewModel::class.java)
    }
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        cm.start()
    }
}

3、在 UI 控制器中使用 ViewModel

我们在计时开始之前先将系统当前时间存入 viewModel.startTime 变量,而后每次 onCreate 被调用时,都会先取出 viewModel.startTime 赋予 Chronometer.base ,然后再启动计时器,因为 ViewModel 不受 Activity 生命周期影响,所以它会一直持有 startTime ,这样即使 Activity 被重建,计时器也能基于正确的时间启动计时

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    if (viewModel.startTime == null) {
        val startTime = SystemClock.elapsedRealtime()
        viewModel.startTime = startTime
        cm.base = startTime
    } else {
        cm.base = viewModel.startTime!!
    }

    cm.start()
}

再次运行,你会看到时间重置的问题得到解决

在这里插入图片描述

ViewModel 结合 LiveData

ViewModel 如果不结合 LiveData 来用的话就失去了它的灵魂,正如人与人之间的默契配合才能发挥出整个团队的潜能,架构组件本着开放灵活的原则,允许你单独集成使用它们其中的任何一个,但我强烈推荐你综合使用整套架构组件,除非你的项目有严格限制或其它特殊情况

前面的 Demo 为了快速理解 ViewModel 的用法所以写的非常简单,接下来我们将使用 Timer + LiveData 来替代 Chronometer 控件实现一个计时器

1、新建 CustomTimer 布局、Activity、ViewModel

custom_timer.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:textColor="@color/colorPrimary"
              android:textSize="24sp"
              android:id="@+id/tv_timer" app:layout_constraintEnd_toEndOf="parent"
              app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent"
              app:layout_constraintBottom_toBottomOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>

CustomTimerViewModel

class CustomTimerViewModel : ViewModel() {
    private var startTime: Long? = null
    private val _elapsedTime = MutableLiveData<Long>()
    var elapsedTime: LiveData<Long> = _elapsedTime
}

CustomTimerActivity

class CustomTimerActivity : AppCompatActivity() {
    private val viewModel by lazy {
        ViewModelProviders.of(this).get(CustomTimerViewModel::class.java)
    }
    @SuppressLint("SetTextI18n")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.custom_timer)
        val tvTimer = findViewById<TextView>(R.id.tv_timer)
    }
}

2、在 ViewModel 中初始化 Timer

我们直接在初始化模块启动 Timer,让它每秒执行一次 timerTask 并在 timerTask 内部更新 elapsedTime 的值为当前时间距离 startTime 的秒数,此处 elapsedTime 为 LiveData 类型,它会随着 ViewModel 初始化开始通过 Timer 自动更新,下一步我们只需要在 Activity 中订阅它即可实时更新数据到 UI

class CustomTimerViewModel : ViewModel() {
    private var startTime: Long? = null
    private val _elapsedTime = MutableLiveData<Long>()
    var elapsedTime: LiveData<Long> = _elapsedTime
    init {
        startTime = SystemClock.elapsedRealtime()
        Timer().scheduleAtFixedRate(timerTask {
            val newValue = (SystemClock.elapsedRealtime() - startTime!!) / 1000
            _elapsedTime.postValue(newValue)
        }, ONE_SECOND, ONE_SECOND)
    }
    companion object {
        const val ONE_SECOND = 1000L
    }
}

3、在 Activity 中订阅 elapsedTime

如下代码,我们使用 viewModel.elapsedTime.observe(owner,Observer) 将 elapsedTime 订阅到 owner

class CustomTimerActivity : AppCompatActivity() {
    private val viewModel by lazy {
        ViewModelProviders.of(this).get(CustomTimerViewModel::class.java)
    }
    @SuppressLint("SetTextI18n")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.custom_timer)
        val tvTimer = findViewById<TextView>(R.id.tv_timer)

        viewModel.elapsedTime.observe(this, Observer {
            tvTimer.text = "$it seconds elapsed"
        })
    }
}

这样 elapsedTime 在变更时就会立即通知 owner 并回调 Observer 接口,我们只要在 onChanged 回调中将数据绑定到 TextView 即可,这就是数据驱动 �UI

Observer 接口

/**
 * A simple callback that can receive from {@link LiveData}.
 *
 * @param <T> The type of the parameter
 *
 * @see LiveData LiveData - for a usage description.
 */
public interface Observer<T> {
    /**
     * Called when the data is changed.
     * @param t  The new data
     */
    void onChanged(T t);
}

运行 app,计时器正常工作并且不会因为转屏等操作重置

在这里插入图片描述

完整示例代码

https://github.com/realskyrin/jetpack_viewmodel

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
非常感谢您的提问!在Android Compose中,我们使用ViewModel来存储和管理数据,因此在两个不同的Compose页面之间传递数据,您可以通过以下步骤实现: 1. 创建一个ViewModel类,它将保存您要在页面之间传递的数据。 ``` import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.setValue import androidx.lifecycle.ViewModel class MyViewModel : ViewModel() { var text by mutableStateOf("我是默认值") } ``` 2. 在第一个Compose页面中,您可以使用`rememberViewModel()`创建ViewModel实例,并调用`viewModel.text`更改存储在ViewModel中的文本。 ``` import androidx.compose.foundation.layout.Column import androidx.compose.material.Button import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.remember import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.runtime.getValue import androidx.lifecycle.ViewModel import androidx.lifecycle.viewmodel.compose.viewModel import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.launch @Composable fun Page1() { val viewModel: MyViewModel = viewModel() Column { Text(text = viewModel.text) Button(onClick = { viewModel.text = "我是来自页面1的数据" }) { Text("更改数据") } } } ``` 3. 您可以在第二个Compose页面中复制第一步,并使用`viewModel()`在该页面中获取前面创建的ViewModel实例。 您可以在此页面中使用存储在ViewModel中的文本。 ``` @Composable fun Page2() { val viewModel: MyViewModel = viewModel() Column { Text(text = viewModel.text) Button(onClick = { viewModel.text = "我是来自页面2的数据" }) { Text("更改数据") } } } ``` 通过这些步骤,我们已经创建了一个ViewModel并在两个Compose页面之间传递数据。同时,这个ViewModel的实例在页面之间共享,因此您可以在ViewModel中存储任何数据,并在Compose页面之间通信。 希望这个示例能够帮助您解决您的问题,如果您还有其他问题,请随时与我联系!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值