当前课程知识点:移动快速应用开发 > 第五章 我的绘图板 > 手指作画 > 手指作画
大家好
在前一讲里我们完成了绘图版的界面设计部分
在这一讲中
我们将进行手指作画和画圆功能的开发
在APP Inventor的中
画图和动画必须通过画布组件来实现
画布的宽和高必须为正值
以像素为单位
在画布上任何一点都可以表示为一对坐标值(x,y)
其中X表示该点距离画布左边界的像素数
y表示是该点距离画布上边界的像素数
画布组建有多种响应事件
实现手指作画需要响应画布的被拖动世界
画圆功能由球形精灵组件来实现
该组件是一个圆形的精灵
可被放置在画布上
球形精灵会依据自身的属性进行移动
下面我们就来完成具体实现
前面一节课我们已经介绍了界面的设计
下面我们就来进行逻辑设计
在手机中画画最常见的使我们手指进行拖动
从实际生活中
我们认为手指拖动是一个连续的过程
但是手机在实际处理时是将连续的过程
分解为密集的离散采样点
实现手指作画
需要响应画布的被拖动事件
在实践中一共有七个参数
其中起点X坐标和起点Y坐标
记录的是手指
刚刚触碰到画布
开始拖动的起点位置
当前X和当前Y坐标记录的是当前时间点
采集到了手指触摸画布的位置
前点X和前点Y坐标记录的是上一个采样点
采集到的坐标
而拖动任何精灵是一个逻辑值
表示它是否拖拽了某个精灵
那么下面我们就开始具体的设置这个事件
首先我们需要设置画布的画笔
颜色为绿色
选择设置画布的画笔颜色为绿色
接着 设置画布的线宽
设置画布的线宽
在这里我们不能设置画布的线宽为某一个
具体值
所以我们需要在设计一个全局变量
在变量中
我们设置一个全局变量
变量名我们设置为线宽
初始值我们设置为5
那么在画布被拖动事件
我们就可以设置画布的线宽
为global线宽
接着我们调用画布的画线
方法设置X1为前点X坐标
y1为前点
y坐标
X2
我们设置为当前X坐标
y2
我们设置为当前y坐标
这样
画布拖动
事件就设置完成了
-App Inventor简介
-第一个应用-喵喵叫的小猫
--喵喵叫的小猫
-App Inventor的调试方法
-作业--作业
-拓展练习
-石头剪刀布界面设计
-选择结构
--选择结构
-组件介绍
--组件介绍
-石头剪刀布逻辑设计
-作业--作业
-计算器的界面设计
--计算器的界面设计
-过程的定义
--过程的定义
-实现整数运算的计算器
-带小数点的计算器
--带小数点的计算器
-代码测试
--代码测试
-作业--作业
-我的词典界面设计
--我的词典界面设计
-语言翻译
--语言翻译
-文字朗读
--文字朗读
-语音识别
--语音识别
-作业--作业
-绘图板界面设计
--绘图板界面设计
-手指作画
--手指作画
-精灵画圆
--精灵画圆
-绘图的保存
--绘图的保存
-作业--作业
-社交应用界面设计
--社交应用界面设计
-拨号并收发短信
--拨号并收发短信
-短信的分类保存
--短信的分类保存
-短信的选择与删除
--短信的选择与删除
-作业--作业
-条码扫描器
--条码扫描器
-申请Web-API的步骤和调试方法
-Web客户端
--Web客户端
-JSON格式数据的解析方法
-扫码识物
--扫码识物1
--扫码识物2
-作业--作业
-人工智能技术介绍
--人工智能技术介绍
-扫描仪界面设计
--扫描仪界面设计
-百度AI 函数介绍
-扫描仪的代码实现
--扫描仪的代码实现
-作业--作业
-拓展练习