Android开发实战班 - 应用架构 - 单向数据流（Unidirectional Data Flow, UDF）

单向数据流（Unidirectional Data Flow, UDF） 是一种架构模式，旨在通过单一的数据流动方向来管理应用的状态和 UI 更新。UDF 可以有效地减少数据流混乱，提高代码的可预测性和可维护性。在 Android 开发中，UDF 通常与 MVVM 架构结合使用，通过 ViewModel 和 UI 组件之间的数据流动来实现应用状态的管理。本章节将介绍单向数据流的概念、UDF 在 Android 中的应用、实现方式以及实战案例。

14.1 单向数据流（UDF）简介

• 什么是单向数据流:

  • 单向数据流是一种架构模式，数据在应用中只能沿着一个方向流动：数据从数据源流向 UI，UI 只能通过事件将用户操作反馈给数据源，而不能直接修改数据源。
  • 数据流动方向：数据源（Model） -> UI（View） -> 用户操作 -> 数据源（Model）

• UDF 的优势:

  • 可预测性: 数据流动方向单一，代码行为更可预测。
  • 可维护性: 数据流清晰，代码更易于理解和维护。
  • 可测试性: 数据流分离，UI 和数据逻辑可以独立测试。
  • 一致性: 所有数据更新都通过数据源进行，避免数据不一致问题。

• UDF 的核心原则:

  • 单一数据源: 应用的状态由单一的数据源管理，例如 ViewModel。
  • 单向数据流动: 数据只能从数据源流向 UI，UI 通过事件将用户操作反馈给数据源。
  • 状态驱动 UI: UI 根据状态进行渲染，而不是直接修改状态。

14.2 UDF 在 Android 中的应用

在 Android 开发中，UDF 通常与 MVVM 架构结合使用，通过 ViewModel 和 UI 组件之间的数据流动来实现应用状态的管理。以下是 UDF 在 Android 中的典型应用场景：

1. ViewModel 作为单一数据源:

   • ViewModel 持有应用的状态，并暴露数据给 UI。
   • UI 通过观察 ViewModel 中的 LiveData 或 Flow 来更新 UI。

2. UI 通过事件反馈用户操作:

   • UI 通过调用 ViewModel 提供的方法来反馈用户操作，例如按钮点击、文本输入等。
   • ViewModel 处理用户操作，并更新状态。

3. 状态驱动 UI 更新:

   • UI 根据 ViewModel 中的状态进行渲染，而不是直接修改状态。

14.3 UDF 的实现方式

14.3.1 使用 LiveData 实现 UDF

• ViewModel:

  • ViewModel 持有状态，并暴露 LiveData 给 UI。
  • ViewModel 提供方法来更新状态。

  class MyViewModel : ViewModel() {
      private val _data = MutableLiveData<String>()
      val data: LiveData<String> get() = _data
  
      fun updateData(newData: String) {
          _data.value = newData
      }
  }
  

• Activity 或 Fragment:

  • Activity 或 Fragment 观察 ViewModel 中的 LiveData，并更新 UI。
  • Activity 或 Fragment 通过调用 ViewModel 提供的方法来反馈用户操作。

  class MyActivity : AppCompatActivity() {
      private lateinit var viewModel: MyViewModel
  
      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          setContentView(R.layout.activity_main)
  
          viewModel = ViewModelProvider(this).get(MyViewModel::class.java)
          viewModel.data.observe(this) { data ->
              // 更新 UI
              findViewById<TextView>(R.id.textView).text = data
          }
  
          // 反馈用户操作
          findViewById<Button>(R.id.button).setOnClickListener {
              viewModel.updateData("New Data")
          }
      }
  }
  

14.3.2 使用 Flow 实现 UDF

• ViewModel:

  • ViewModel 持有状态，并暴露 Flow 给 UI。
  • ViewModel 提供方法来更新状态。

  class MyViewModel : ViewModel() {
      private val _dataFlow = MutableStateFlow<String>("")
      val dataFlow: StateFlow<String> get() = _dataFlow
  
      fun updateData(newData: String) {
          _dataFlow.value = newData
      }
  }
  

• Activity 或 Fragment:

  • Activity 或 Fragment 使用 collectAsState 观察 ViewModel 中的 Flow，并更新 UI。
  • Activity 或 Fragment 通过调用 ViewModel 提供的方法来反馈用户操作。

  @Composable
  fun MyComposable(viewModel: MyViewModel) {
      val data by viewModel.dataFlow.collectAsState()
  
      Column {
          Text(text = data)
          Button(onClick = { viewModel.updateData("New Data") }) {
              Text(text = "Update Data")
          }
      }
  }
  

14.4 UDF 的实战案例

1. 案例一：使用 UDF 实现计数器应用

   • 创建一个 ViewModel，使用 LiveData 存储计数器的值。
   • 在 Activity 中观察 LiveData，更新 UI。
   • 通过按钮点击事件更新计数器的值。

   class CounterViewModel : ViewModel() {
       private val _count = MutableLiveData<Int>()
       val count: LiveData<Int> get() = _count
   
       fun increment() {
           _count.value = (_count.value ?: 0) + 1
       }
   }
   
   class CounterActivity : AppCompatActivity() {
       private lateinit var viewModel: CounterViewModel
   
       override fun onCreate(savedInstanceState: Bundle?) {
           super.onCreate(savedInstanceState)
           setContentView(R.layout.activity_counter)
   
           viewModel = ViewModelProvider(this).get(CounterViewModel::class.java)
           viewModel.count.observe(this) { count ->
               findViewById<TextView>(R.id.textViewCount).text = count.toString()
           }
   
           findViewById<Button>(R.id.buttonIncrement).setOnClickListener {
               viewModel.increment()
           }
       }
   }
   

2. 案例二：使用 UDF 实现图片浏览应用

   • 创建一个 ViewModel，使用 Flow 存储图片列表。
   • 在 Jetpack Compose Composable 中观察 Flow，更新 UI。
   • 通过按钮点击事件加载图片列表。

   @HiltViewModel
   class ImageViewModel @Inject constructor(
       private val apiService: ApiService
   ) : ViewModel() {
       private val _imagesFlow = MutableStateFlow<List<Image>>(emptyList())
       val imagesFlow: StateFlow<List<Image>> get() = _imagesFlow
   
       fun loadImages() {
           viewModelScope.launch {
               val images = apiService.fetchImages()
               _imagesFlow.value = images
           }
       }
   }
   
   @Composable
   fun ImageScreen(viewModel: ImageViewModel) {
       val images by viewModel.imagesFlow.collectAsState()
   
       Column {
           LazyColumn {
               items(images) { image ->
                   Image(
                       painter = painterResource(id = image.resId),
                       contentDescription = image.description
                   )
               }
           }
           Button(onClick = { viewModel.loadImages() }) {
               Text(text = "Load Images")
           }
       }
   }
   

14.5 课后作业

1. 任务一：使用 UDF 实现用户列表应用

   • 创建一个 ViewModel，使用 LiveData 存储用户列表。
   • 在 Activity 中观察 LiveData，更新 RecyclerView。
   • 通过按钮点击事件加载用户列表。

2. 任务二：使用 UDF 实现图片浏览应用

   • 创建一个 ViewModel，使用 Flow 存储图片列表。
   • 在 Jetpack Compose Composable 中观察 Flow，更新 UI。
   • 通过按钮点击事件加载图片列表。

3. 任务三：使用 UDF 实现网络请求

   • 创建一个 ViewModel，使用 UDF 进行网络请求。
   • 在 Activity 中观察 ViewModel 的 LiveData，更新 UI。

通过本章节的学习，学员将能够掌握单向数据流（UDF）的概念、实现方式以及在 Android 开发中的应用，并能够使用 UDF 实现应用状态的管理，提高代码的可预测性和可维护性。