Swift - 异步加载各网站的favicon图标,并在单元格中显示

本文介绍了一个简单的应用,展示了如何自定义单元格、实现图片的异步加载及利用didSet方法来自动加载各个网站的favicon图标,并在表格视图中显示。通过创建自定义单元格类和配置主故事版,实现数据源与委托的设置,最终展示了一个包含网站图标的效果图。
下面是一个简单的应用,表格视图的各个单元格自动异步加载各个网站的favicon图标,并显示出来。
主要是复习下如何自定义单元格,单元格中图片的异步加载,以及didSet的用法。

效果图如下:
原文:Swift - 异步加载各网站的favicon图标,并在单元格中显示


操作步骤:
(1)先创建单元格类 - FaviconTableViewCell.swift
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
import UIKit
 
class FaviconTableViewCell : UITableViewCell {
     
     //此操作队列运行下载的完成处理器
    // var operationQueue:NSOperationQueue?
     
     //此单元格显示的URL
     var url: NSURL ? {
         //当URL发生变化
         didSet {
             //显示此文本
             self .textLabel?.text = self .url?.host
             
             //创建请求
             let request = NSURLRequest ( URL : self .url!)
             let session = NSURLSession .sharedSession()
             
             let dataTask = session.dataTaskWithRequest(request,
                 completionHandler: {(data, response, error) -> Void in
                     //将获取到的数据转化成图像
                     let image = UIImage (data: data!)
                     //对UI的更新必须在主队列上完成
                     NSOperationQueue .mainQueue().addOperationWithBlock({
                         () -> Void in
                         //将已加载的图像赋予图像视图
                         self .imageView?.image = image
                         //图像视图可能已经因为新图像而改变了尺寸
                         //所以需要重新调整单元格的布局
                         self .setNeedsLayout()
                     })
 
             }) as NSURLSessionTask
             
             //使用resume方法启动任务
             dataTask.resume()
         }
     }
 
     override func awakeFromNib() {
         super .awakeFromNib()
     }
 
     override func setSelected(selected: Bool , animated: Bool ) {
         super .setSelected(selected, animated: animated)
     }
}

(2)在Main.storyboard中添加一个Table View,并将Table View的Prototype Cells(原型单元格)数改成1,Selection(选择样式)改称No Selection
(3)选中单元格,将样式设为Basic,并将Indentifier(标识符)改为FaviconCell
(4)再把单元格的Identity Inspector(身份查看器)改为FaviconTableViewCell
(5)最后按住Control键,拖动表格视图到视图控制器上,分别添加数据源和委托(dataSource与delegate)
(6)ViewController.swift代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
import UIKit
 
class ViewController : UIViewController {
     
     let hosts = [ "hangge.com" , "163.com" , "baidu.com" , "qq.com" , "taobao.com" ]
 
     override func viewDidLoad() {
         super .viewDidLoad()
     }
     
     //在本例中,只有一个分区
     func numberOfSectionsInTableView(tableView: UITableView !) -> Int {
         return 1;
     }
     
     //返回表格行数(也就是返回控件数)
     func tableView(tableView: UITableView , numberOfRowsInSection section: Int ) -> Int {
         return self .hosts.count
     }
     
     //创建各单元显示内容(创建参数indexPath指定的单元)
     func tableView(tableView: UITableView , cellForRowAtIndexPath indexPath: NSIndexPath )
         -> UITableViewCell
     {
         //为了提供表格显示性能,已创建完成的单元需重复使用
         let identify: String = "FaviconCell"
         //同一形式的单元格重复使用,在声明时已注册
         let cell = tableView.dequeueReusableCellWithIdentifier(identify)
             as ! FaviconTableViewCell
         
         let host = hosts[indexPath.row]
         let url = NSURL (string: "http://\(host)/favicon.ico" )
         cell.url = url
         return cell
     }
 
     override func didReceiveMemoryWarning() {
         super .didReceiveMemoryWarning()
     }
}

原文出自: www.hangge.com  转载请保留原文链接: http://www.hangge.com/blog/cache/detail_873.html

转载于:https://www.cnblogs.com/Free-Thinker/p/4858374.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值