MVC 模式的最基本概念是分层设计，把我们的代码基于 View（视图）、Model（模型）、Controller（控制器）进行分类封装，这样做的目的是为了清晰结构，使代码更易维护和扩展。

在上一篇文章中，我们完成了计算器的界面还原，但严格来说并不是真正的 View 类，因为它还没反映视图的逻辑。在这次文章中，我们将编写计算器程序的 View 部分，Let’s Go!
（注意：这次在代码的注释中写了较多的点，所以可以多看注释部分）

一，初识 Activity

Activity（活动）作为 Android 四大组件之一，相当于应用中的整个界面，用前端的角度看，就像一个 web 页。而 Activity 的实质是什么呢？这次先简要描述，从 Google 大神中可知，Activity 起始继承于 Context 类，来看看它们的描述关键词：

android.content.Context

Interface to global information about an application environment … It allows access to application-specific resources and classes, as well as up-calls for application-level operation …
原来 Context 被定义为关于应用场景(上下文)的抽象类，具有访问应用层面资源和类的权限，并封装了一些应用级别的方法。

android.app.Activity

An activity is a single, focused thing that the user can do … interact with the user … takes care of creating a window (full-screen windows or floating windows) for place UI …
Activity 被定义为与用户交互(事件)，负责创建加载视图的窗口等功能的功能类。可以说因 Context，使 Activity 具有强大的功能。

在开始编写前，先介绍一个重要的 Java 文件 – R.java，在前面介绍过，gen 目录会自动生成一些系统需要的文件，打开 R.java：

R 类通过 attr，color，drawable，id，layout 等静态内部类，记录了所有标识。
（注意：R类的标识会自动生成，不用去修改）

 二，在 onCreate 中编写我们的程序

Activity 有个明显的特点，就是有生命周期。可以想象一下平时应用的使用过程，从一个界面滑入至另一界面，又从当前界面返回，伴随的就是 Activity 周期的不同阶段。打开 Calculator 项目的 MainActivity.java 文件：

在前端编程中，最重要的是获取操作对象（dom）。在 Android 中也如此，主要通过 id 标识获取操作对象。我们首先给activity_main.xml 中的 TextView 和 Button 加上以下 id 标识：
（@+id/{name} 的意思是在 R 类中增加为 {name} 的 id 标识）

• TextView：@+id/ResultOutput
• Button 数字 0 ~ 9：@+id/Operand0 ~  @+id/Operand9
• Button 除号：@+id/Operate0
• Button 乘号：@+id/Operate1
• Button 减号：@+id/Operate2
• Button 加号：@+id/Operate3
• Button 等号：@+id/Operate4
• Button 清除：@+id/Operate5

如图所示，请务必为元素加上正确的 id。

在 Android 中，主要通过 findViewById() 方法获取操作对象，如TextView的获取：

在前端编程中，我们可以通过 getElementsByTagName() 方法获取一系列操作元素，但在 Android 中却没那么幸运了，没有这种方法。那有什么快捷点的方式不？答案是肯定的。我们知道 findViewById() 传入的是一个 int 类型的引用值，那么可否通过循环的方式找出这些引用值，然后直接获取呢？我们把 Button 元素分为两组，操作数的 id 以 Operand0 ~ 9 命名。而其余为运算符，则以 Operate0 ~ 5 命名（如上面提示的）。这样我们则可以：

这样，通过一个 TextView 和两个数组，我们就把需要的操作元素全部收集好了。

三，分离及定义 View 类的接口

从上面的代码看，一切似乎都很美好，但这种面向过程的思考方式是导致代码迅速膨胀，难以维护的原因之一。按 MVC 的设计思想，上面编写的代码应属于视图部分的逻辑，更好的办法应该封装在视图内，实现细节不被其它类所知。我们现在遵循这一思想从新组织一下代码：
（注意：这里只朴素地用 MVC 思想表达意图，至于划分及编写的合理性就不探究了）

计算器将由两个 View 类组成，一个是用于显示结果的 CaOutputView 类，一个是用于用户输入的 CaInputView 类。首先建立存放 View 类的包，通过包区分不同类型文件。

然后我们建立这两个 View 类：

接着，我们打开 CaInputView.java 文件。好了，现在我们来思考一个问题，CaInputView 负责与用户的交互，自然会知道用户按了什么按钮，但怎样通知 Activity 用户的行为呢？ 这个就是我们准备要接触的回调机制的概念。

就好比，CaInputView 对 Activity 说：你把“联系方式”留我，用户输入了我就通知你。而“联系方式”有多种实现的方式。这次就通过委托的方式实现，相当于 iOS 中的代理（delegate）的概念：

四，编写 View 类

现在我们继续编写 CaInputView类，把原先 Activity 类的代码逻辑归入 CaInputView 类：

继续编写 CaOutputView 类，CaOutputView 类比较简单，只用于显示：

五，在 Activity 中使用 View 类

两个 View 已经创建完毕，现在可以尝试在 Activity 中使用了：

上图提示错误，是因为实例化了 CaInputView，却没有实现接口，所以提示 MainActivity 应该实现 CaInputView 声明的接口：

实现 CaInputView 声明的接口后仍然会报错，因为没实现接口声明的方法，选择“Add unimplemented methods”则自动添加了方法，如下图：

最后当 CaInputView 与用户发生交互时，我们“通知” Activity，而 Activity 则调用 CaOutputView 将结果显示出来，MainActivity 类的最终代码如下图：

运行程序，点击每个按钮，看是否显示正确的值：

通过分层设计，MainActivity 中的代码变得简洁很多，它只需知道如何使用 View 类则可，使它可以专注于自己的责任部分。

六，总结

这次说了的点比较多，主要有：

• MVC 的设计概念
• 两种方式获取操作对象
• Java 的类型及转型相关概念
• 回调机制及接口
• 如何使用 View 类

如果对这些点还不清晰，可以再细看注释部分，或者留言给我，我会尽快答复。另外我也会尽量加快更新进度，下周将利用递归函数编写我们的 Model 类，敬请期待。

前端之Android入门(4) – MVC模式(中)