如何使用App开发工具AppApp程序？（AI）
发表时间：2023-11-13 16:01:42
文章来源：炫佑科技
浏览次数：202
菏泽炫佑科技
如何使用App开发工具AppApp程序？（AI）
App（AI）是一款强大的可视化编程工具。 其主要特点是通过组件和块代码设计以及拖放抽屉的方式降低了记忆和开发的难度。
关于App学习环境的搭建，可以参考这篇博文，里面对App开发环境的搭建以及App程序的调试工具进行了比较全面、系统的介绍。
本文主要介绍如何使用App开发工具来编写App程序。
进入开发工具（又称进入开发平台或开发环境）后，界面和操作类似。 这里以张路老师翻译的国内服务器为例介绍一下App开发工具的使用。
建议使用浏览器打开并登录，如下：
随着时间的变化或版本的更新，您看到的页面可能会发生变化。 在线开发工具没有设置用户权限。 每个人创建的项目都放在一起，每个人都可以看到、修改和删除，因此导出您的项目并保存在本地时要小心。
打开App的编程环境如下图：
注意视图切换部分
， 英语是
单击“设计”和“编程”按钮可在“设计视图”和“编程视图”之间切换。
点击“编程”按钮后切换到“编程视图”：
“ View”是一个组件设计器，用于使用组件来设计界面。 根据要实现的功能，选择合适的组件，构成软件界面。
组件是用于创建应用程序的基本元素。 有些组件非常简单，例如在屏幕上显示文本的标签组件，或点击时引发操作的按钮组件。 。 其他组件更复杂：绘图（画布）组件可以保存静态图像或动画； （加速度传感器）组件是一个运动传感器，其工作原理类似于 Wii 控制器，可以检测设备的移动或晃动； 有用于编写和发送短信、播放音乐和视频、从网站获取信息等的组件。
中间的白色区域称为工作区【预览（）窗口】，用于放置应用程序中需要的组件。 您可以根据自己的喜好安排这些组件。 预览窗口只能让您大致了解您的应用程序的外观； 例如，与测试设备上的应用程序相比，预览窗口中的一行文本可能会换行到不同的位置。 如果您想查看应用程序的实际外观，可以将应用程序下载到测试设备（我们将在稍后的“打包应用程序并下载”部分中详细介绍），或者下载应用程序附带的模拟器应用程序。
预览窗口的左侧是组件面板（），其中包含各种组件供选择。 该面板按类别分为几个部分。 默认情况下，只有用户界面 (User) 组件可见。 您可以通过点击其他类别的标题来查看其他组件，例如媒体（Media）等。
预览窗口的右侧是组件列表（）如何使用App开发工具AppApp程序？（AI），其中显示了项目中的所有组件。 任何拖入预览窗口的组件都会显示在此列表中。 目前项目中只有一个组件： ，代表设备的屏幕。
组件列表下方是“素材”列表【媒体列表】，其中显示了项目中的所有媒体资源（图像和声音），可以通过“上传”按钮添加。
*右边的部分用于显示组件的属性面板。 单击工作区（预览窗口）中的某个组件，您将在属性（）面板中看到该组件的一系列属性。 属性描述了组件的详细信息（例如点击Label组件可以看到它的颜色、文本内容、字体属性。），并且属性值是可以修改的。 当前显示的是屏幕的属性（已命名），包括背景颜色、背景图片、标题等。
App在创建新项目时会默认创建一个组件。 这个组件叫做：，它是其他组件的容器，比如按钮、标签等，这相当于手机的屏幕，是设计用户界面的地方。
可视化组件（可以理解为应用中实际可见的组件），如Label组件、组件等； 非视觉组件，例如Sound（声音）组件和（加速度传感器）组件，用于检测设备的移动或晃动。 可以像手机一样在窗口中添加可视化组件； 非可视组件添加在窗口下方，如手机。
如何设计界面（像手机一样给窗口添加组件）？ 例如，要在类似手机的窗口中添加一个“Label”组件，在组件面板（）中，单击Label组件，按下鼠标左键，将其拖到类似手机的窗口中。 在组件设计器的右侧，可以看到Label组件的（属性）框，可以根据自己的需求进行设置。
“编程视图”，用于编程设计，AI（App）编程语言称为块语言。 在块编辑器窗口中，您可以设置组件的行为：做什么以及何时做。
在块编辑器窗口左侧的“Code ”（）标题下，您可以看到许多属于不同类别的内置块。 内置块分为8类，是制作应用程序的重要支撑。 内置块下面是我们在设计视图中创建的所有组件，例如：、标签1()，单击它们就像打开抽屉一样，您将看到一组适用于该组件的可选块。
如何使用代码块（编程设计）？
下图为点击“按钮1”时的显示。 就像打开 1的“抽屉”，可以看到一组适用于该组件的可选代码块()：
可以将抽屉中的代码块拖到工作区中。 不同的代码块可以拼接在一起形成程序。
代码块颜色和形状的含义。 代码块的形状：下槽为逻辑块，左槽接收属性值； 凹凸形状是否匹配决定了代码块能否正确组合。 代码块的颜色代表不同的功能。 触发事件的代码块是土黄色，调用方法的代码块是深紫色，设置属性的代码块是深绿色，读取属性的代码块是浅绿色。
垃圾桶图标的作用：将逻辑块拖到右下角的垃圾桶图标上，即可删除所拖拽的逻辑块。
背包图标的功能：将逻辑块拖到右上角的背包图标上，可以在多个屏幕中共享逻辑块，即逻辑块的“复制”和“粘贴”功能。
提醒：现在，只需对这些描述有一个基本的了解。 如果您感到困惑，请不要担心。 随着学习的深入，你可以回顾一下这些概括性的描述，形成一个整体的理解。
应用程序开发流程
(1)功能设计
想想自己要实现什么功能，并相应地准备材料（图片文件、声音文件）等。 对于小型软件（功能简单的软件）这一步可以省略，但是对于大型软件这一步是必不可少的。
(2) 创建新项目
（3）在“设计视图”中进行界面设计
根据要实现的功能，选择合适的组件，构成软件界面。
(4)“编程视图”中的编程设计，
在块编辑器中使用 Code () 进行编程来设置组件的行为：做什么以及何时做。
(5) 测试
上述步骤可能需要反复重复app开发，直到工作满足要求。
(6)释放
使用App开发工具中的“编译”菜单将其编译成apk文件供用户使用。
下面给出具体示例。
特色设计
素材：kitty.png； 喵.mp3
源文件：.aia
【功能说明】
点击图片发出猫叫声并显示文字“我害羞，别碰我！”； 摇动手机，手机会振动并显示文字“我头晕，别摇我！”。
创建新项目
界面组件设计：
需要指出的是组件的属性：
您的应用程序生成 APK 后，还必须在手机和平板电脑上安装图标（Icon）属性。 只有这样你才能看到你生成的应用程序的图标。 如果不设置图标，将使用默认的App应用程序图标。
垂直对齐（），请注意，如果勾选了“允许滚动”属性，则无法设置“垂直对齐”和“底部”。
其他属性使用默认值。
在本项目中，需要通过拖动的方式添加4个组件：
组件、组件、组件、组件，它们的属性设置如下图所示：
设置完成后，会显示如下图：
编程设计
测试效果
例子比较简单，主要是为了让新手有一个直观易懂的理解。 有了这些，深度学习就有了基础。
