iOS计算器:以编程方式和界面生成器

作为接受培训的iOS开发人员,我终于做出了我的第一个“重大”决定。 以编程方式或在界面生成器(storyboard)上构建视图。 普遍的共识是,您可以选择自己最舒适的一个。 但是,如果您希望在团队中工作,那么您将有必要知道如何以编程方式创建视图,因为这样可以提高可读性。 在/ r / iOSProgrammer上看到这篇文章后,我决定尽我所能来同时掌握这两种知识。

我最近使用堆栈视图完成了一个计算器应用程序。 我使用界面生成器创建了自动布局,但是我将以编程方式重新创建视图。

以下是完成实验后该应用程序的最终结果。

我不会显示所有的约束和设置,但是下面概述了如何使用界面生成器。

让我们一步一步地以编程方式重新创建它! 请记住,您可以执行界面生成器的大多数操作,可以以编程方式进行,反之亦然。

  1. 将所有按钮连接为IBOutlet。

2.删除所有约束,并在超级视图和按钮上关闭“翻译自动调整大小”功能! 此步骤有些重复,但是很简单!

3.接下来,让我们创建将包含所有其他堆栈视图的堆栈视图,就像在界面构建器中所做的一样。 但是,这次我们将以编程方式创建堆栈视图,而不是使用对象库。 很简单

4.嘿,我们已经在第4步了吗? 我怎么知道要更改什么属性? 约束来自哪里? 还记得我说过的一件事情你可以做的事,而另一件事情可以做得差不多吗? 在下面可以看到轴,路线,分布和间距都存在,并且在界面生成器上完全相同!

在这一点上,这将是相对重复的,所以我将为您省去多余的阅读内容。 第二,第三和第四堆栈遵循逻辑。 继续尝试一下!

GitHub: 单击此处获取完整代码

目前,由于我在设计应用程序时需要视觉帮助,因此我更习惯于通过界面生成器构建自动布局。 但是,完成此应用程序后,以编程方式进行自动布局并不像我想象的那样令人生畏。

以下是完成此操作时对我的一些重要帮助:

  1. 您可以以编程方式创建任何内容! 如上所示,我使用UIStackView创建了一个堆栈视图,您可以创建在对象库上可以看到的任何内容。 输入“ UI”并查看自动完成的内容。
  2. 就像我之前提到的,您可以通过界面构建​​器对UI对象执行的任何操作,都可以通过编程来完成。 再次输入您的对象,看看自动完成可以显示给您什么!
  3. 将子视图添加到视图时,请使用“ addSubview:”,要添加到堆栈视图,请使用“ addArrangedSubview”。
  4. 如果您不知道要以编程方式添加哪些属性或约束,请检查界面构建器上可用的属性或约束!
  5. 神奇宝贝在编写代码时可能会分散注意力,请确保全部捕获!