1.3.0 APICloud HelloWorld

HelloWorld

本文主要介绍使用apicloud创建第一个app

创建第一个APP

打开IDE首页登陆账号新建一个移动应用

本节需要下载IDE和搭建开发环境
没有下载IDE或环境搭建请移步APICLOUD 1.1.0 开发环境搭建
在这里插入图片描述

填入完整信息选择完成 ✅

在这里插入图片描述

说明：如果是mac系统并且创建失败的话以下这种情况
在这里插入图片描述

Can't locate SVN/Core.pm in @INC (you may need to install the SVN::Core module) (@INC contains: 
/usr/local/git/lib/perl5/site_perl/5.18.2/darwin-thread-multi-2level /usr/local/git/lib/perl5/site_perl/5.18.2 
/usr/local/git/lib/perl5/site_perl /Library/Perl/5.18/darwin-thread-multi-2level /Library/Perl/5.18 /Network/Library/Perl/5.18/darwin-thread-multi-2level /Network/Library/Perl/5.18 
/Library/Perl/Updates/5.18.2 /System/Library/Perl/5.18/darwin-thread-multi-2level /System/Library/Perl/5.18 
/System/Library/Perl/Extras/5.18/darwin-thread-multi-2level /System/Library/Perl/Extras/5.18 .) at /usr/local/git/lib/perl5/site_perl/Git/SVN/Utils.pm line 6. BEGIN failed--compilation aborted at /usr/local/git/lib/perl5/site_perl/Gi
t/SVN/Utils.pm line 6. Compilation failed in require at /usr/local/git/lib/perl5/site_perl/Git/SVN.pm line 25. BEGIN failed--compilation aborted at /usr/local/git/lib/perl5/site_perl/Git/SVN.pm line 32. Compilation failed in require at /usr/local/git/libexec/git-core/git-svn line 21. BEGIN failed--compilation aborted at /usr/local/git/libexec/git-core/git-svn line 21.
检出到指定路径:false

解决方案：

打开终端输入

sudo ln -s /Applications/Xcode.app/Contents/Developer/Library/Perl/5.18/darwin-thread-multi-2level/SVN/ /Library/Perl/5.18/SVN
sudo mkdir /Library/Perl/5.18/auto
sudo ln -s /Applications/Xcode.app/Contents/Developer/Library/Perl/5.18/darwin-thread-multi-2level/auto/SVN/ /Library/Perl/5.18/auto/SVN

这里主要是因为svn的路径问题
解决方案大致就是：
通过命令行软链到新创建的目录下
搞定了以后

项目结构是这样子的

在这里插入图片描述

打开html文件夹下的main.html

第一步
首先找到下面这行代码

<label id="con">Hello APIcloud</label>

改为：

<label id="con">Hello World</label>

第二步

在第一步代码的下一行是：

   <div id='sys-info'></div>

改为

  <!-- <div id='sys-info'></div> -->

第三步

大概在60几行，找到下面代码

$api.byId('sys-info').innerHTML = str;

改为：

// $api.byId('sys-info').innerHTML = str;

打开之前搭建环境APICLOUD 1.1.0 开发环境搭建安装的模拟器

打开apploader
在这里插入图片描述

注意：这里的输入的是你的ip地址和端口
对应的就是IDE对应的IP和端口

在这里插入图片描述

ps:如果你用自己的手机运行APPloader要和电脑在同一网络环境(wifi)下才能链接

在这里插入图片描述

我这里有两个ip选一个填就好了

填好以后点击连接如果像上手机截图一样透明的悬浮球变成绿色了说明就已经连接成功了
成功以后回到IDE 点击项目>运行就能看见效果了！！

这就是运行效果图了

最后，项目结构介绍

HelloWorld
├── config.xml 配置文件
├── css 样式文件夹
│ ├── api.css
│ ├── aui-iconfont.ttf
│ ├── aui-slide.css
│ └── aui.css
├── feature 全局常量定义
├── html 布局文件夹
│ └── main.html
├── icon APP图标
│ └── icon150x150.png
├── image 静态图片文件夹
├── index.html 入口布局
├── launch APP启动页面
│ └── launch1080x1920.png
├── res 资源扩展
├── script 脚本文件夹
│ ├── api.js
│ ├── aui-slide.js
│ └── aui-tab.js
└── wgt 可以将这个app作为一个weigt放入文件夹作为模块使用