用Swift开发Mac App(3)

发布时间：2020-12-14 02:14:20 所属栏目：百科来源：网络整理

导读：显示昆虫列表在 OS X中，Table View使用 NSTableView 类，它等同于iOS的 UITableView 类，但有一个最大的不同是： NSTableView 的每一行有多个列或多个单元格。 · 在 OS X 10.7Lion 之前 ,table view cell继承于NSCell类。而后者并非NSView类，因此开发者

显示昆虫列表

在 OS X中，Table View使用NSTableView类，它等同于iOS的UITableView类，但有一个最大的不同是：NSTableView的每一行有多个列或多个单元格。

·在OS X 10.7Lion之前,table view cell继承于NSCell类。而后者并非NSView类，因此开发者需要自己处理绘图和鼠标事件。

·从 OS X 10.7开始,table view从 NSView继承。这样就和UITableView差不多了。cell也有相应的View类型，因此也和iOS中的类似——这样我们就轻松得多了!

在本教程中，使用的是基于View的TableView。如果你想了解NSTableView的用法，你可以阅读这里,它对 table views 的用法进行了详细的说明。

打开MasterViewController.xib，选中table view。注意Table View位于Scroll View中的Clip View中，因此第一个点击你选中的会是ScrollView，第二次点击你选中的才是ClipView，第三次点击才会选中Table View。

当然，你也可以直接从IB的Objects面板中选择Table View对象（展开 Clip View对象）。

选中Table View之后，在属性面板中，确认Content Mode一项是设置为View Based而不是Cell Based。同时，因为我们的列表仅显示单列，所以将Columns属性修改为1。

勾选 “Alternating Rows”属性，让表格以“明暗颜色交替”的方式绘制单元格。

反选 “Headers” 属性，因为我们不需要在表格上方显示一个标题。

接下来我们修改单元格的大小。选择Table View上的列，拖动它的大小使其占据整个表格宽度。

然后是单元格的配置。我们需要在单元格中显示昆虫的图片和名称，因此需要在Cell中添加一个Image和一个文本控件。

IB中有一种带Image View和Text Field的NSTableCellView对象，我们可以使用它。

在Object library 面板中，找到 “Image & Text Table Cell View”,将它拖到Table View中。

在Table View中，将原来的cell删除（用delete键）。

选中Table View Cell，在Size面板中，将高度调整为32。

然后选中Image View和 Text Field，使它们位于单元格中心，并调整ImageView和Text Field的大小，使它们看起来如下图所示：

接下来要为每一列设置一个id。当然对于本教程来说，我们只有一个列，因此列id可能不是必须的。

在Objects面板中选择表格列，打开Identity面板，将Identifier设置为BugColumn。

如同在iOS中一样，Table View也有Data Source和Delegate属性。正常情况下，这两个属性都是同一个对象，即MasterViewController。

选择Table View，打开Connections面板，在Outlets一项下找到delegate和data source。

点击delegate右边的小圆圈，拖到Objects面板中的“File’s Owner”上。

这将吧Table View 的delegate 属性设置为MasterViewController。重复同样的动作，设置Data Source属性。

最终如下图所示：

打开MasterViewController.swift将下列代码放在文件最后：

// MARK: - NSTableViewDataSource

extension MasterViewController: NSTableViewDataSource {

func numberOfRowsInTableView(aTableView: NSTableView!) -> Int {

return self.bugs.count

}

func tableView(tableView: NSTableView!,viewForTableColumn tableColumn: NSTableColumn!,row: Int) -> NSView! {

// 1

var cellView: NSTableCellView = tableView.makeViewWithIdentifier(tableColumn.identifier,owner: self) as NSTableCellView

// 2

if tableColumn.identifier == "BugColumn" {

// 3

let bugDoc = self.bugs[row]

cellView.imageView!.image = bugDoc.thumbImage

cellView.textField!.stringValue = bugDoc.data.title

return cellView

}

return cellView

}

// MARK: - NSTableViewDelegate

extension MasterViewController: NSTableViewDelegate { }

我们通过扩展让MasterViewController采用NSTableViewDelegate和NSTableViewDataSource协议。

要让列表渲染数据至少需要实现两个数据源方法。

首先是numberOfRowsInTableView方法，OS通过这个方法获取要渲染的表格行数。

其次是tableView(_:viewForTableColumn:row:)方法。OS通过这个方法知道如何去渲染每行中的每个单元格。在这个方法中，我们需要用数据对单元格进行填充。

运行程序，如果一切正常，我们将在表格中看到昆虫列表。

下载资源

为了完成本教程，你可能需要下载这些压缩包，并解压缩。

注意:为了将昆虫分成 “一点也不可怕” 到 “极度恐怖”几个级别，你还需要用到一个开源的分级组件EDStarRating，这也被包含在压缩包中。

在本教程中，我们不会解释如何实现这个组件，而只是演示如何在项目中使用它。压缩包中还包括了一个NSImage类别，可以从一张大图片生成缩略图。此外，还包括3张怪脸图片，分别用于显示昆虫的不同级别。

关于 EDStarRating组件，你可以参考它的github主页.

首先，在项目导航窗口中创建一个名为Art的文件夹，并将3个怪脸图片拖到这个文件夹中——确保“Copy items if needed” 已勾选,以及Add to targets中的“ScaryBugsMac” 已选上。

再创建一个名为“Views” 的文件夹,将EDStarRating.h和EDStarRating.m拖到该文件夹。再次确保“Copy items if needed” 已勾选以及Add to targets中的“ScaryBugsMac” 已选上。

点击Finish. 在下一窗口当被问到 “Would you like to configure an Objective-C bridgingheader?” 时选择Yes。这将创建一个Objective-C 类到Swift 代码的桥接头文件。

对于NSImage+Extras.h和NSImage+Extras.m,重复上述步骤，只不过这次将它们拖进的是“Helpers”文件夹。

打开ScaryBugsMac-Bridging-Header.h加入以下import语句：

#import "EDStarRating.h" #import "NSImage+Extras.h"

以下为最终效果，其中桥接头文件已经被我们移到 Supporting Files 文件夹中:

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!