零基础小白，如何做一个APP

领导说，我们要做一个APP Demo，于是就有了APP。回顾下来，可能也就是码农小哥哥一两个小时的工夫，零基础的老阿姨却花了好多个晚上来研究，一点点像燕子衔泥一样做了一个丑萌丑萌的APP。

由于涉及一定产品信息，另外考虑所用软件的版权问题，所以全程无截图。没流量的小伙伴也可以放心大胆往下翻了。

输入:用户手册的fm源文件

所用软件: HB builder等，在此特别鸣谢度娘和小董老师。

输出:apk或者iOS格式的APP，支持安卓在手机或平板上。

简化一点来看，整个操作步骤就是把准备好的若干个HTML格式的文件，通过一定的映射关系关联在一起。然后提交到hbbuilder的云端进行打包。除非文件特别大，云端无法支持，否则本地无需部署andriod开发环境(其实我就是懒而已)。

那么首先第一步，就是做好这若干个html文件。操作so easy，打开某软件，新建一个project，导入fm源文件，使用默认模板，自动生成一个包含若干HTML(定义内容)，CSS(定义格式)和toc(确认导航和链接)等格式的文件夹。HTML之间遵循在源文件中已经设定好的链接和索引关系。以01结尾的就是每一章节的子目录。

此步骤所需时间视文件大小而定，可能需要十几分钟到半小时，可以顺便刷个八卦。什么，你还要去做个头发? 额，那还是算啦。

如果没有源文件，利用Adobe dreamweaver等软件，可以直接可视化制作。自己连写带画，做出来一个基础的HTML网页，一行代码都不需要写。网上也有很多现成的HTML制作教程，问问度娘就行。或者，在hb中，可以新建一个模板project，里面自带若干模板HTML，略加修改即可。

那么第二步就是把大象塞入冰箱。哦，不，是把HTML导入hb中，准备打包。

在hb中新建一个移动APP的project，可以选择带有默认的登录，注册等页面的模板project，这样你就不用自己专门做啦。模板project建好后，也会自动生成若干文件夹，如CSS，image等。然后把上一步做好的HTML，CSS，图片等，一股脑分别塞入到该模板project下相应的文件夹中。

那么下来就是把自己做的HTML与模板的自带文件串接起来。在模板project中，index一般是默认的启动页面。所以我们要在index中加若干个超链接，链接到我们想要打开的HTML中，也就是上一步所说的每个章节的目录页。代码很简单，href=target.html(target.html仅示例，用所需要链接的html名称替换)。

依次类推，想要通过index打开几个html，就加几个href进去。

第三步就是冲上云霄啦，在HB的工具栏中选择发布>发行为原生安装包。然后在弹出来的对话框内依次设置APP的图标，设置启动画面，设置发布APP的格式，设置blabla。反正就是按照它的指示，进行不下去都是有原因的。哪里标红说明哪里有问题，直接点哪里查看并解决问题。只要最后能够让你点下一步就行。好了，点了下一步，然后发布到云端。如果在此后错误提示，基本都可忽略哈。

提交到云端之后，就安静的等候吧。不要走开，广告之后更精彩。看到云端打包完成，进入release文件夹，就可以看到一个apk文件静静的等在那里，等着你的临幸。将这个文件复制到自己的手机上，然后点击安装，忽略可能的风险提示，就可以看到出自自己之手的APP。上的了厅堂，下得了厨房 ，写的了代码，顿时有一种姐的人生好圆满的感觉。

实际上，从头到尾，除了href，几乎没写一行代码，开不开心，惊不惊喜?

那还等什么，撸起袖子加油干呗!