App-Inventor移动应用开发标准教程7-课件.pptx

1、一个二维的、具有触感的矩形面板，可以在其中绘画，或让精灵在其中移动。可以在设计或编程视图中设置其背景色背景色、画笔颜色画笔颜色、背景图背景图、宽宽、高高等属性。以像素为单位。画布上的任何一点都可以表示为一对坐标(x,y)，其中 x表示该点距离画布左边界的像素数 y表示该点画布距离上边界的像素数直角坐标与计算机屏幕坐标X轴Y轴+-(0, 0)直角坐标系X轴Y轴+(0, 0)计算机屏幕坐标画布的坐标系原点在画布左上角X向右增加Y向下增加单位为像素点画布可以感知触摸触摸事件，并获知触碰点，也可以感知对其中精灵精灵(图像精灵图像精灵或球球)的拖拽。此外，组件还具有画点、画线及画圆的方法。字号（Font

2、Size）：绘制在画布上的文字的大小。线宽（LineWidth）：在画布上绘制时，线的宽度。画笔颜色（PaintColor）：在画布上绘制图形时，线的颜色。文本对齐（TextAlignment）：决定了由“画字”或“沿角度画字”方法绘制文本时文本对齐方式。被拖动（Dragged）：当用户在画布上从一个点(前点X坐标, 前点Y坐标)推拽到另外一个点（当前X坐标，当前Y坐标）时触发，（起点X坐标，起点Y坐标）表示用户首先触摸屏幕的地方，“draggedAnySprite”表示是否有精灵被拖拽，返回的是逻辑值。被划动（Flung）：当用户手指在画布上划过时（快速滑动），触发该事件。提供了划动的起点位

3、置（x坐标，y坐标）（相对于画布左上角的位置），划动的速度(每毫秒像素数)及方向H(0至360度)以及速度在x、y方向的分量速度X分量和速度Y分量，“被划动精灵”表示在划动起点处是否有精灵，如有返回的是逻辑值真。被按压（TouchDown）：当用户开始触摸画布(将手指放在画布上尚未移开时)触发该事件，提供了触碰点的位置（x坐标，y坐标）（相对于画布左上角）。被松开（TouchUp）：当用户停止触摸画布时(在被按压事件之后抬起手指)触发该事件，提供了触碰点的位置（x坐标，y坐标）（相对于画布左上角）。被触碰（Touched）：当用户触摸画布并抬起手指时，触发该事件，提供了触碰点的位置（x坐标，y

4、坐标）（相对于画布左上角）。如果触摸的同时碰到了精灵，touchedAnySprite的值为真，否则为假。用户触碰画布，然后移开画布时事件触发的过程是，当用户触碰画布，尚未移开时，触发“被按压”事件，当用户手指抬起手指时触发“被松开”和“被触碰”事件。按压、松开和触碰事件比较用户触碰一下画布然后松开，将产生三个点，变化过程清除画布（Clear）：清除画布上绘制的任何东西，但背景色、图片除外（包括精灵）。画圆（DrawCircle）：以给定的圆心（centerX,centerY）和半径radius在画布上绘制圆，默认为实心圆，fill参数设置是实心圆还是空心圆，true为实心圆。画线（DrawL

5、ine）：在画布上给定的两点坐标之间画线。画点（DrawPoint）：在画布上给定的坐标位置画点。画字（DrawText）：用画布设定的字号和对齐方式属性在画布上指定坐标位置画文字。沿角度画字（DrawTextAtAngle）：用画布设定的字号和对齐方式属性在画布上以指定的角度在指定坐标位置画文字。求背景像素色值（GetBackgroundPixelColor）：获取画布上指定点的颜色值，颜色包括背景色和画布上的任何绘制点、线、圆，但不包括精灵的颜色。求像素颜色值（GetPixelColor）：得到指定点的颜色值(包括精灵的颜色)。设背景像素色值（SetBackgroundPixelColor

6、）：为画布上的指定点设置背景色。保存（Save）：把画布上的内容保存到设备的存储器中。如果保存出错，将触发屏幕的出现错误事件。默认保存在内部存储的My Documents/Pictures下，文件名称为app_inventor_*.png，*表示一串数字。将画布上绘制的内容以指定的文件名保存到设备的外部存储器中。文件扩展名必须是.jpg、.jpeg、或.png，扩展名决定了文件的类型。图像精灵精灵只能被放置在画布画布内；精灵有多种响应行为：它可以回应触摸及拖拽事件，与其他精灵(球球及其他精灵精灵)及画布边界产生交互；它具有自主行为：根据属性值进行移动；它的外观由图片图片属性所设定的图像决定(除

7、非将可见可见属性设置为假)。例如，如果想让图像精灵在每1000毫秒(1秒钟)内向左移动10个像素，则须将图像精灵的速度属性设置为10像素，间隔属性设为1000毫秒，方向属性设为180度，并将启用属性设为真。启用（Enabled）：当精灵的速度不为零时，控制精灵是否可以移动。方向（Heading）：返回精灵相对于x轴正方向之间的角度来表示的方向。0度指向屏幕的右方，90度指向屏幕的顶端。间隔（Interval）：以毫秒数表示精灵位置更新的时间间隔，例如：如果间隔为50，速度为10，则精灵每50毫秒移动10个像素。图片（Picture）：图片决定了精灵的外观。旋转（Rotates）：如果选中，则精

8、灵图像将随精灵方向的改变而改变。如果不选，则精灵方向的改变不会引起精灵图像的旋转。精灵围绕它的中心点旋转。速度（Speed）：精灵移动的速度，精灵在每个间隔内移动多少像素。被碰撞（CollidedWith）：处理碰撞事件，当两个精灵发生碰撞时，触发该事件。需要注意的是，检查和旋转的图像精灵的碰撞时，是以其旋转之前的位置为依据进行碰撞检测的。因此对于那些旋转的细长或扁平的精灵来说，此时的碰撞检测是不精确的。到达边界（EdgeReached）：当精灵到达屏幕的边界时，调用该事件。如果在事件处理程序中调用反弹方法，精灵将在它到达的边界反弹。这里用整数表示边界8个方向，北（1），东北（2），东（3），

9、东南（4）， 南（-1），西南（-2），西（-3），西北（-4）。结束碰撞（NoLongerCollidingWith）：当两个精灵不再碰撞时，触发该事件。反弹（Bounce）：就像撞墙之后反弹一样，使精灵反弹。在正常的反弹中，边界参数通过到达边界事件返回。碰撞检测（CollidingWith）：检测精灵是否与指定的被检测精灵之间发生了碰撞。移动到边界（MoveIntoBounds）：如果精灵的一部分超出了画布的边界，则将其移动回边界，否则无影响。如果精灵太宽超出了画布，则精灵与画布的左边界对齐；如果精灵太高超出了画布，则精灵与画布的顶端边界对齐。移动到指定位置（MoveTo）：将精灵移动到指

10、定位置（x坐标,y坐标)，精灵的左上角对应指定位置。转向指定位置（PointInDirection）：转动精灵朝指定的某个坐标点(x坐标,y坐标)。转向指定对象（PointTowards）：转动精灵指向另一个指定的精灵，新的方向与两个精灵中心点的连线平行。组件组件所属组件组所属组件组命名命名用途用途属性属性画布画布绘图动画画布1绘画背景颜色：绿色高度：320像素宽度：320像素线宽：2图像精灵图像精灵绘图动画图像精灵_Hole1地鼠洞X坐标：20Y坐标：60图像精灵图像精灵绘图动画图像精灵_Hole2地鼠洞X坐标：130Y坐标：60图像精灵图像精灵绘图动画图像精灵_Hole3地鼠洞X坐标：24

11、0Y坐标：60图像精灵图像精灵绘图动画图像精灵_Hole4地鼠洞X坐标：75Y坐标：140图像精灵图像精灵绘图动画图像精灵_Hole5地鼠洞X坐标：185Y坐标：140图像精灵图像精灵绘图动画图像精灵_地鼠地鼠图片：mole.png水平布局水平布局1 1界面布局水平布局1水平排列组件宽度：充满标签标签用户界面标签_分数显示文字分数字号：28文本：分数:标签标签用户界面标签_分数值显示击中次数字号：28文本：0标签标签用户界面标签_时间显示文字时间字号：28文本：时间:标签标签用户界面标签_剩余时间显示剩余时间字号：28文本：60按钮按钮用户界面按钮_重新开始重新开始游戏文本：重新开始计时器计时

12、器传感器计时器1控制地鼠的移动频率计时间隔：1000音效音效多媒体音效_地鼠叫当地鼠被击中时叫声源文件：rat.mp3该组件可以置于画布画布上，是一个圆形的精灵精灵，可以与外界进行交互，交互方式有三种：用户可以通过触摸及拖拽的方式与之交互；与其他精灵精灵(包括图片精灵图片精灵及其他球球)之间通过碰撞的方式交互；与画布画布的边缘之间的交互。该组件会依据自身的属性值进行移动。例如，想让球球在每500毫秒(半秒钟)的时间里向画布的顶部移动4个像素，就可以将球球的速度速度属性设置为4像素，时间间隔时间间隔属性设置为500毫秒，方向方向属性设置为90度，并将启用启用属性设置为真真，而且可以随时修改这些属

13、性。球球组件与图像精灵图像精灵组件之间的差别在于，后者可以通过设置图像图像属性来改变自己的外观，而球的外观只能通过改变它的颜色颜色及半径半径来实现。方向方向，以角度来表示精灵的方向，x轴的正方向为0度，即指向屏幕的右侧；90度指向屏幕的顶部。时间间隔时间间隔，以毫秒为单位，精灵位置变化的时间间隔。如，如果间隔为50，且速度为10，则精灵每50毫秒移动10个像素的距离。速度速度，精灵移动的速度：在每个时间间隔内移动的像素数。Z Z，精灵在垂直于屏幕方向上的层级，高层级的精灵将遮挡低层级的精灵，即高层级精灵在前，而低层级精灵在后。例太空侵略者太空侵略者组件组件所属组件组所属组件组命名命名用途用途属

14、性属性ScreenScreen默认屏幕Screen1允许滚动：选择标题：Space Invaders画布画布绘图动画画布1绘画背景颜色：黑色高度：300像素宽度：充满图像精灵图像精灵绘图动画图像精灵_火箭火箭炮图片：rocket.pngX坐标：144Y坐标：230图像精灵图像精灵绘图动画图像精灵_飞碟飞碟图片：saucer.pngY坐标：74球形精灵球形精灵绘图动画球形精灵_子弹火箭炮发射的子弹半径：8颜色：绿色水平布局水平布局1 1界面布局水平布局1水平排列组件水平对齐：居中宽度：充满标签标签用户界面标签1显示文本“分数：”文本：分数:标签标签用户界面标签_分数显示射中次数字号：28文本：0按钮按钮用户界面按钮_重新开始重新开始游戏文本：重新开始计时器计时器传感器计时器1控制飞碟移动计时间隔：1000太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者太空侵略者实验实验5 5：设计一个几何图形生成器，可以绘制点、线、圆、矩形、立方体等基本图形和自由绘制图形。 实验实验6 6：利用绘图动画组件设计和实现一个小游戏。