『原创』手把手教你搭建一个实用的油耗App（一）

　　前言：

　　入行快10年，有点积蓄，三年前买了代步车。于是乎，汽车油耗开销就成了每个月都必须关注的问题。三年来，用过了无数油耗记录软件，比如最知名的“小熊油耗”，从第一次用，一直到最新一版，感觉越来越“臃肿”，功能实在是太丰富了，甚至都做到“大数据”这一层面，作为一个小白车主，其实，我只关心：我的车油耗如何。

　　后来体验了几款应用市场上的油耗app，感觉都不尽如人意，比如一来就要你手机号的（什么鬼，手机号和油耗有毛线关系？作为一个安卓用户，我觉得：个人隐私还可以在抢救一下！）……还有界面简单到只有一个表格的，看的我是一脸懵逼的（敢不敢不要这么“直白”，不用小熊油耗那么复杂的图表，我就只想知道油费怎么花出去的），曾经在某野鸡应用市场下载到一个支持云盘数据备份的app，无奈换手机后，居然再也找不到这个app啦，一年多的油耗数据也无从恢复，哎（我就想用个稳定的油耗app）

　　一直以来，我就想找一个这样的油耗App：

• 功能相对简单（油耗增删，图表展示）
• 不涉及个人隐私（不收集个人账号类信息，没有多余的权限申请）
• 支持数据云备份（有后台数据做云端备份，换机无忧）
• 稳定更新（有一个稳定的App市场来承载，如果我还活着，就不断更新）

　　作为程序猿，一直以来信奉那句“自己动手，丰衣足食”，既然安卓市场里找不到适合自己的油耗app，那何不自己开发一个呢？

　　选型：

　　开发工具和UI框架

　　果断决定自己动手搞一个，但是想想安卓那么多项目框架，感觉都太“臃肿”，如果一个一个写Activity，自己这个强迫症又觉得太low逼。怎么办？！遇到了Hbuilder+MUI，这个前端Hybrid开发神器，我在这篇文章就不做过多赘述，大家可以移步官网看看“Hello world”，自然能明白为什么我会用它来完成咱们这个App的开发任务（传送门在这里:猛戳跳转）

　　好了，准备好开发工具和UI框架，我们的App就在这框架上进行构建，简单点说：我只需要写几行JS代码，就能完成一个原生App所具备的功能。

　　数据持久的新思路：BAAS

　　网络上关于BAAS的解释，很多很多，在这里我也不啰嗦，简单说：我作为一个App开发，我只需要告诉Baas我需要存些什么(JSON)，什么时候来拿(Anytime），怎么拿(Get/Post)。后台所有关于数据的操作，均有BAAS来完成！，一句后台代码都不用我写哟！

　　这样一来，作为一个独立的App开发人员，至少后台数据的持久化，算是解决了。BAAS提供商，服务好的，还会同时提供一套“用户账户”系统给你，方便你的App用到“用户”模块，这样，神马用户注册，密码找回等等这一套系统，又给我省了很多工作量。

　　综上所述，我选择了：Wilddog野狗这家年轻的BAAS提供商，来作为我App的云端数据备份+用户账户模块的支撑~~~~当然路，免费和收费，大家可以自行决定！

 

　　万事俱备，只欠coding

 　　搞定了开发工具，UI框架以及数据存储和用户账号体系的问题，对于我们这个App来说已经是“万事俱备，只欠coding”了。如果电脑面前的你想和我一样10多分钟搞定这个App，你应该准备好：

• 　　项目开发工具:Hbuilder（自带MUI）
• 　　Wilddog野狗云账户
• 　　健全的双手（右手皆可）
• 　　不低于70的IQ

　　……

　　项目搭建

 

使用Hbuilder 新建一个“移动App”项目，在“选择模板”这里，我们选择：mui项目。这样，会为我们的项目添加好mui必备的js、css、字体资源。　　

新建的项目如左图所示， 在根目录下，添加images、libs、funcs三个文件夹。如下图所示：

 还有一系列的功能界面，在这里，就不一一赘述，后面都会把项目在git上进行分享。以下是各个界面的样子：

 

项目的源码将使用git方式做分发，所以在此不再赘述。大家可以通过扫下方二维码，先体验一下：

后续，我会专门一个一个专题，给大家介绍这个App主要功能模块的实现，以及对接BAAS服务的相关心得技巧。