很多刚入门的程序员,在实现程序的时候都希望一步到位,将程序代码一次完成。这一方面是因为刚入门程序员接触的项目比较简单,代码量不多。另一方面,也可能是缺乏开发经验导致。一步到位实现程序有两个结果。一是程序正常运行,另一个是一运行就出现错误。排查起来相当麻烦。笔者在这里提供一个搭建UI界面的小项目,分析其实现过程中怎么减少bug的出现,提高编码效率。
项目是支付宝的口碑界面。如下图
整个界面实现起来并不困难,可以使用collectionView或者tableView。然后添加一个头部视图,和底部视图。头部视图xib文件中添加collectionView,通过自动布局将数据加载到视图中。但这里我们不重点讨论该界面的实现。我们关注的是如何在实现一个项目时减少bug的出现。这里介绍的方法是在实现项目的时候边实现变检查。同样,在通过AFN从网络请求数据的时候也应该写一段代码后运行检查代码的执行效果。在通过自动布局设置好一个控件后,就可以运行看下运行效果,如果实际效果和我们的预期效果有差别,我们再着手进行修改。或者出现报错情况,我们也可以及时进行修改。但如果把所有空间都设置完成,再去检查,出现报错后问题就很难进行排查。整个项目可以从简单的方面入手,方便编程过程中直观地检查已经写好的代码有没有运行成功。
例如上面这个项目。假设我们要通过自动布局,tableView来实现。我们就要在storyBoard中拖入tableViewController.按照程序的实现顺序,我们先从上往下实现。第一步先实现headerView.在这里headerView有多种实现方法可供选择,第一种是使用xib,然后通过九宫格算法布局控件。第二种是使用原型cell。但在这里最简单的方法是使用collectionView,然后通过xib布置子控件。我们去实现这些步骤的时候不是先去计算collectionView中item之间的间距,还有内边距等。实现时我们先使用假数据写死collectionView的item,让collectionView先显示出来。再通过视图显示效果去调整页面布局。根据我们的想法计算边距,内边距等,然后再运行查看我们的计算结果和和运行效果。如果界面不理想,就再调整算法,直到视图显示正常为止。这样做的好处是能够动态地调整我们的算法。能及时检查出代码中的错误,进行调整。
头部视图实现了,接下来就实现中间的活动图片,我们可以使用原型cell,或者xib来实现。同样,我们关注的是怎么在现实过程中及时排查错误。视图排查错误的方法和上面一样,也是这篇文章所介绍的方法的重点,就是第一步先让视图先显示出来,然后根据运行后显示情况来进行调整。在这里我们先给xib一张图片。然后返回6个单元格,查看图片的显示效果。再调整大小。
最后是相对复杂一点的具体商店展示。在这里我么通过xib使用自动布局,布置控件。然后将其中一些需要修改值得约束作为类的属性。在controller中进行判断,如果没有活动就将控件隐藏,将约束的值设为0;这里实现步骤是一样的,先赋值假数据。让视图先显示。显示完了之后再根据显示效果动态调整。最好是实现一个小功能后就运行检查一遍。
除了实现界面时可以使用上面的方法,我们在写其他代码的时候也应该遵循这个方法。例如写了懒加载代码后,可以先运行后检查数据是否加载成功。因为懒加载和添加数据的时候我们有时会忘了给数组实例化,这时候给数组中添加数据后数组仍然为空,如果我们添加数据后就运行检查看数据加载成功没有,就很容易找出问题的锁所在。
你可能已经发现,上面的重点不在于整个界面如何实现。而是在于实现过程中怎么减少错误的出现。这个方法也是大部分有经验程序员在使用的一个方法。但一些刚入门的程序员还没注意到这个问题,或者没很好地使用这个方法。导致编程过程中出现bug无法及时排除,影响写代码的速度。所以在这里提供的方法希望对你提高编程效率有帮助。