转载

独立开发的首款上线App-- 个人工资计算器的开发历程总结

本文是投稿文章,作者: TheFlyingPenguin

本文主要针对初级入门的朋友,中高手及各位大神请绕路。

本文主要是我的第一个上架的App—个人工资计算器的开发历程的总结。

一、功能介绍:

本软件主要实现以下功能:

1. 可计算出个人和单位的社保(养老、医疗、失业、工伤、生育)数额,及个人和单位的公积金数额。

2. 还可计算出个人所得税及提供个人所得税在各纳税区间的税值详单。

3. 支持全国各省会城市,提供2015~2016年各城市社保和公积金的相关数据。(公积金数据有效期2015年7月1日~2016年6月30日)

4. 输入税前工资后,可自动提供提供社保基数和公积金基数默认值。

5. 支持社保参数和公积金参数的修改。

软硬件兼容情况:

1. iPhone4S及以上, iPad所有版本等。

2. 操作系统iOS 7.1以上。

二、界面

独立开发的首款上线App-- 个人工资计算器的开发历程总结

三、开发历程

1. 我的本职工作是C++开发的,充其量也就是个稍微胖一点儿的小菜鸟。

2. 兴奋。

2015年1月份入手一台Mac Pro,马上参考网上教程鼓捣出一个Hello World程序,程序员就是这么任性,哈哈。

3. 初衷。

当初打算做个人工资计算器的初衷,主要是我女朋友(那时是女朋友,现在是俺媳妇儿了,哈哈哈哈)因为工作的原因时常需要计算候选人的社保工资和个税等信息,在App Store中又没有找到特别顺手的工具软件,有的操作太复杂,有的参数早就过时,于是决定弄一款符合使用习惯的工资计算器。

4. 一腔热血,初步受挫(2015年2月)。

2015年的春节是2月19日,年前的时候公司加班多了些,所有年前的时候基本上就熟悉了一下XCode环境和Swift的基本内容。过年的时候将本抱回家,就开始了基本版本的开发,刚开始感觉应该不是太难。因为有MFC的基础,就从Object Library中拉一堆控件,摆在界面上,然后用Ctrl+Drag的方式建立@IBOutlet和@IBAction, 没用多长时间就自以为鼓捣出了“界面”。 后来在从TextField控件的数值转换为Double的时候卡住了,另外,那时候还不熟悉自动化布局,虽然明白肯定需要考虑到界面的兼容性,当时由于知识的局限性,脑中没有合适的解决方案。

书到用时方很少,当时我的知识储备就是,一些C++开发工作经验还有一些零散的XCode和Swift的知识,想完成这个麻雀虽小五脏俱全的“小”任务,难度还是不小。当你思路被限制时,当然周边有大神请教最好了,怎奈我周围的小伙伴都是做C++的,只有我一个人私下在学iOS开发。路走不通时,就说明接着学习的时候到了。

这里有个小插曲,为了熟悉自动化布局的问题,当时估计也是脑子被驴踢了一脚,就从网上买了本从国外翻译过来的书籍(具体名字就不提了,封面上蓝下黄),买回来之后顿时肠子都悔青了,外国人鼓捣的玩意太重理论了,讲自动化布局的数学原理等等,看得是云里雾里,真正实用的几乎没有,建议小伙伴们谨慎购买。

5. 补充粮食弹药(2015年3月到2015年6月)。

这段时间最主要就是不知道路怎么走,我心中一直有一个观念,就是当时你不知道前进的路怎么走的时候,说明你的高度还不够,这时候就是补充粮食弹药的时候(或学习理论或持续实践),当你将自己的高度提升高一点时,你的视野变了,说不定路也就明了了(这段就当撒些鸡汤吧 我是这么想的 也是这么做的)。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

这段时间的学习相对而言比较杂, 主要包括OC和Swift,数据存储,看了maiziedu和xiaobo老师的一些免费视频等,

还有斯坦福大学2015年的公开课(纯英文版https://itunes.apple.com/us/course/developing-ios-8-apps-swift/id961180099)。 关于这个公开课,稍微多说两句,里边关于MVC的介绍、关于outlet 和action及delegate、datasource的理解,是我目前见到最好的(截图如下)。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

这段时间由于某些原因还尝试建立一个XMPP的客户端(最主要还是练练手), 最终的成果是,用ejabberd做服务器,iOS实现了登录界面,并可进行登录,还可显示通讯录的用户列表(数据不来自数据库,是写死的,另外,人物的头像logo我是从另外一个工程中拷贝过来的,谢谢作者哈)。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

以上的内容虽然看起来是很简单的东西,但我也从其中收获良多,主要如下:

(1) 用cocopods来管理第三方依赖库,有了这个太方便了,里边的xmppframework的库就是直接用pod方式来使用的。

(2) 基本掌握了autolayout的自动化布局。(当时还没有考虑到和sizeclasses的配合)

(3) 对tableview的基本使用,后续我发现tableview这个玩意太好用了。

(4) 如何在swift工程中调用oc的第三方控件等。

6月份的时候,老大让我在我们团队为大家简单讲解一些iOS开发的内容,这个时段正好把前段时间的学习进行梳理一下,然后在公司专门找个时间为大家讲解一下,一口气讲了4个小时,截图如下。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

培训时,由于团队成员基本上都是编程经验比较丰富的开发人员,所以我的讲解没有只拘于表面,我的思路是:

(1) 首先介绍iOS的是什么,iOS的实质就是苹果公司针对移动领域的一个操作系统(OS)。

(2) 然后从操作系统角度分析下苹果公司对这个系统从API角度是如何封装的,就是我们所谓的那四个层次( CocoaTouch, Media, Core Service, Core OS )。

(3) 开发环境和开发语言简介。介绍一下开发所需的软硬件环境,当然是推荐直接买Mac进行开发;简单提了下有哪些开发语言。

(4) 开发出的程序的结构。介绍开发出来的程序的结构是什么样的(.ipa),具体构成是什么(iTunesArtwork、xxx.plist、还有xxx.app等),沙盒机制是什么。

(5) 开发完之后的程序如何发布。主要从Apple的开发者账号的角度进行切入进行分析。

(6) 后续当然是演示一下神奇高大上还有万能的HelloWorld程序了(可能这种具体的演示会给培训者留下的印象是最深的)。

(7) 后边主要是两个大的方向

  • 开发环境Xcode的讲解。 重点讲解Xcode开发环境,还有神奇的CTRL+DRAG技能。

  • 开发语言的介绍(重点介绍Swift)

(8) 版本控制。代码开发怎么可以没有版本控制,就简单接受了git的本地和远程的两种使用方法。

通过这段时间的梳理,我觉得真正开发的时刻来了。

6. 开发。

个人工资计算器这款实用工具App都是在下班之后的“业余”时间独立摸索完成的。

从6月底开始开通双币信用卡,然后兴奋地开通开发者账号。其实那时候,不用购买开发者账号也可以直接在真机上调试了(XCode 7),但还是决定push自己一把,买了账号之后就会有些紧迫感,才肯加快些马力。

从7月1日开始正式开发,到8月底,一个多月的时间,那段时间,除了陪媳妇儿,或者看球赛,或者周末出去玩,基本上其它时间都在鼓捣这个App,在阅兵放假之前,将App的第一个版本开发完毕,并提交到App Store,到9月10号(教师节)苹果通过审核。

当时好开森啊,就跟自己的第一个孩子似的,可兴奋啦。

过后的几天基本上就在itunes connect上看看在不宣传的情况下有多少小伙伴下载,在木有任何宣传的情况下,每天都有一定数量的小伙伴进行下载,心里还是很欣慰的, 比较意外的是,有很多小伙伴是用iPad来下载的,当时开发时考虑肯定大家都用iPhone来直接下载,实际结果是 iPhone和iPad下载的比例基本为2:1,设计还是需要市场来最终检验啊。

7. 技术总结

从2015年1月份到9月份第一款个人工资计算器发布,主要收获如下:

(1) iOSApp开发的基本流程

刚开始开发的时候最关心的就是开发的流程,下图是最核心的一张图。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

官网地址

上图,请注意各模块的颜色:

浅黄色是在MemberCenter完成的,包括Enrollin program(注册加入苹果的开发者计划);

浅蓝色是在XCode开发环境中完成的,主要包括DevelopApp(开发程序,即实际的编码开发和调试阶段)、Upload App(上传App,将App上传到iTunes Connect);

浅绿色的是在iTunesConnect中完成的, 主要包括在上传app前Create App Record(创建一条App的记录)、Beta Test App(测试App,可选)、Submit App(提交App)、Release App(发布App)。

  • Enroll in program

如果只是想自己玩玩不上传AppStore,那就不用注册开发者账号。如果打算上传AppStore的,必须注册开发者账号。

注册地址:https://developer.apple.com/programs/enroll/

注: 目前Xcode 7 不购买开发者账号也可以进行真机调试。

  • Develop App

这部分就是在XCode下开发调试程序。

这里需要为Project指定一个Team。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

指定账号后可以真机调试,后续上传时也依赖此开发者账号。

以前一直比较头疼app的各种icon的各种像素,需要给各机型提供不同像素的图片,想想都觉得很麻烦。还好有个哥们提供一个制作app比较好的工具,

该软件可创建App图标、启动图LaunchImage,还可以生成自定义尺寸的图标集(Image Set),非常简单易用。

详见: http://www.cocoachina.com/bbs/read.php?tid-290247.html

软件地址: https://itunes.apple.com/cn/app/app-icon-gear-image-assets/id989646576?l=en&mt=12

或在Mac App Store搜索App Icon Gear即可下载。

个人推荐查找icon原素材比较好的网站: http://www.iconpng.com/

  • Create App Record

苹果的官网上说”You must have an iTunes Connect app record to validate and upload your appto iTunes Connect. ”, 意思很明白,就是验证和上传app之前必须创建一个叫app record的东西。

官网地址:

Creating an iTunes ConnectRecord for an App (创建app record)

iTunes Connect App Properties (对创建的apprecord的参数进行设置)

设置app的属性时,上传屏幕截图可能会遇到以下问题:

独立开发的首款上线App-- 个人工资计算器的开发历程总结

这种情况一般是上传的图片格式有问题,主要是分辨率不对或格式不对。

①上传的屏幕截图应该去掉状态栏之后的截图,竖屏截图参数如下:

3.5寸: 640 x 920 pixels

4寸:  640 x 1096 pixels ?

4.7-寸: 750x 1334 pixels

5.5-寸 :1242x 2208 pixels

iPad: 768 x1004 pixels

详见iTunes Connect App Properties中Screenshot Properties的参数说明。

②个人建议最好保存为jpg格式的图片

注: 我没有找到太合适的软件(截图的时候直接可以去掉状态栏的那种),我是直接保存下来之后,然后用Photoshop编辑后保存为jpg然后上传的。

如果小伙伴们有合适的截图软件,还请帮忙推荐下。

注: 打开有些浏览器打开iTunes Connect会出现网页打开有问题的情况,个人推荐使用Firefox浏览器或者safari浏览器打开。

  • Upload App

这部分主要包括两个步骤:

①打包

上传app之前首先需要打包,具体流程如下:

在Xcode开发环境中,设备选择iOS Device或你的设备。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

注: 选择模拟器时是无法进行打包的。

选择Product > Archive即可。

②验证和上传

打包成功后显示界面如下:

独立开发的首款上线App-- 个人工资计算器的开发历程总结

a) 先点击validate进行验证

b) 验证成功后,点击Submit to App Store,就可以将打包文件上传到App Store。

上传成功可以在iTunes Connect对应的App Record中看到对应版本, 刚开始的“App Store状态”为空白。

在iTunes Connect中可以看到所有上传到App Store中的版本信息,比如以下V1.0.1就是目前已经上架的版本。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

  • Submit App

这里指将Submittingthe App to App Review,即提交app供苹果审核。 官网地址

主要步骤:

①在iTunes Connect中点击添加按钮。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

②选择指定的版本。

独立开发的首款上线App-- 个人工资计算器的开发历程总结

③上传App供苹果审核(Submitting the App for App Review)

独立开发的首款上线App-- 个人工资计算器的开发历程总结

  • Release App

Submitting the App for App Review之后基本就是等待了。

这时候可能最主要就是关注自己的App的状态了,苹果用状态来表示app处于审核的什么阶段。

关于状态的详细介绍 官网地址

下边简单介绍几个最常见的状态:

Prepare for Submission

已经在iTunes Connect中创建了app record,但还没有提交app进行审核。此时,配置信息、app截图等均可以进行修改。

Waiting For Review

苹果方面已经收到你提交的新app或升级的版本,但是还没开始审核。 此时,你还可以删除当前的app build,然后重新提交。

In Review

苹果正在审核你的app。

Processing for App Store

你的app正在被处理,24小时内将处于上线状态。

Ready for Sale

你的app通过了苹果的审核并在app store中发布。(激动人心的时刻!!!!!!)

Developer Rejected

如果你已经提交submit app to app review但还没有ready for sale,但是你发现有些内容需要优化,优化后删除上个提交的app build时,程序会处于Developer Rejected状态,后续接着提交新的版本然后提交审核借口。

以上就是一个app从开发到发布的基本流程,都是些概要介绍,权当抛砖引玉。

自动化布局 vs 纯代码布局

刚开始觉得这个工资计算器的界面应该属于so easy的一件事,加上又知道了所谓的强大的autolayout(自动化布局),觉得界面不就是三下五去二的事么,

后来发现还没那么简单。

这是用自动化布局的初步效果:

独立开发的首款上线App-- 个人工资计算器的开发历程总结

iPhone 4S

独立开发的首款上线App-- 个人工资计算器的开发历程总结

iPhone 6Plus

如上图,iPhone 4S是完全匹配的,效果相当良好,可是iPhone 6 Plus呢?

如何用自动化布局控制竖向的间距呢?

另外,iPhone 6 Plus和iPad的时候我希望让字体显示的大一些,自动化布局能搞定吗? 加上size classes也搞不定啊!!!

亲爱的们,就上边的界面,你们有什么好的大招么?

(现在发布的版本是支持iPhone所有版本还有iPad,所有版本均做了适配,我是用了一种我个人感觉不太聪明但是很实用的方法来做的,好吧,我就是纯代码来实现的…)

个人感受:

  • 当界面上元素比较少时,比如登录界面,用自动化布局还挺好,但是元素一多了之后,感觉好乱,另外移植界面的时候各种想吐…

  • 用代码进行界面开始时,缺点就是不直观相对比较繁琐,但是好移植啊。

本来还打算介绍下用iTunes connect的版本管理、cocopods对第三方库的管理等,篇幅所致,后续有时间单独介绍。

个人工资计算器App Store的二维码,用微信扫描即可下载:

独立开发的首款上线App-- 个人工资计算器的开发历程总结

正文到此结束
Loading...