数字涂鸦
先了解你将做出什么
应用介绍
把手机屏幕变成一个可以随手涂鸦的画板:手指拖动就画线,摇动手机可以擦除全部内容。

连接你的应用
通过 WiFi 连接设备
使用 AI 伴侣连接后,可以在手机或平板上实时查看和测试应用。

视频演示:
安装 AI 伴侣
使用手机系统扫码器或浏览器扫描二维码,下载并安装 AI 伴侣。只需安装一次,以后可以直接使用。

打开应用的连接二维码
在 App Inventor 2 中依次点击「连接」和「AI 伴侣」。

连接手机
连接二维码会显示在电脑屏幕上。

在手机 AI 伴侣中点击蓝色的「scan QR code」按钮扫描二维码;也可以输入代码,再点击橙色的「connect with code」按钮。

使用模拟器连接
模拟器由 aiStarter 自动启动,不需要手机,但速度较慢、环境配置较复杂且 Android 版本较旧,一般不推荐作为首选方式。
使用 USB 连接
aiStarter 可以通过 USB 调试连接手机,并自动启动手机上的 AI 伴侣。它的使用效果和扫描二维码连接基本相同。
查看完整连接教程
下面的视频完整演示 AI 伴侣、模拟器和 USB 三种连接方式。不同方式的详细比较可以查看连接方式说明。
仍然无法连接?
可以前往中文社区查找解决方案或发帖提问。
数字涂鸦教程
1. 认识 App Inventor 环境
设计器用来添加画布和传感器,积木编辑器用来编写绘图和清空逻辑。连接 AI2 Companion 后可以边拖块边测试。
2. 认识设计器组件
Canvas 是画布,AccelerometerSensor 是非可视组件。先保持组件名称 Canvas1 和 AccelerometerSensor1,后续事件块会使用它们。
3. 关闭屏幕滚动
如果 Screen1 的 Scrollable 开启,页面滚动可能让画布尺寸和触摸位置不容易控制。先在设计器中取消 Screen1 的 Scrollable。
4. 设置 Canvas 尺寸
从“绘图与动画”抽屉拖入 Canvas,把高度和宽度都设置为“充满父容器”。画布应尽量覆盖手机屏幕。
5. 编写画布拖动事件
从 Canvas1 抽屉拖出 当 Canvas1.被拖动时,再放入 调用 Canvas1.画线。把 x1, y1 接到 prevX, prevY,把 x2, y2 接到 currentX, currentY:
when Canvas1.Dragged(startX, startY, prevX, prevY, currentX, currentY, draggedSprite) {
Canvas1.DrawLine(prevX, prevY, currentX, currentY)
}
使用上一点连接当前点,手指移动时才会形成连续曲线;startX/startY 只代表第一次触摸的位置。
6. 摇一摇清空画布
在 当 AccelerometerSensor1.被晃动时 中调用 Canvas1.清除画布:
when AccelerometerSensor1.Shaking() {
Canvas1.Clear()
}
这个事件要在真机上测试,普通模拟器不能真实模拟摇动。
7. 测试和扩展应用
先画一个字母,再轻轻摇动手机,确认画布清空。你还可以加入颜色按钮、线宽滑块、橡皮擦,或用 DrawCircle 让用户画点。
卡在哪一步?直接查操作
不用退出当前教程。速查会在新页面打开,查完回来继续刚才的进度。



