news 2026/8/16 9:37:01

【大前端】【Android】把 Activity 重构成 MVVM 的对比示例

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
【大前端】【Android】把 Activity 重构成 MVVM 的对比示例

同一个功能:加载用户并显示名字

功能不变:

点按钮 → 请求用户 → 显示用户名 → 失败提示


一、❌ 传统 Activity 写法(所有东西都在 Activity)

Activity(UI类)

public class UserActivity extends AppCompatActivity { TextView tvName; Button btnLoad; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_user); tvName = findViewById(R.id.tvName); btnLoad = findViewById(R.id.btnLoad); btnLoad.setOnClickListener(v -> { // ① UI 事件 loadUser(); }); } private void loadUser() { // ② 业务逻辑 showLoading(); Api.getUser(new Callback<User>() { @Override public void onSuccess(User user) { // ③ 数据处理 tvName.setText(user.getName()); // 改 UI hideLoading(); } @Override public void onError(String msg) { // ④ 错误处理 Toast.makeText(UserActivity.this, msg, Toast.LENGTH_SHORT).show(); hideLoading(); } }); } }

❗问题在哪?

问题原因
Activity 很胖所有职责都在
不可测试依赖 Android
UI & 逻辑耦合直接操作 View
状态不可控loading / error 到处写

二、✅ 重构目标(先不看代码)

我们要做到:

Activity:我只管展示 ViewModel:我管逻辑和状态

Activity不再知道

  • 请求怎么发

  • 什么时候成功 / 失败

  • 状态怎么切换


三、✅ MVVM 写法(拆开)


1️⃣ ViewModel:专门“管状态”

public class UserViewModel extends ViewModel { // 用户名状态 private MutableLiveData<String> userName = new MutableLiveData<>(); // loading 状态 private MutableLiveData<Boolean> loading = new MutableLiveData<>(); // 错误信息 private MutableLiveData<String> errorMsg = new MutableLiveData<>(); public LiveData<String> getUserName() { return userName; } public LiveData<Boolean> getLoading() { return loading; } public LiveData<String> getErrorMsg() { return errorMsg; } public void loadUser() { loading.setValue(true); Api.getUser(new Callback<User>() { @Override public void onSuccess(User user) { userName.setValue(user.getName()); // 只改数据 loading.setValue(false); } @Override public void onError(String msg) { errorMsg.setValue(msg); // 只抛状态 loading.setValue(false); } }); } }

📌注意一个关键点

ViewModel从头到尾没有一句 UI 代码


2️⃣ Activity:变成“数据监听器”

public class UserActivity extends AppCompatActivity { private UserViewModel viewModel; private TextView tvName; private ProgressBar progressBar; private Button btnLoad; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_user); tvName = findViewById(R.id.tvName); progressBar = findViewById(R.id.progressBar); btnLoad = findViewById(R.id.btnLoad); viewModel = new ViewModelProvider(this).get(UserViewModel.class); // ① 监听数据 viewModel.getUserName().observe(this, name -> { tvName.setText(name); }); viewModel.getLoading().observe(this, show -> { progressBar.setVisibility(show ? View.VISIBLE : View.GONE); }); viewModel.getErrorMsg().observe(this, msg -> { if (msg != null) { Toast.makeText(this, msg, Toast.LENGTH_SHORT).show(); } }); // ② 把点击事件“交出去” btnLoad.setOnClickListener(v -> { viewModel.loadUser(); }); } }

四、最重要的一行对比(🔥核心)

以前

tvName.setText(user.getName());

现在

userName.setValue(user.getName());

👉UI 更新从“命令式”变成“数据驱动”


五、用一句话理解“重构发生了什么”

Activity 不再“做事”
ViewModel 不再“碰 UI”
它们通过“状态”交流


六、责任变化对照表(一定要看)

职责以前现在
点击处理ActivityActivity(转交)
网络请求ActivityViewModel
成功失败判断ActivityViewModel
UI 更新ActivityActivity
状态来源ActivityViewModel

七、已经“半只脚进 MVVM 了”的标志

如果现在能理解这句话:

Activity 不知道“什么时候该改 UI”,
它只知道“数据变了我就展示”

那已经抓住MVVM 的核心原理了。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/12 10:41:37

what?动态规划?

动态规划入门&#xff1a;从原理到实战&#xff0c;吃透基础算法动态规划&#xff08;Dynamic Programming&#xff0c;简称 DP&#xff09;是算法领域的核心思想之一&#xff0c;也是面试、竞赛中的高频考点。它并非单一算法&#xff0c;而是一种 “化繁为简” 的解题思路 ——…

作者头像 李华
网站建设 2026/8/15 22:08:50

CommonJS 的缓存机制:为什么二次 require 得到的对象是同一个?

各位同仁&#xff0c;下午好&#xff01;今天&#xff0c;我们将深入探讨 Node.js 中 CommonJS 模块系统的核心机制之一&#xff1a;模块缓存。这是一个看似简单却蕴含深厚设计哲学的机制&#xff0c;它直接决定了我们在 Node.js 应用中管理状态、优化性能以及理解模块行为的关…

作者头像 李华
网站建设 2026/8/16 6:46:12

跨标签页通信的五种方案:LocalStorage、BroadcastChannel 与 SharedWorker

各位同仁&#xff0c;下午好&#xff01;今天&#xff0c;我们将深入探讨前端开发中一个既常见又关键的议题&#xff1a;跨标签页通信。在现代Web应用中&#xff0c;用户经常会同时打开多个标签页或窗口来访问同一个网站的不同部分&#xff0c;或者处理同一任务的不同阶段。在这…

作者头像 李华
网站建设 2026/8/16 2:44:24

2、UNIX基础入门教程

UNIX基础入门教程 1. UNIX系统概述 UNIX是一个多用户、多任务的操作系统环境,与个人计算机不同,它天生就允许多个用户同时访问系统。无论你是在大型多用户系统上使用UNIX,还是使用基于UNIX的专用工作站,其多用户、多任务的架构都会影响你的工作方式以及系统对你作为用户和…

作者头像 李华
网站建设 2026/8/16 13:45:52

6、互联网通信全解析:从邮件到多媒体的多元世界

互联网通信全解析:从邮件到多媒体的多元世界 1. 互联网通信概述 互联网自诞生以来,其核心目的便是促进人们之间的交流。最初由军方开发,旨在构建一个在核攻击下仍能持续运行的分布式通信网络。随着时间的推移,互联网已广泛惠及众多群体,如中学、家庭用户和私营企业等。在…

作者头像 李华