UITableView实现格瓦拉飞天投票模块-b

2024-02-03 18:40

本文主要是介绍UITableView实现格瓦拉飞天投票模块-b,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

格瓦拉目前来说动画效果确实做的还比较好,虽然不是说很炫但做到精致,这次就模仿了它投票的模块。其实想到要实现它还是有很多方法,不过这次我还是采用了苹果自带控件UITableView简简单单来实现它,再次认识它的强大一面。

Github地址:https://github.com/ZFbaby/ZFVoteViewDemo(欢迎star~谢谢)

接着先上效果:

实现步骤:

* 数据回来的时候就要根据数据算出每一行的高度并且算出总高,总高就是tableview的高度

-(void)setTitle:(NSString *)title
{//根据数据算出每行cell的实际高度_title = title;CGFloat title_H = [title boundingRectWithSize:CGSizeMake(ZFVoteTableViewMax_W - percentLable_W - thumbUpView_WH - 85, 100)options:NSStringDrawingUsesFontLeading|NSStringDrawingUsesLineFragmentOriginattributes:@{NSFontAttributeName:[UIFont systemFontOfSize:15.0]}context:nil].size.height;self.voteCell_H = title_H + 30;
}

* 设置cell的内边距离及x值,利用setFrame:方法改变原来父类算好的frame实现cell有内边距离,达到实现相邻两条cell不连接在一起的效果

-(void)setFrame:(CGRect)frame{if (frame.size.width == ZFVoteTableViewMax_W) {//初始化就设置cell的内边距frame = UIEdgeInsetsInsetRect(frame,UIEdgeInsetsMake(ZFVoteCellTopBottomInset,ZFVoteCellLeftRightInset,ZFVoteCellTopBottomInset,ZFVoteCellLeftRightInset));}else{//重复利用的时候改变它的x值frame.origin.x += ZFVoteCellLeftRightInset;}[super setFrame:frame];
}

* 创建投票主控件并添加到cell上,投票主控件就是所有要展示动画效果的控件集合,有cell了为什么还需要它,其实说白了它就是打酱油的,只是为了呈现动画的一种载体,在看下面一条就了解了

-(void)initSubviews{ZFPercentBar *bar = [[ZFPercentBar alloc]initWithFrame:self.bounds];self.bar = bar;[self addSubview:bar];UIImageView *thumbUpView = [[UIImageView alloc]init];self.thumbUpView = thumbUpView;[self addSubview:thumbUpView];UILabel *percentLable = [UILabel labelWithFont:[UIFont systemFontOfSize:13.0]textColor:[UIColor lightGrayColor]textAlignment:NSTextAlignmentRightnumberOfLines:1];self.percentLable = percentLable;[self addSubview:percentLable];UILabel *voteLabel = [UILabel labelWithFont:[UIFont systemFontOfSize:15.0]textColor:[UIColor blackColor]textAlignment:NSTextAlignmentLeftnumberOfLines:0];self.voteLabel = voteLabel;[self addSubview:voteLabel];
}

每次点击选择一个cell的时候创建个投票主控件,然后隐藏被选择的cell,改变主控件的形变添加阴影效果使它看起来有浮动效果,改变主控件坐标到当前 tableView的第一行cell的位置,在利用tableview本身自带的功能交换行实现的方法就完成了cell之间的交换效果

ZFVoteView *voteView = [[ZFVoteView alloc]initWithFrame:selectedCell.frame
voteView:voteModel];
voteView.layer.masksToBounds = NO;
[self.tableView addSubview:voteView];
self.tableView.userInteractionEnabled = NO;
[UIView animateWithDuration:0.4
animations:^{voteView.transform = CGAffineTransformMakeScale(1.05, 1.05);
}
completion:^(BOOL finished) 
{[UIView animateWithDuration:0.7animations:^{[self.list removeObject:voteModel];[self.list insertObject:voteModel atIndex:0];[self.tableView moveRowAtIndexPath:indexPathtoIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]];voteView.centerY = selectedCell.centerY;voteView.centerX = selectedCell.centerX;}completion:^(BOOL finished) {[UIView animateWithDuration:0.4animations:^{voteView.transform = CGAffineTransformIdentity;}completion:^(BOOL finished) {[voteView removeFromSuperview];self.tableView.userInteractionEnabled = YES;}];}];
}];

以上只是个人的对该模块按自己的想法和思路实现,最后还要感谢GraphKit作者,demo中部分绘图动画功能引用至它的方法及进行了小部分修改,

Github地址:https://github.com/ZFbaby/ZFVoteViewDemo

这篇关于UITableView实现格瓦拉飞天投票模块-b的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/675032

相关文章

MySQL双主搭建+keepalived高可用的实现

《MySQL双主搭建+keepalived高可用的实现》本文主要介绍了MySQL双主搭建+keepalived高可用的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,... 目录一、测试环境准备二、主从搭建1.创建复制用户2.创建复制关系3.开启复制,确认复制是否成功4.同

Java实现文件图片的预览和下载功能

《Java实现文件图片的预览和下载功能》这篇文章主要为大家详细介绍了如何使用Java实现文件图片的预览和下载功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... Java实现文件(图片)的预览和下载 @ApiOperation("访问文件") @GetMapping("

使用Sentinel自定义返回和实现区分来源方式

《使用Sentinel自定义返回和实现区分来源方式》:本文主要介绍使用Sentinel自定义返回和实现区分来源方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Sentinel自定义返回和实现区分来源1. 自定义错误返回2. 实现区分来源总结Sentinel自定

Java实现时间与字符串互相转换详解

《Java实现时间与字符串互相转换详解》这篇文章主要为大家详细介绍了Java中实现时间与字符串互相转换的相关方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、日期格式化为字符串(一)使用预定义格式(二)自定义格式二、字符串解析为日期(一)解析ISO格式字符串(二)解析自定义

opencv图像处理之指纹验证的实现

《opencv图像处理之指纹验证的实现》本文主要介绍了opencv图像处理之指纹验证的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录一、简介二、具体案例实现1. 图像显示函数2. 指纹验证函数3. 主函数4、运行结果三、总结一、

Springboot处理跨域的实现方式(附Demo)

《Springboot处理跨域的实现方式(附Demo)》:本文主要介绍Springboot处理跨域的实现方式(附Demo),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不... 目录Springboot处理跨域的方式1. 基本知识2. @CrossOrigin3. 全局跨域设置4.

Spring Boot 3.4.3 基于 Spring WebFlux 实现 SSE 功能(代码示例)

《SpringBoot3.4.3基于SpringWebFlux实现SSE功能(代码示例)》SpringBoot3.4.3结合SpringWebFlux实现SSE功能,为实时数据推送提供... 目录1. SSE 简介1.1 什么是 SSE?1.2 SSE 的优点1.3 适用场景2. Spring WebFlu

基于SpringBoot实现文件秒传功能

《基于SpringBoot实现文件秒传功能》在开发Web应用时,文件上传是一个常见需求,然而,当用户需要上传大文件或相同文件多次时,会造成带宽浪费和服务器存储冗余,此时可以使用文件秒传技术通过识别重复... 目录前言文件秒传原理代码实现1. 创建项目基础结构2. 创建上传存储代码3. 创建Result类4.

SpringBoot日志配置SLF4J和Logback的方法实现

《SpringBoot日志配置SLF4J和Logback的方法实现》日志记录是不可或缺的一部分,本文主要介绍了SpringBoot日志配置SLF4J和Logback的方法实现,文中通过示例代码介绍的非... 目录一、前言二、案例一:初识日志三、案例二:使用Lombok输出日志四、案例三:配置Logback一

Python如何使用__slots__实现节省内存和性能优化

《Python如何使用__slots__实现节省内存和性能优化》你有想过,一个小小的__slots__能让你的Python类内存消耗直接减半吗,没错,今天咱们要聊的就是这个让人眼前一亮的技巧,感兴趣的... 目录背景:内存吃得满满的类__slots__:你的内存管理小助手举个大概的例子:看看效果如何?1.