提额 APP

提额 APP

开始参与这个APP也是巧合，一个月之前，我还在忙于电信运营商的工作，上级就过来问我在之前公司有没有用过 html css js这些。在维库的时候，可是从前台到后台都是要全包的呀，因为项目人数真的是少的可怜啊，说多了都是泪啊，还是不说为好。我很果断地回复了之前用过。然后我就默默地被调走去做这个app的前端。我一听是前端，我当时有点懵，不知道该如何下手。很久没有这样开始做一个项目，而且是负责前端，而不是自己更熟悉的后端，接口之类的。

html css js虽然之前用过，但也只是简单的使用。由于之前的工作中，美工是会把所有的html和css写好再给我们去实现。没想到这次，我们的设计师只负责给我一个颜色宽度等一些参数，让我自己去搞整个页面的结构。一开始的时候，我感觉很郁闷，不知道该从什么地方开始下手。

可是人员就我一个去负责前端的工作，没办法，我只能硬着头皮上了，自己慢慢地去参考他们之前做的app，怎么去拆解图片上的原因，如何用div+css去布局页面的结构。

时间一点一点地过去， 我也慢慢地开始上手了，一些css 不懂的地方去查firefox的developer center 和 google查询如何解决问题。 当然最直接的就是找公司的那些纯前端的同事去解决问题。

phonegap作为APP的壳，嵌入到ios、android等，只能手机的原生项目中去编译生成软件项目。这样就可以简化app开发的工作量。一次开发多个app都可以运行。通过网页的自适应来解决多平台之间的问题，phonegap是ios下运行的效率比我自己想象中的要好，完全不用担心一些类似android会出现的问题。android在一些高配的手机上还是蛮流畅的，但是一到低配的手机，简直卡的一B啊。说多了都是泪，都不好意思说。在wp8上现在还没有用phonegap自己去实现，应该会比想象中的好一些。从之前的wp8项目看来，卡顿的问题故意是没办法解决的。phonegap估计也会回复你说他们已经尽力了。我们只能尽量去优化自己APP的性能，从而达到客户比较满意的状态。

提额APP是一个单页的APP，所有的页面都会通过js来加载到首页中。也就没有多余的url地址。整个项目就只有一个。项目中的地址无论你是怎么去切换。都不会改变页面的地址。只是页面一层一层地网上叠加。但是这样做就遇到了一些问题。就是css3中的transition的效果，不能对position：fixed的元素进行正常的切换效果。这两个之前存在一种无解的冲突，最后只能通过把元素换成position:absolute进行transition切换，然后再把那个元素clone到position:fixed的外层中。 这样研究营造出了一种固定定位的效果。这样就满足了原来所需的一些效果。

总结：

1. APP项目 PhoneGap + html + css + js 服务端用 ASP .net ashx作为服务接口
2. 增加了html css 盒模型的理解， 更加清楚 position在 网页上的一些使用
3. 对APP的开发流程有了进一步的了解，熟悉。做web app的想法还可以继续坚持
4. 作为前端的角色，去完成一个从无到有的项目，这种感觉还是不错的。

--EOF--

No.304

写于 2014-07-26