博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iOS实现UITableViewCell点击展开文本内容
阅读量:6267 次
发布时间:2019-06-22

本文共 1330 字,大约阅读时间需要 4 分钟。

前言

这是第一次发表自己的博客,一直不知道该写点什么东西,恰巧今天写了个App中比较常见的使用场景,列表页面列表每行显示的数据有限,不能完整的显示所有内容,通过点击UITableViewCell将不能完全展示的内容展示完全,再次点击会继续隐藏部分内容。Demo见:,效果如图:

实现思路

1、通过自动布局方式设置UILabel在TableViewCell的位置,必须保证Label的top、left、right、bottom都有约束条件(本例子布局使用); 2、在给TableViewCell传入的模型添加一个字段open,标记TableViewCell内容是否打开,如果打开将Label的numberOfLines设置为0,关闭值为1;

- (void)setOpen:(BOOL)open{    if (open == YES) {        self.label.numberOfLines = 0;    } else {        self.label.numberOfLines = 1;    }        [self layoutIfNeeded];}- (void)layoutSubviews{    [super layoutSubviews];        [self.label mas_makeConstraints:^(MASConstraintMaker *make) {        make.top.mas_equalTo(self.contentView.mas_top).offset(8);        make.left.mas_equalTo(self.contentView.mas_left).offset(8);        make.right.mas_equalTo(self.contentView.mas_right).offset(-8);        make.bottom.mas_equalTo(self.contentView.mas_bottom).offset(-8);    }];}复制代码

3、在TableView的代理方法- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath中,更改open的值,并刷新TableView。

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{    VCObject *object = (VCObject *)self.dataSource[indexPath.row];    object.open = !object.open;        [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade];}复制代码

转载地址:http://ggdpa.baihongyu.com/

你可能感兴趣的文章
阿里云开发者工具上手体验
查看>>
前端模块化详解(完整版)
查看>>
CSS 从入门到放弃系列:CSS的引入方式
查看>>
策略模式原来这么简单!
查看>>
js中 split slice splice 的区分
查看>>
阿里云运维总结
查看>>
js实用方法记录-js动态加载css、js脚本文件
查看>>
微信小程序入门: 导航栏样式、tabBar导航栏
查看>>
Runtime整理(二)——Runtime包含的所有函数
查看>>
nodejs request模块用法
查看>>
使用webpack从0搭建多入口网站脚手架,可复用导航栏/底部通栏/侧边栏,根据页面文件自动更改配置,支持ES6/Less...
查看>>
消息未读之点不完的小红点(Node+Websocket)
查看>>
JavaScript 之 DOM [ Node对象 ]
查看>>
使用vscode写typescript(node.js环境)起手式
查看>>
飞天技术汇大视频专场:全民视频时代下的创新技术之路
查看>>
以太坊分片详解
查看>>
Redis安装以及PHP开启Redis扩展
查看>>
JAVA IO BIO NIO AIO
查看>>
使用iview的组件 Table 表格,有固定列,设置其中一个列适应屏幕大小
查看>>
Vue学习笔记1
查看>>