iOS 类似外卖 两个tableView联动
在伯乐在线上看到一个挺好玩的文章,自己也参考文章实现了一下。
效果实现如图所示:

具体实现的内容可以参考原文,参考文章:《iOS 类似美团外卖 app 两个 tableView 联动效果实现》
首先,从界面上来看,很显然是两个UITableview上下滑动的效果。而这种滑动的效果核心是左边的tableView如何和右边的tableView进行关联,并且点击左边tableView之后右边的tableview也可以滑动到对应的section。
好了,分析完毕之后,我们应该清楚了我们的2个需求:
1.当点击左边TableViewCell时候,右边TableView会跟随着滑动到对应的section
2.当滑动右边TableView时候,左边TableView会根据右边UITableView的section滑动到对应的UITableViewCell位置
但是个人认为还有几个需要注意的点。
1.设置右边View的时候,这里把右边的view设置为控制器,巧妙的利用view的frame达到这种效果。但是一定记得在左边的控制器上添加子控制器(右边view所在的控制器),否则容易会使左边的view不能识别点击效果。分成连个控制器的好处就是避免了一个控制器中代码量过多,造成的混乱。
- (void)setupRightView
{
self.productVC = [[DLProductController alloc] init]; self.productVC.delegate = self;
// 当前控制器一定添加产品的子控制器(否则会出现点击的view混乱)
[self addChildViewController:self.productVC]; [self.view addSubview:self.productVC.view]; }
2.在右边的控制器中写这个方法时注意
scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:indexPath.row] atScrollPosition:UITableViewScrollPositionTop animated:YES
[NSIndexPath indexPathForRow:0 inSection:indexPath.row] 指的是哪一组的第几行(这里是第0行),indexPath是从DLCategoryController传递过来的,所以indexPath.row在本控制器中指的是哪一组
- (void)scrollToSelectedIndexPath:(NSIndexPath *)indexPath
{ // [NSIndexPath indexPathForRow:0 inSection:indexPath.row] 指的是哪一组的第几行(这里是第0行),indexPath是从DLCategoryController传递过来的,所以indexPath.row在本控制器中指的是哪一组
[self.tableView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow: inSection:indexPath.row] atScrollPosition:UITableViewScrollPositionTop animated:YES]; }
3.注意右边的view向上滑和向下滑的情况。分别调用不同的代理。
iOS 类似外卖 两个tableView联动的更多相关文章
- 实现外卖选餐时两级 tableView 联动效果
最近实现了下饿了么中选餐时两级tableView联动效果,先上效果图,大家感受一下: 下面说下具体实现步骤: 首先分解一下,实现这个需求主要是两点,一是点击左边tableView,同时滚动右边tabl ...
- iOS 类似美团外卖 app 两个 tableView 联动效果实现
写在前面 首先声明哈,不是广告,我就是用的时候觉得这个功能比较好玩,就想着实现了一下.效果如图: 接下来简单的说一下思路吧~ 大体思路 可能我们看到这种功能的实现的时候,首先想着的是我在这个控制器中左 ...
- ios 两个 TableView 之间的联动, TableView 与 CollectionView 之间的联动
两个 TableView 之间的联动, TableView 与 CollectionView 之间的联动 这是一个创建于 359 天前的主题,其中的信息可能已经有所发展或是发生改变. [联动] :两个 ...
- iOS 两个tableview的 瀑布流
iOS 两个tableview的 瀑布流1. [代码]Objective-C //// DocViewController.m// getrightbutton//// Created ...
- 两个TableView产生联动的一中方法
如何使用两个TableView产生联动:将两个tableView的滚动事件禁止掉,最外层scrollView滚动时将两个TableView跟着滚动,并且更改contentOffset,这样产生效果滚动 ...
- ios开发之级联菜单(两个tableView实现)
一:在ios项目实际开发中经常会看到级联菜单的效果:如图:点击左侧菜单,右侧菜单刷新数据.此篇用两个tableView来实现如图效果: 二:代码: 1:构造数据模型:利用kvc快速构建数据模型 #im ...
- iOS不得姐项目--推荐关注模块(一个控制器控制两个tableView),数据重复请求的问题,分页数据的加载,上拉下拉刷新(MJRefresh)
一.推荐关注模块(一个控制器控制两个tableView) -- 数据的显示 刚开始加载数据值得注意的有以下几点 导航控制器会自动调整scrollView的contentInset,最好是取消系统的设置 ...
- 【转】swift实现ios类似微信输入框跟随键盘弹出的效果
swift实现ios类似微信输入框跟随键盘弹出的效果 为什么要做这个效果 在聊天app,例如微信中,你会注意到一个效果,就是在你点击输入框时输入框会跟随键盘一起向上弹出,当你点击其他地方时,输入框又会 ...
- MVC编辑状态两个DropDownList联动
前几天使用jQuery在MVC应用程序中,实现了<jQuery实现两个DropDownList联动(MVC)>http://www.cnblogs.com/insus/p/3414480. ...
随机推荐
- SQL常用短语小记-持续更新
创建链接服务器语句 --//创建链接服务器[在本地服务器创建] exec sp_addlinkedserver '链接服务器名称','','SQLOLEDB','远程服务器地址' -- exec sp ...
- part8 vue内置标签keep-alive对网页性能优化
我们网页请求时候 我们点击路由切换 可以看network中数据请求 因为每次路由切换都会执行mounted钩子函数 我们这个函数中数据请求 //每次切换路由,页面都会重新渲染 在根组件中使用 路由切换 ...
- Python csv文件操作
一.open文件打开和with open as 文件打开的区别 file= open("test.txt","r") try: for line in file ...
- h5-任意元素居中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- request对象和response对象的作用和相关方法
response对象(响应) 响应行 状态码 :setStatus(int a) 设置状态码 302重定向 304控制缓存 响应头 setHeader() 一个key对应一个value addHead ...
- Unix网络编程学习 < 一 >
#include "unp.h" int main(int argc , char**argv) { int sockfd , n; //sockfd套接字描述符 ]; struc ...
- 当初对"软件工程"这个专业的期待和想象是什么?
很多期待,很多幻想 印象很深刻的初中语文老师让我们背诵的一首诗<错误>: <错误> 作 者:郑愁予 我打江南走过 那等在季节里的容颜如莲花的开落 东风不来,三月的柳絮不飞 你底 ...
- Linux 杀掉所有Java进程
ps -ef | grep java | grep -v grep | awk '{print $2}' | xargs kill -9 管道符"|"用来隔开两个命令,管道符左 ...
- sp__helptable, sp__help******* help 存储过程
from: https://sqldbaknowledgeshare.wordpress.com/2014/11/27/general-help-procedures/ GENERAL HELP P ...
- JavaScript 闭包究竟是什么JavaScript 闭包究竟是什么
用JavaScript一年多了,闭包总是让人二丈和尚摸不着头脑.陆陆续续接触了一些闭包的知识,也犯过几次因为不理解闭包导致的错误,一年多了资料也看了一些,但还是不是非常明白,最近偶然看了一下 jQue ...