快速为Mac OS构建Vault App

开发iOS应用程序已经很长时间了，有一天我想为Mac OS开发一些实用程序应用程序。在开发应用程序时，我意识到用于Mac OS应用程序开发的教程博客/视频的数量远远少于iOS应用程序开发的数量。尽管人数少的原因很明显，但是我决定记下一个教训，就是这样。

在这个分为两部分的教程系列中，我们将构建一个Mac OS应用程序，即。 “保险柜”。顾名思义，该应用程序将充当一个安全的保险库，其中用户可以隐藏各种文件，应用密码来锁定该应用程序，并且可以摆脱记住那些bash命令以进行隐藏/取消隐藏的操作。

在本部分的最后，这就是您应该开发的。

如果您直接要跳到完成的项目，请从这里克隆它。

首先打开Xcode，然后从New-> Project-> Mac OS中选择Cocoa App 。

创建项目后，打开Main.Storyboard 。与iOS应用故事板不同，这对您来说似乎有些不同。不仅有UIViewController，还有应用程序场景，窗口控制器场景和NSViewController 。我们将在本系列后面的内容中看到“应用程序场景”和“窗口控制器场景”。现在，让我们开始在提供的View Controller中创建UI。

从对象库中，拖动一个Box（NSBox）并将其放在视图控制器中。将框重命名为“ ToolBarBox ”，并添加尾随，前导和顶部的约束，并在超级视图中使用“ 0”作为常量值，并在高度上添加约束（这将与superivew的高度成比例）。为此，将约束添加为“等于Superview的高度”，并将乘数形式1的值更改为0.15

该框可被视为容器视图，其他视图（如“按钮”（用于“添加文件”，“设置”））将驻留在该视图中。我们可以选择NSView代替NSBox，但是为了使事情变得简单，我选择了NSBox（与NSView不同，这里可以使用Attribute Inspector设置许多属性）。

与ToolBarBox相似，在对象库中添加另一个框，并将其命名为“ HeirarchyBox ”。这将包含用于查看隐藏文件的按钮。在此框旁，添加另一个框。 FileExplorerBox 。这些盒子在一起将覆盖控制器的整个宽度。就我而言，控制器的宽度和高度分别为1000和600（根据您的设计随意使用任何尺寸）。

HeirarchyBox和FileExplorerBox的顶部将接触ToolbarBox的底部，并且它们一起将覆盖整个宽度。这样可以为HeirarchyBox提供约束。

虽然FileExplorerBox将在尾随，从底部到超级视图，从顶部到HeirarchyBox 。

我们已经完成了容器的工作，现在让我们在这些容器中添加更多的UI组件。首先，将四个NSButton（用于图像，视频，音频和文档）从对象库拖到HierarchyBox中 ，并将它们嵌入到堆栈视图中。在堆栈视图上方放置一个标签“ My Vault ”。我们将对所有浏览器按钮（音频，视频，图像和文档）使用单一操作方法，因此，将标签分配给每个按钮（在本例中为101,102,103和104）。这就是您的继承框的外观。

现在是FileExplorerBox 。在这里，我们将拥有三个视图，即DragAreaView，CollectionView和Message Container视图。拖动区域视图将是用户拖动文件的视图，集合视图将用于显示用户保存的文件，并且消息容器将包含用于指导用户的消息（例如，此处的拖放文件）。

拖动一个NSView（用于DragArea）和一个NSCollectionView，并应用约束，以使这些视图的大小等于FileExplorerBox的大小。对于消息容器视图，将宽度和高度分别设置为180和110，并将约束应用为“容器中的水平居中”和“容器中的垂直居中”。在此视图中放置一个标签，并将文本设置为“在此处拖放文件” 。放置另一个标签以显示消息“在此目录中找不到任何内容，单击’添加文件’以将文件添加到Vault”，并将其命名为nothingFoundLabel 。

剩下的最后一个框是ToolBarBox 。将两个图像按钮从对象库拖到此框（一个用于添加文件，一个用于设置）。在按钮下方放置两个标签，文本为“ AddFile”和“ Settings”。