iOS开发实战——CollectionView点击事件与键盘隐藏结合案例(二)
来源:互联网 发布:java金融系统开发实例 编辑:程序博客网 时间:2024/05/18 01:28
我在前一篇博客中《iOS开发实战——CollectionView点击事件与键盘隐藏结合案例》详细实现了CollectionView与键盘组合操作中出现的多种情况,并解决了交互体验上的一些问题。在实际项目中也的确可以采用这种方法来操作。但是问题来了,原来的界面我们是使用UIView来操作的,也就是界面是不可滚动的。然而更为常见的场景是一个ScrollView,界面可以进行上下滚动。所以,这篇博客主要是对前一个案例进行优化。还有一个问题是,在自动布局Masonry结合ScrollView中,会碰到一些坑和技巧,也是我们主要解决的问题。项目代码上传至 https://github.com/chenyufeng1991/ShowHiddenKeyboard 。
今天要实现的效果如下:
。
由于大部分功能和之前的类似,我把重点放在ScrollView和Masonry的结合上。
(1)UI布局的思路是:最外面是一个ScrollView,然后里面放一个取名为contentView的UIView,作为放置其他元素的容器。contentView的高度会随着内部元素的总高度的变化而变化,也就是ScrollView需要滚动的总高度。
// 最外部的scrollView self.scrollView = [[UIScrollView alloc] init]; self.scrollView.backgroundColor = [UIColor orangeColor]; self.scrollView.scrollEnabled = YES; self.scrollView.userInteractionEnabled = YES; self.scrollView.bounces = NO; self.scrollView.delegate = self; self.automaticallyAdjustsScrollViewInsets = NO; [self.view addSubview:self.scrollView]; [self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) { make.top.equalTo(weakSelf.view).offset(64); make.left.equalTo(weakSelf.view); make.right.equalTo(weakSelf.view); make.bottom.equalTo(weakSelf.view); }]; // 包含所有子View的容器 self.contentView = [[UIView alloc] initWithFrame:CGRectMake(0, 64, [[UIScreen mainScreen] bounds].size.width, 200)]; self.contentView.backgroundColor = [UIColor redColor]; [self.scrollView addSubview:self.contentView]; [self.contentView mas_makeConstraints:^(MASConstraintMaker *make) { make.edges.equalTo(weakSelf.scrollView); make.width.equalTo(weakSelf.scrollView); }];
这里设定ScrollView铺满全屏。而里面的contentView也是铺满整个ScrollView,并且一定要显式的设置宽度等于scrollView的宽度,也就是水平不可滑动。
在设置scrollView时建议加上self.automaticallyAdjustsScrollViewInsets = NO。这个参数比较坑爹,默认是YES,也就是默认在你使用scrollView的时候给你加了内边距,而这个往往是我们不需要的。如果默认置为YES的话,发现UI怎么都调不出我们想要的效果,往往会在顶部一部分。【ps:其实在这里你也可以考虑到是导航栏的原因,看你个人需求是ScrollView是否要到达屏幕顶部还是只到达导航栏底部。】
(2)由于我要让界面有滑动的效果,所以要让ScrollView里面的contentSize大于height,所以我在下面铺了一张很长的图片来模拟。
self.bottomImageView = [[UIImageView alloc] init]; self.bottomImageView.image = [UIImage imageNamed:@"bottom"]; [self.contentView addSubview:self.bottomImageView]; [self.bottomImageView mas_makeConstraints:^(MASConstraintMaker *make) { make.top.equalTo(weakSelf.collectionView.mas_bottom).offset(20); make.left.equalTo(weakSelf.contentView); make.right.equalTo(weakSelf.contentView); make.height.equalTo(@500); }];
(3)其实自动布局写到这里的时候,所有的设置都已经完成了。但是一运行代码,发现并不是这样的。ScrollView根本就不能滚动。原来想的是:contentView由于add了很多的元素,所以contentView的高度就应该是这些元素实际布局中的总和。Masonry理应有这种自动计算的功能,但事实却不是这样的。调试上面的代码会发现contentView的高度居然是0. 查看约束设置代码,我们的确没有显式的设置高度。很遗憾,Masonry没有自动完成这个功能。所以需要在上面的子元素约束完成以后,实现如下代码:
// 这里要重新设置容器的高度,其实只要固定底部即可。 [self.contentView mas_updateConstraints:^(MASConstraintMaker *make) { make.bottom.equalTo(self.bottomImageView); }];更新contentView容器的约束。也就是添加了底部约束到那张长长的图片的底部,这样也就相当于设置了高度。这样ScrollView就能正常滚动了。
(4)对于CollectionView的处理同前一个案例一样,这里不再赘述。由于添加了ScrollView,所以原先touchesEnded方法就不会被调用了,因为手势操作首先会去触发ScrollView中的操作。所以我们就要来实现ScrollViewDelegate中的方法来实现键盘隐藏。
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{ [self hideKeyboard];}
当ScrollView开始滚动的时候隐藏键盘。由于此时的背景空白区域是contentView,所以添加一个tap手势:
UITapGestureRecognizer *tapView = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(hideKeyboard)]; [self.contentView addGestureRecognizer:tapView];
- iOS开发实战——CollectionView点击事件与键盘隐藏结合案例(二)
- iOS开发实战——CollectionView点击事件与键盘隐藏结合案例
- IOS开发——键盘显示/隐藏事件监控
- iOS开发记录——点击输入框上移屏幕,点击空白处隐藏键盘
- iOS 开发 点击tableview 键盘隐藏
- ios开发 点击空白处隐藏键盘
- ios开发——点击空白处隐藏键盘的几种方法
- iOS高级开发——CollectionView的cell中按钮的点击实现
- iOS高级开发——CollectionView的cell中按钮的点击实现
- iOS开发实战——CollectionView中cell的间距设置
- IOS点击return隐藏键盘
- [IOS开发]点击屏幕任何位置隐藏键盘
- ListView简单使用《二》—>CollectionView效果实现案例
- iOS项目开发实战——监听对话框的按钮点击事件
- iOS高级开发——CollectionView的cell长按事件实现
- iOS高级开发——CollectionView的cell长按事件实现
- 【iOS开发】隐藏键盘
- iOS开发隐藏键盘
- c++第七次作业
- 阿里面经
- 看重影了?Ruby 中是如何共享字符串的
- C++作业5
- I/O端口和I/O内存
- iOS开发实战——CollectionView点击事件与键盘隐藏结合案例(二)
- Spring之IOC与DI的不同
- poj1742翻译
- 读书笔记_科学计算与企业级应用的并行优化
- 190_ViewPager动画
- Retrofit 泛型解析遇到com.google.gson.internal.LinkedTreeMap cannot be cast to object
- 李敖语录
- android中的像素单位dp、px、pt、sp
- 算法设计 -- 初步感想