用TableView写带特效的cell
用TableView写带特效的cell
效果:
源码地址:
https://github.com/YouXianMing/UI-Component-Collection
分析:
在UIScrollView中的代理中发送广播,然后在cell中接收广播
对每一个cell进行设置
对开发有利的一种小细节:
核心源码:
控制器源码
// // ViewController.m // TableView // // Created by XianMingYou on 15/4/9. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import "ViewController.h" #import "DataCell.h"@interface ViewController ()<UITableViewDelegate, UITableViewDataSource>@property (nonatomic, strong) UITableView *tableView; @property (nonatomic, strong) NSArray *dataSource;@end@implementation ViewController- (void)viewDidLoad {[super viewDidLoad];// 数据源self.dataSource = @[@"YouXianMing", @"Google",@"iOS Developer", @"Android Developer", @"YouTube",@"UI Delveloper", @"PS4 Player", @"XboxOne Player"];// 初始化tableViewself.tableView = [[UITableView alloc] initWithFrame:self.view.boundsstyle:UITableViewStylePlain];self.tableView.delegate = self;self.tableView.dataSource = self;self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;[self.tableView registerClass:[DataCell class] forCellReuseIdentifier:DATA_CELL];[self.view addSubview:self.tableView]; }- (void)scrollViewDidScroll:(UIScrollView *)scrollView {// 发送广播 [[NSNotificationCenter defaultCenter] postNotificationName:DATA_CELLobject:@(scrollView.contentOffset.y)userInfo:nil]; }- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {return self.dataSource.count; }- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {DataCell *cell = [tableView dequeueReusableCellWithIdentifier:DATA_CELL];cell.indexPath = indexPath;cell.label.text = self.dataSource[indexPath.row];return cell; }- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {return CELL_HEIGHT; }@end
cell源码
// // DataCell.h // TableView // // Created by XianMingYou on 15/4/9. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import <UIKit/UIKit.h>#define DATA_CELL @"DataCell" #define CELL_HEIGHT (56.8f * 2)@interface DataCell : UITableViewCell@property (nonatomic, strong) NSIndexPath *indexPath; @property (nonatomic, strong) UILabel *label;@end
// // DataCell.m // TableView // // Created by XianMingYou on 15/4/9. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import "DataCell.h" #import "UIView+SetRect.h"@interface DataCell () @property (nonatomic, strong) UIView *blackView; @end@implementation DataCell- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {self.selectionStyle = UITableViewCellSelectionStyleNone;// 注册通知中心 [[NSNotificationCenter defaultCenter] addObserver:selfselector:@selector(notificationEvent:)name:DATA_CELLobject:nil];// 构建子控件 [self buildViews];}return self; }- (void)buildViews {self.label = [[UILabel alloc] initWithFrame:CGRectMake(30, 0, 300, CELL_HEIGHT)];self.label.font = [UIFont fontWithName:@"Avenir-BookOblique" size:30.f];[self addSubview:self.label];self.blackView = [[UIView alloc] initWithFrame:CGRectMake(10 + 50, 80, 150, 2)];self.blackView.backgroundColor = [UIColor blackColor];[self addSubview:self.blackView]; }- (void)notificationEvent:(id)sender {NSDictionary *data = sender;CGFloat offsetY = [[data valueForKey:@"object"] floatValue] - self.indexPath.row * CELL_HEIGHT;if (offsetY >= 0 && offsetY <= CELL_HEIGHT) {// 根据百分比计算CGFloat percent = 1 - offsetY / CELL_HEIGHT;// 设置值self.label.alpha = percent;self.blackView.x = 10 + percent * 50;} else if (offsetY >= - CELL_HEIGHT * 5 && offsetY <= - CELL_HEIGHT * 4) {// 根据百分比计算CGFloat percent = (offsetY + CELL_HEIGHT) / CELL_HEIGHT + 4;// 设置值self.label.alpha = percent;self.blackView.x = 10 + 50 + (1 - percent) * 50;} else {// 复位self.label.alpha = 1.f;self.blackView.x = 10 + 50;} }- (void)dealloc {// 移除通知中心 [[NSNotificationCenter defaultCenter] removeObserver:selfname:DATA_CELLobject:nil]; }@end
用TableView写带特效的cell相关推荐
- 小程序源码:修复图片音频全新升级带特效喝酒神器小游戏微信小程序
这是一款全新升级带特效喝酒神器小游戏微信小程序源码 小编发现很多喝酒神器小程序都不带特效和音效的 感觉差了那么一点意思而且感觉也不炫酷 所以小编今天给大家带来一款带特效,音效炫酷的喝酒神器 该款神器由 ...
- 微信小程序:修复图片音频全新升级带特效喝酒神器源码
这是一款全新升级带特效喝酒神器小游戏微信小程序源码 小编发现很多喝酒神器小程序都不带特效和音效的 感觉差了那么一点意思而且感觉也不炫酷 所以小编今天给大家带来一款带特效,音效炫酷的喝酒神器 该款神器由 ...
- 小程序源码:修复图片音频全新升级带特效喝酒神器小游戏-多玩法安装简单
这是一款全新升级带特效喝酒神器小游戏微信小程序源码 小编发现很多喝酒神器小程序都不带特效和音效的 感觉差了那么一点意思而且感觉也不炫酷 所以小编今天给大家带来一款带特效,音效炫酷的喝酒神器 该款神器由 ...
- 【六祎 - HTML模板】提交按钮模板-带特效
提交按钮模板-带特效 提交按钮HTML模板 1.html code 2.css code 3.js code 5.嵌入代码块 6.效果图 提交按钮HTML模板 1.html code <butt ...
- 小程序源码:喝酒神器新UI版本带特效和音效,-多玩法安装简单
这是一款也是自带音效和特效的微信小程序源码 由多个喝酒小游戏组合而成,具体如下: 大话骰(带音效) 愤怒大叔(带音效,多个皮肤模板用户可选择) 指尖轮盘(带音效特效) 剪刀石头布(带音效特效) 789 ...
- 喝酒神器小程序源码+全新带特效/多种游戏/支持流量主
正文: 这是一款全新升级带特效喝酒神器小游戏微信小程序源码,之前也发布过很多喝酒神器小程序都不带特效和音效的,这是给大家分享的是带特效/音效/炫酷的喝酒神器助兴小程序: 该款由多个游戏组合而成,每一个 ...
- HTML5期末大作业:个人网站设计——彭于晏明星(15页)带特效 带登录 带轮播 带音乐 HTML+CSS+JavaScript 大学生毕设网页设计源码HTML (1)
HTML5期末大作业:个人网站设计--彭于晏明星(15页)带特效带登录带轮播带音乐 HTML+CSS+JavaScript 期末作业HTML代码 学生网页课程设计期末作业下载 web网页设计制作成品 ...
- 一款好看的导航网源码 全静态页面带特效
介绍: 一款好看的导航网源码 全静态页面带特效 网盘下载地址: http://kekewangLuo.cc/pyLKF2rjqPn 图片:
- web期末作业设计网页:个人生活网站设计——嘉尔明星(7页)带特效带音乐 HTML+CSS+JavaScript
HTML5期末大作业:个人生活网站设计--嘉尔明星(7页)带特效带音乐 HTML+CSS+JavaScript 期末作业HTML代码 学生网页课程设计期末作业下载 web网页设计制作成品 大学生毕设网 ...
最新文章
- 卷积神经网络原理_怎样设计最优的卷积神经网络架构?| NAS原理剖析
- SpringBoot配置属性之DataSource
- Free_NAS 0.72 安装中
- Apache网页优化概述
- Linux下安装zookeeper集群,以及在window用dubbo和代码测试
- html flash带播放视频源码,HTML嵌套Flash播放视频
- 批处理文件(.bat)的写法——DOS命令大全
- ajax返回String类型导致的flowplayer报错p.replace is not a function问题
- SHT20温湿度传感器
- 用matlab开环增益,自控原理实验仿真部份
- Apple Pencil平替哪个好?Apple Pencil平替笔推荐
- RWEQ模型土壤风蚀模数估算及其变化归因分析实践技术
- 二阶可导的充要条件_可导函数在x
- 百度自然语言接口调用
- js中text方法是啥意识_JS中Text节点总结
- android文件打印--printerShare
- 论文阅读笔记:看完也许能进一步了解Batch Normalization
- 面向对象:编程范式、类、对象
- 小i机器人要求苹果公司停售iPhone产品
- 计算机和学生的关系的英语作文,学生和老师的关系的英文作文
热门文章
- C#.net Winform获取文件路径
- EasyNet.Solr架构
- AndoridSQLite数据库开发基础教程(7)
- Xamarin Essentials教程使用指南针Compass
- mvvm模式和mvc的区别_mvvm 和 mvc 区别?
- atom 主板 文件服务器,小巧而精悍!Atom工控主板平台拆解测试
- 两个unit取和会溢出吗_TCP 三次握手原理,你真的理解吗?
- java log 封装_工具类之LogUtils
- linux poll in,Linux poll机制详细讲解
- matlab ktrlink,大神们,怎么设置滑动滑动条然后出来的图形也跟着变化?