256
10
2.
AddAttachment.pdf
图像添加到图像列表中。接下来,定义表示各个附件的集合视
图单元格类。
3.
DocumentViewController.swift
文件中添加
AttachmentCell
类。它是
UICollectionViewCell
的子类,有两个
outlet
,分别是图像视图和标注。
class AttachmentCell : UICollectionViewCell {
@IBOutlet weak var imageView : UIImageView?
@IBOutlet weak var extensionLabel : UILabel?
}
手动添加附件
这个
iOS
应用还不支持添加附件,如果在
iOS
模拟器中测试我们即将实现的功能,
最简单的方法是自己动手添加一些附件。借此机会还可以一睹应用在
iOS
系统中的
结构。在
iCloud
容器中打开文档包,然后添加附件:
1.
启动应用,注意启动时日志中输出的路径,开头应该是这样的
file:///
Users/...
2.
复制这个路径(不含开头的
file://
),然后打开
Terminal
应用(在
Mac
硬盘的
Applications
Utilities
文件夹里)。
3.
输入
open
,再输入
"
(双引号),然后粘贴那个
URL
。再输入一个
"
,然后
按回车键。
Finder
中会打开容器所在的文件夹。
4.
打开
Documents
文件夹,里面是
iPhone
模拟器可以访问的文档列表。在一个
文档上单击鼠标右键,然后单击“显示包内容”(
Show Package Contents
)。
如果没有文档,在
iPhone
应用中创建一个,它会出现在
Finder
窗口中。
5.
打开
Attachments
文件夹。如果不存在,新建一个(拼写要正确,大小写也要
相同)。
6.
随便拖曳一个文件到这个文件夹里。最好使用图像。
7.
搞定!现在文档有附件了。
如果愿意,也可以使用本书前面构建的那个
OS X
应用添加附件。
处理文件和文件类型
257
接下来,要让视图控制器使用这个类列出所有附件。
1.
打开
DocumentViewController.swift
2.
UICollectionView
添加一个
outlet
,名为
attachmentsCollectionView
@IBOutlet weak var attachmentsCollectionView : UICollectionView!
3.
DocumentViewController
创建一个扩展,符合
UICollectionViewDataSource
UICollectionViewDelegate
两个协
议:
extension DocumentViewController : UICollectionViewDataSource,
UICollectionViewDelegate {
}
UICollectionViewDelegate
UICollectionViewDataSource
相关的方法放在扩
展中可以将其与
DocumentViewController
对象专用的方法和属性区分开。这只是一
种风格上的选择
4.
在这个扩展中实现
numberOfItemsInSection
方法,它的作用是返回文档所含的附件
数量,外加一个额外的单元格(“添加附件”单元格):
func collectionView(collectionView: UICollectionView,
numberOfItemsInSection section: Int) -> Int {
//
如果文档已关闭或不存在,没有单元格
if self.document!.documentState.contains(.Closed) {
return 0
}
guard let attachments = self.document?.attachedFiles else {
//
如果无法访问附件列表,没有单元格
return 0
}
//
返回获得的单元格数量,额外再加一个
return attachments.count + 1
}
为了确认附件列表中有多少单元格,首先需要检查文档是否已经关闭如果已经关闭,
就不显示附件和“添加附件”单元格(视图控制器出现在屏幕上,但是正在打开文
档,就是这种情况)然后,查询文档的
attachedFiles
数组有多少元素,再加一。
那个额外的单元格是“添加附件”单元格。
258
10
5.
实现
cellForItemAtIndexPath
方法:
func collectionView(collectionView: UICollectionView,
cellForItemAtIndexPath indexPath: NSIndexPath) ->
UICollectionViewCell {
//
确定要显示多少个单元格
let totalNumberOfCells =
collectionView.numberOfItemsInSection(indexPath.section)
//
检查要配置的是“添加附件”单元格还是其他单元格
//
如果是最后一个单元格,那就是“添加附件”单元格
let isAddCell = (indexPath.row == (totalNumberOfCells - 1))
//
存储单元格的位置
//
使用“
let
”的目的是确保不会意外赋值,不然编译器会提醒
let cell : UICollectionViewCell
//
如果需要,创建并返回“添加附件”单元格
if isAddCell {
cell = collectionView.dequeueReusableCellWithReuseIdentifier(
"AddAttachmentCell", forIndexPath: indexPath)
} else {
//
这是常规的附件单元格
//
获取单元格
let attachmentCell = collectionView
.dequeueReusableCellWithReuseIdentifier("AttachmentCell",
forIndexPath: indexPath) as! AttachmentCell
//
获取附件的缩略图
let attachment = self.document?.attachedFiles?[indexPath.row]
var image = attachment?.thumbnailImage()
//
把缩略图放入单元格
if image == nil {
//
不知道是什么类型,使用默认的缩略图
image = UIImage(named: "File")
//
再设置标注
attachmentCell.extensionLabel?.text =
attachment?.fileExtension?.uppercaseString
} else {
//
知道是什么类型,确保标注是空的
attachmentCell.extensionLabel?.text = nil
}
attachmentCell.imageView?.image = image
//
使用这个单元格
cell = attachmentCell
}
处理文件和文件类型
259
return cell
}
这个
cellForItemAtIndexPath
方法与
DocumentListViewController
中的同名方法十
分相似:集合视图会提供索引路径,我们使用它获取附件的缩略图,然后显示在单元
格中。这个方法唯一不同的地方是,如果索引路径指代集合视图中的最后一个单元格,
不显示附件,而是显示
AddAttachmentCell
下面设计附件单元格的界面。
1.
打开
Main.storyboard
,选择附件集合视图。
2.
开“
Attributes Inspector
”, 把“
Items
”的数量由
1
改为
2
,再把
Scroll
Direction
”设为“
Horizontal
”(见图
10-4
)。
10-4
更新集合视图的设置
3.
选择第一个单元格,把它的标识符(
Identifier
)设为
AttachmentCell
4.
打开“
Identity Inspector
”,把这个单元格的类设为
AttachmentCell
5.
选择第二个单元格,把它的标识符设为
AddAttachmentCell
6.
分别把一个
UIImageView
拖曳到两个单元格中。
7.
让两个图像视图填满整个单元格,即调整尺寸填满单元格,然后添加约束,把距各
边的距离都设为
0
260
10
8.
选择添加到第一个单元格中的图像视图,即
AttachmentCell
,然后打开“
Attributes
Inspector
”。把“
Mode
”设为“
Aspect Fill
”。这样图像会占满整个图像视图。
9.
为第一个单元格添加一个标注。把它放到接近单元格底部的位置,然后调整尺寸
占满整个宽度。
把字号减小为
13
把文本对齐方式设为居中。
添加约束,把标注固定在单元格底部,而且与左右两边重合。
10.
接下来,选择第二个单元格(
AddAttachmentCell
)中的图像视图。把“
Mode
”设
为“
Center
”。这样图像会在视图中居中显示,而且不缩放。
11.
AddAttachmentCell
中图像视图的“
Image
”属性设为
AddAttachment
,如图
10-5
所示。
10-5
设置图像视图的图像
现在,集合视图的单元格如图
10-6
所示。
10-6
配置好的集合视图
12.
在辅助编辑器中打开
DocumentViewController.swift
13.
AttachmentCell
中那个空图像视图与
AttachmentCell
类中的
imageView
outlet
接起来。

Get Swift学习手册 now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.