实例|APICloud可视化开发企业管理app

利用 APICloud studio3 可以帮助我们快速创建并运行一个简单的应用，内容涉及开发工具使用、代码管理、应用预览、调试等。现在我们来通过 APICloud studio3 快速创建一个企业管理 app，帮助企业提供信息展示、案例展示、加盟申请等。方便用来展示产品、案例、宣传企业文化、资讯动态等。

1. 准备工作

下载并安装最新版本开发工具 APICloud Studio 3，当前支持 Windows、macOS、Linux 系统。下载地址 https://www.apicloud.com/studio3

2. 创建应用

当前提供了两种创建应用的方式，可以在 APICloud App 开发控制台 或 APICloud Studio 3 中创建应用，我们以在 APICloud Studio 3 中创建应用为例。打开后点击窗口右上角的 “未登录” 按钮，使用 APICloud 账号登录，若无账号可以点击 “立即注册” 按钮进行注册。顶部菜单选择 “项目” - “新建项目”，然后填写 “应用名称”，“应用说明”，应用框架处内置了几种模板，这里我们选择 MX App“企业展示”，点击 “完成”，然后选择项目保存的路径，完成创建。

在应用类型选择上 1. MX App: 一次开发多端应用，同时生成 iOS、Android、app 小程序等多端应用。2。Native App：Native App 适合功能强大、性能卓越的 APP 开发，如果您仅有 App 需求，应选择 Native App 模式。3. App Clip： 即 iOS 轻 App，是苹果公司在 iOS14 最新推出的无需下载、即搜即用的全功能 App，属于主 App 的一部分，可以理解为 “苹果小程序”。

3.App 页面编辑

编辑器为可视化编辑器，深度捆绑 avm 的多端引擎，只有拓展名是 stml 的才具备可视化的能力，打开 pages\main 会看到一个 stml 后缀的文件，与传统的 html 不同的是，它最终可以生成多端应用。编辑器集成了实时预览功能功能，可以通过实时预览，将页面以 H5 渲染展示在编辑器中，可以点击实时预览（左侧小眼睛）可以看到页面预览效果，也可以复制链接在浏览器中查看效果。

进入可视化页面后，可以通过组件拖拽的方式对页面进行简单的修改，单击右侧属性。还便可以对所选组件进行尺寸颜色等修改，同时在右侧事件处，可以对当前函数新建一个函数，个性化制定相关功能。

4.App 调试

为了提高开发效率，我们提供了 WiFi 真机同步功能，设备安装 AppLoader 或者自定义 loader 应用后，可以将 APICloud Studio 中的项目代码通过 WiFi 同步到 loader 中进行预览。点击左侧的真机同步按钮，选择通过 WiFi 连接设备，扫一扫连接，连接时要保证手机与 studio 位于同一局域网段，连接后进行 WiFi 同步便可以在手机上正常显示了。（尽量开启所有权限）

5.App 预览

点击左侧的小云朵，通过云编译打包一个正式的安装包，选择应用类别、平台，然后点击下面的 “云编译” 按钮开始编译。等待编译完成后扫描二维码即可安装。

6. 修改

修改完内容后，我们将内容同步到云端，代码传输云端后选择 WiFi 全量同步就可以在手机端看到更新内容

最后我们就可以在手机端下载安装软件，体验 app 啦。