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

相关文章

linux批量替换文件内容的实现方式

《linux批量替换文件内容的实现方式》本文总结了Linux中批量替换文件内容的几种方法,包括使用sed替换文件夹内所有文件、单个文件内容及逐行字符串,强调使用反引号和绝对路径,并分享个人经验供参考... 目录一、linux批量替换文件内容 二、替换文件内所有匹配的字符串 三、替换每一行中全部str1为st

SpringBoot集成MyBatis实现SQL拦截器的实战指南

《SpringBoot集成MyBatis实现SQL拦截器的实战指南》这篇文章主要为大家详细介绍了SpringBoot集成MyBatis实现SQL拦截器的相关知识,文中的示例代码讲解详细,有需要的小伙伴... 目录一、为什么需要SQL拦截器?二、MyBATis拦截器基础2.1 核心接口:Interceptor

SpringBoot集成EasyPoi实现Excel模板导出成PDF文件

《SpringBoot集成EasyPoi实现Excel模板导出成PDF文件》在日常工作中,我们经常需要将数据导出成Excel表格或PDF文件,本文将介绍如何在SpringBoot项目中集成EasyPo... 目录前言摘要简介源代码解析应用场景案例优缺点分析类代码方法介绍测试用例小结前言在日常工作中,我们经

基于Python实现简易视频剪辑工具

《基于Python实现简易视频剪辑工具》这篇文章主要为大家详细介绍了如何用Python打造一个功能完备的简易视频剪辑工具,包括视频文件导入与格式转换,基础剪辑操作,音频处理等功能,感兴趣的小伙伴可以了... 目录一、技术选型与环境搭建二、核心功能模块实现1. 视频基础操作2. 音频处理3. 特效与转场三、高

Python实现中文文本处理与分析程序的示例详解

《Python实现中文文本处理与分析程序的示例详解》在当今信息爆炸的时代,文本数据的处理与分析成为了数据科学领域的重要课题,本文将使用Python开发一款基于Python的中文文本处理与分析程序,希望... 目录一、程序概述二、主要功能解析2.1 文件操作2.2 基础分析2.3 高级分析2.4 可视化2.5

Java实现预览与打印功能详解

《Java实现预览与打印功能详解》在Java中,打印功能主要依赖java.awt.print包,该包提供了与打印相关的一些关键类,比如PrinterJob和PageFormat,它们构成... 目录Java 打印系统概述打印预览与设置使用 PageFormat 和 PrinterJob 类设置页面格式与纸张

使用Go实现文件复制的完整流程

《使用Go实现文件复制的完整流程》本案例将实现一个实用的文件操作工具:将一个文件的内容完整复制到另一个文件中,这是文件处理中的常见任务,比如配置文件备份、日志迁移、用户上传文件转存等,文中通过代码示例... 目录案例说明涉及China编程知识点示例代码代码解析示例运行练习扩展小结案例说明我们将通过标准库 os

Python实现终端清屏的几种方式详解

《Python实现终端清屏的几种方式详解》在使用Python进行终端交互式编程时,我们经常需要清空当前终端屏幕的内容,本文为大家整理了几种常见的实现方法,有需要的小伙伴可以参考下... 目录方法一:使用 `os` 模块调用系统命令方法二:使用 `subprocess` 模块执行命令方法三:打印多个换行符模拟

SpringBoot+EasyPOI轻松实现Excel和Word导出PDF

《SpringBoot+EasyPOI轻松实现Excel和Word导出PDF》在企业级开发中,将Excel和Word文档导出为PDF是常见需求,本文将结合​​EasyPOI和​​Aspose系列工具实... 目录一、环境准备与依赖配置1.1 方案选型1.2 依赖配置(商业库方案)二、Excel 导出 PDF

Python实现MQTT通信的示例代码

《Python实现MQTT通信的示例代码》本文主要介绍了Python实现MQTT通信的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一... 目录1. 安装paho-mqtt库‌2. 搭建MQTT代理服务器(Broker)‌‌3. pytho