swift 4自定义UITableCell的方法示例
前言
本文主要给大家介绍了关于swift 4自定义UITableCell的相关内容,分享出来供大家参考学习价值,下面话不多说了,来一起看看详细的介绍吧
直接上图
新建MenuCell
创建一个类 MenuCell 继承 UITableViewCell 添加两个要实现的方法
override init(style: UITableViewCellStyle, reuseIdentifier: String?) { super.init(style: style, reuseIdentifier: reuseIdentifier) } required init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) }
初始化组件
把tableCell里要显示的组件都初始化好,我这里就只有两个组件
class MenuCell: UITableViewCell { var icon = UIImageView() var title = UILabel() lazy var box = UIView() override init(style: UITableViewCellStyle, reuseIdentifier: String?) { super.init(style: style, reuseIdentifier: reuseIdentifier) box.addSubview(icon) box.addSubview(title) self.addSubview(box) } }
组件加进去了,接下来就是布局了,Github上有个star数很高的布局库,用pod安装就可以用了,地址:https://github.com/SnapKit/SnapKit
布局
用法还是比较简单的,看文档就能明白大概用法了,下面是我的布局
override init(style: UITableViewCellStyle, reuseIdentifier: String?) { super.init(style: style, reuseIdentifier: reuseIdentifier) box.addSubview(icon) box.addSubview(title) self.addSubview(box) icon.snp.makeConstraints { (make) in // 设置icon组件距离box组件左,上各10个距离单位(不太清楚是不是像素),偏移12个距离单位 make.left.top.equalTo(10).offset(12) // 设置icon的宽高各20个单位 make.width.height.equalTo(20) } title.snp.makeConstraints { (make) in // 设置title组件位置从icon组件的右边开始算起,再偏移10个单位 make.left.equalTo(self.icon.snp.right).offset(10) // 设置title距离上面高度跟icon一样 make.top.equalTo(self.icon) } }
给TableCell附值
在 MenuCell 里新建一个方法,可以把在 TableView里创建好的数据传过来并给icon,title,附上值
func setValueForCell(menu: MenuModel) { title.text = menu.title icon = ImageUtil.loadImageFromUrl(imageView: icon, url: menu.url) }
方法里的 ImageUtil 是我封装的一个静态方法,用于显示网络图片的
class ImageUtil { class func loadImageFromUrl(imageView: UIImageView, url: String) -> UIImageView { //定义URL对象 let url = URL(string: url) //从网络获取数据流 let data = try! Data(contentsOf: url!) //通过数据流初始化图片 let newImage = UIImage(data: data) imageView.image = newImage return imageView } }
上面自定义的加载网络图片的方法会有很长的延迟,当点击Cell进入下一面的时候,网络加载会花大量时间,这样会导致页面出现白屏,解决办法有两个,一个是把加载图片的地方改成异步加载,一个是引用第三方的图片加载库
将网络消耗的代码放在异步线程里方法
func setValueForCell(menu: MenuModel) { title.text = menu.title DispatchQueue.global().async { self.icon = ImageUtil.loadImageFromUrl(imageView: self.icon, url: menu.url) } //icon = ImageUtil.loadImageFromUrl(imageView: icon, url: menu.url) }
这样程序就不会卡了,运行会看到图片最开始是没有的,然后慢慢的加载出来,但这样xcode会报一个错 UIImageView.image must be used from main thread only 网上查了一下,这是把ui操作放在异步里执行的问题,如果一个异步操作耗时很长,那么程序就会进入假死状态,系统就会弹出 就用无响应 这样的提示,所以这种是不推荐的
另一种是引入第三方类库 https://github.com/onevcat/Kingfisher
用法也很简单
import Kingfisher let url = URL(string: menu.icon) //设置加载菊花 self.icon.kf.indicatorType = .activity self.icon.kf.setImage(with: url)
方法里的 MenuModel 是我定义的一个菜单的结构体
struct MenuModel { var title: String var url: String }
处理TableView渲染方法
先在在tableView里注册自己定义的 TableCell
override func viewDidLoad() { // ... //注册cell的Identifier,用于渲染cell self.tableView.register(MenuCell.self, forCellReuseIdentifier: "cellID") }
修改渲染方法
//渲染cell func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cellID") as! MenuCell cell.setValueForCell(menu: data[indexPath.row]) return cell }
这样就好了,直接运行看效果吧
还是带上图片了app才好看
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对猪先飞的支持。
相关文章
- 这篇文章主要给大家介绍了关于C#创建自定义控件及添加自定义属性和事件使用的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用C#具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧...2020-06-25
- 本文实例讲述了JS实现自定义简单网页软键盘效果。分享给大家供大家参考,具体如下:这是一款自定义的简单点的网页软键盘,没有使用任何控件,仅是为了练习JavaScript编写水平,安全性方面没有过多考虑,有顾虑的可以不用,目的是学...2015-11-08
- 为了增强android应用的用户体验,我们可以在一些Button按钮上自定义动态的设置一些样式,比如交互时改变字体、颜色、背景图等。 今天来看一个通过重写Button来动态实...2016-09-20
- 下面我们来看一篇关于Android自定义WebView网络视频播放控件开发例子,这个文章写得非常的不错下面给各位共享一下吧。 因为业务需要,以下代码均以Youtube网站在线视...2016-10-02
- 自定义一个jquery模态窗口插件,将它集成到现有平台框架中时,它只能在mainFrame窗口中显示,无法在顶层窗口显示. 解决这个问题的办法: 通过以下代码就可能实现在顶层窗口弹窗 复制代码 代码如下: $(window.top.documen...2014-05-31
- 这篇文章主要介绍了自定义feignClient的常见坑及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教...2021-10-20
- 今天小编就为大家分享一篇pytorch 自定义卷积核进行卷积操作方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-05-06
PHP YII框架开发小技巧之模型(models)中rules自定义验证规则
YII的models中的rules部分是一些表单的验证规则,对于表单验证十分有用,在相应的视图(views)里面添加了表单,在表单被提交之前程序都会自动先来这里面的规则里验证,只有通过对其有效的限制规则后才能被提交,可以很有效地保证...2015-11-24- 这篇文章主要介绍了jquery自定义插件开发之window的实现过程的相关资料,需要的朋友可以参考下...2016-05-09
- 这篇文章主要介绍了C#自定义事件监听实现方法,涉及C#事件监听的实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下...2020-06-25
- 这篇文章主要介绍了Vue 组件复用多次自定义参数操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-07-27
- 这篇文章主要介绍了使用BindingResult 自定义错误信息,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教...2021-10-23
- 这篇文章主要介绍了在Vue中获取自定义属性方法:data-id的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-09-09
- 今天小编就为大家分享一篇pytorch 自定义参数不更新方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-04-29
- 下面小编就为大家带来一篇thinkphp自定义权限管理之名称判断方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2017-04-03
- Nginx日志主要分为两种:访问日志和错误日志。访问日志主要记录客户端访问Nginx的每一个请求,格式可以自定义。下面这篇文章主要给大家介绍了Nginx自定义访问日志的配置方式,需要的朋友可以参考学习,下面来一起看看吧。...2017-07-06
- 这篇文章主要介绍了微信小程序 Toast自定义实例详解的相关资料,需要的朋友可以参考下...2017-01-23
- 404页面就是一个告诉搜索引擎这个页面不存在了,同时也提示用户可以选择其它的操作了,下面我来给没有apache操作权限朋友介绍php中自定义404页面的操作方法。 方法一...2016-11-25
- implicit 关键字用于声明隐式的用户定义类型转换运算符。如果转换过程可以确保不会造成数据丢失,则可使用该关键字在用户定义类型和其他类型之间进行隐式转换,这篇文章就给大家详细介绍implicit关键字做自定义类型隐式转换的方法,需要的朋友可以参考下...2020-06-25
浅谈Java自定义类加载器及JVM自带的类加载器之间的交互关系
这篇文章主要介绍了浅谈Java自定义类加载器及JVM自带的类加载器之间的交互关系,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-02-22