数与图（3）
在前两篇文章（数与图（1）、数与图（2））中，我们完成了对坐标系的绘制，现在可以在坐标系中绘制函数图像了。
在高中数学课本里，函数被表示为y=f(x)，在函数的定义域内，每一个x值，都有唯一的y值与其对应。如果你是一个初中生，上面的描述可能有些抽象，你可以用一次函数来理解函数概念，即，对于一次函数y=ax+b，函数的定义域为实数，因此当x取任意实数时，都有唯一的y与x相对应。函数图像指的是，在x的某个指定的取值范围内，用图形来描述y随x的变化。如果x的取值范围是从x0到x1，通常会将x轴上的线段（x1-x0）等分成n个小线段，每个等分点就是x的取值，这样的等分点共有n+1个，同样有n+1个y与x相对应。每一对（x，y）都对应于平面直角坐标系中的一个点，在坐标系中找到这n+1个点，并把它们用线段连接起来，就完成了函数图像的绘制。
本文将带领读者完成三种函数的曲线绘制，它们分别是一次函数（直线）、二次函数及三次函数，其解析表达式分别表示为：
（1）y=ax+b
（2）y=ax2+bx+c
（3）y=ax3+bx2+cx+d
其中a、b、c、d称作系数，当这些系数变化时，函数图像会随之变化，我们将以三次函数为例，观察a、b的变化对函数图像的影响。
本文内容建立在前面两篇文章的基础上，首先打开原有项目，在设计视图中为项目添加几个组件，然后再开始编写绘图程序。
一、添加组件
首先取消勾选Screen1的“显示状态栏”属性，然后再添加组件。如图1所示，在画布下方添加一个标签，命名为“表达式标签”，其用途不言自明。在水平布局4中，保留原有的“画坐标按钮”，在其右侧添加三个开关组件（2019版新增组件），命名方法如图1所示。（临时设屏幕的允许滚动属性为真，可以看到屏幕底部的内容。）
图1 为项目添加标签和开关组件
二、编写程序
首先介绍一下绘图程序的逻辑：
（1）应用启动时，会根据预设的数值绘制坐标系；
（2）当用户点击画坐标按钮时，清空画布，按设定的数值绘制坐标系；
（3）当用户开通某个开关时，首先关闭另外两个开关，然后开始绘制相应的函数曲线。
前两项功能已经在此前的文章中实现，本文将实现第三个功能。
1、新增全局变量
如图2所示，增加五个全局变量，其中的abcd是函数的系数，为简单起见，初始值均设为1；最后一个变量“开关列表”值得特书一笔。熟悉App Inventor的用户都知道，在声明全局变量时，不允许将组件对象作为初始值赋给变量（见“向日葵”案例），但在最新的2019版中，这项操作不再被禁止。
图2 为项目添加新的全局变量
2、新增有返回值过程
（1）求函数值过程
如图3所示，这三个过程非常简单，当给定系数值和x值时，返回函数的值y。
图3 三个求函数值的过程
（2）求y坐标
如图4所示，当开关组件处于不同状态时，给定x值，返回不同类型函数的y值。
图4 求y坐标的过程
（3）求函数表达式
如图5所示，当开关处于不同状态时，返回三种不同类型的函数表达式。这里的表达式并没有将系数替换成具体的值，希望读者自行改进这一功能。
图5 求函数表达式的过程
3、新增无返回值过程——绘制曲线
如图6所示，绘制曲线过程相对复杂一些，不过只要认真阅读过此前的两篇文章，相信很容易理解这个过程里的逻辑。关键逻辑在循环语句中，首先，循环变量的取值对应于函数的x值，循环变量的增量（等分间隔）是十分之一的辅间距。其次，在循环语句内部，针对相邻的两个x值，调用“y坐标”过程获得两个对应的y值。最后，利用画布的画线功能，将相邻的两个点连接起来。重复上述操作，即可完成整个图像的绘制。
图6 绘制曲线过程
4、开关组件的事件处理程序
这里不得不特别告知读者，2019版的App Inventor增加了类代码（任意组件）的事件块，使得我们不必为三个不同的开关组件单独编写事件处理程序。在图7的代码中，首先判断被按下的开关是否处于“开通”状态，如果是，则利用针对列表的循环语句关闭其余两个开关，并更新函数表达式标签，再调用绘制曲线过程。事件块中的参数“组件”即代表被按下的开关。
图7 为三个开关组件编写统一的事件处理程序
三、测试
1、在同一个坐标系中绘制不同函数的图像
在系数不变的情况下（abcd均为1），依次按下三个开关组件，得到3个函数的曲线，测试结果如图8所示。
图8 测试：用相同的系数绘制不同的函数曲线
读者可能会质疑一次函数的图像，y=x+1的斜率应该是1，直线与x轴的夹角应该是45度，为什么图8中不是这样呢？这是因为两个座标轴的伸缩比例不同，如果仔细观察，直线过（-1，0）及（0，1）点。
2、针对不同的系数绘制三次函数曲线
绘图数据如下表所示。
在第一象限绘制三次函数曲线，除了曲线①，其余曲线的系数a均为-1；当a=-1时，保持c、d的值不变，仅让b从1增加到5。测试结果如图9所示。
图9 在第一象限绘制不同系数的三次函数曲线
顺便说一句，三次函数中，a值对曲线形状的影响最大，其次是b，再次是c、d，这里我们仅调整的b的值，喜欢数学的读者可以尝试改变a值，看看它对曲线形状的影响程度。