2.5　实战项目：简单计算器

到目前为止，虽然只学了一些Android的初级控件，但是也可以学以致用，即便只有这些简单的布局和控件，也能够做出实用的App。接下来尝试设计并实现一个简单计算器。

2.5.1　设计思路

计算器是人们日常生活中最常用的工具之一，无论在电脑上还是手机上，都少不了计算器的身影。以Windwos上的计算器为例，界面简洁且十分实用，程序界面如图2-31所示。

这个计算器界面主要分为两部分，一部分是上面的文本框，用于显示计算结果；另一部分是下面的几排按钮，用于输入数字与各种运算符。为了减少复杂度，可以精简一些功能，只保留数字与加、减、乘、除四则运算，另外补充一个开根号（求平方根）的运算。至于App的显示界面，基本与习惯的计算器界面保持一致，经过对操作按钮的适当排列，调整后的设计效果如图2-32所示。

图2-31　Windows的计算器

图2-32　简单计算器的设计

这个计算器虽然小巧，但是基本囊括了本章的知识点，先来看看用了哪些控件。

• 线性布局LinearLayout：计算器界面整体上是从上往下布局的，所以需要垂直方向的LinearLayout；下面部分每行都有4个按钮，又需要水平方向的LinearLayout。
• 滚动视图ScrollView：虽然计算器界面不宽也不高，但是以防万一，最好还是加个垂直方向的ScrollView。
• 文本视图TextView：很明显上方标题“简单计算器”就是TextView，下面的计算结果也需要使用TextView，而且是能够自动从下往上滚动的TextView，即聊天室效果的文本视图。
• 按钮Button：绝大多数数字与运算符按钮都采用Button控件。
• 图像视图ImageView：暂时未用到。
• 图像按钮ImageButton：开根号的运算符“√”虽然能够打出来，但是右上角少了数学课本上的一横，所以该按钮要用一张标准的开根号图片显示，这就用到了ImageButton。
• 状态列表图形：每个按钮都有按下和弹起两种状态，这里定制了按钮控件的自定义样式，因此用到了状态列表图形。
• 形状图形：运算结果用到的文本视图边框是圆角矩形，所以得给它定义一个shape文件，把shape定义的圆角矩形作为文本视图的背景。
• 九宫格图片：注意计算器界面左下角的“0”，该按钮是其他按钮的两倍宽，如果使用普通图片当背景，势必造成边缘线被拉宽、拉模糊的问题，故而要采用点九图片避免这种情况。

经过对计算器效果图的详细分析，大家初步了解了所运用的控件技术，接下来就可以对界面进行布局和排列了。

2.5.2　小知识：日志Log／提示Toast

在正式编码之前，读者有必要了解一下Android中的运行信息调试手段。例如，开发C程序时，程序员常用printf函数输出程序日志；开发Java程序时，程序员常用System.out.println函数输出程序日志。同样，App开发也有相应的函数输出提示信息。提示信息可分为两类，一类是给开发者看的，另一类是给用户看的。

1. Log

给开发者看的提示信息要调用Log类的相应方法，日志打印结果可在Android Studio界面下方的logcat小窗口查看。Log类各种方法的区别在于日志的等级，具体说明如下。

• Log.e：表示错误信息，比如可能导致程序崩溃的异常。
• Log.w：表示警告信息。
• Log.i：表示一般消息。
• Log.d：表示调试信息，可把程序运行时的变量值打印出来，方便跟踪调试。
• Log.v：表示冗余信息。

若想查看App的运行日志，可单击Android Studio底部的“Logcat”标签，此时主界面的下方弹出一排的日志窗口，如图2-33所示，从日志看出正在进行的运算操作是“5*9=？”。

图2-33　Android Studio的日志查看窗口

日志窗口的顶部是一排条件筛选控件，从左到右依次为：测试机型的名称（如“DOOV V3”）、测试App的包名（例如只显示com.example.junior的日志）、查看日志的级别（例如只显示级别不低于Verbose即Log.v的日志）、日志包含的字符串（例如只显示包含CalculatorActivity的日志），还有最后一个是筛选控制选项（其中“Show only selected application”表示只显示选中的应用日志，而“No Filters”则表示不进行任何条件过滤）。

2. Toast

给用户看的提示信息要调用Toast类的相应方法，提示文字会在屏幕下方以一个小窗口临时展现。对于计算器来说，有好几种情况需要提示用户，如“被除数不能为0”“开根号的数值不能小于0”等。

Toast的简单用法只需一行代码就可以了，示例代码如下：

          Toast.makeText(MainActivity.this, "提示文字", Toast.LENGTH_SHORT).show();

Toast弹窗的展示效果如图2-34所示，此时App发现了被除数为零的情况。

图2-34　被除数为零的Toas

另外，计算器每个按钮的展示风格基本相同，为了减少冗余代码，可将相同的样式定义写在values目录下的styles.xml文件中，然后在布局文件节点下增加style="@style/btn_cal"这样的属性定义。

2.5.3　代码示例

图2-35　简单计算器的运行

看到这里，估计读者对计算器App的布局和代码框架都了然于胸了，接下来介绍一些业务逻辑判断与基本的数学四则运算。只要设计充分并且合理，编码就会很快。计算器App运行后的计算效果如图2-35所示。

编码过程主要分为3个步骤：

步骤01 先想好代码文件与布局文件的名称，比如代码文件取名CalculatorActivity.java、布局文件取名activity_calculator.xml。记得在AndroidManifest.xml中注册acitivity节点，不然App运行时会报ActivityNotFoundException异常，具体是在application节点下补充一行声明：

          <activity android:name=".CalculatorActivity" />

步骤02 在res/layout目录下创建布局文件activity_calculator.xml，按照简单计算器的效果图在里面填入各控件的布局结构，并指定相关的属性定义。

步骤03 在项目的包名目录下创建CalculatorActivity类，仿照MainActivity代码在onCreate内部的setContentView方法中填入参数R.layout.activity_calculator，表示该页面使用activity_calculator.xml中定义的界面布局。接着编写具体的控件操作与业务代码。

下面是计算器App进行加减乘除的代码片段示例，完整代码参见本书附带源码junior模块的CalculatorActivity.java： 6JaqdUR1Ag5s22O2SutjoLwXtrWMEKZt7l2rz3PETXNBQX7qximEMFeVLI/cAXQK