如何给tableView添加一个悬浮的按钮? 恐怕没有想象的那么简单!
最近在公司做项目时,产品经理有一个需求就是在一个 tableView上 加一个悬浮的按钮,
尝试了很多方案之后我终于找到了一个通用的可行的方案!
最终效果图:
滑动tableView之后的效果是:
可以 看到,我们实现了 悬浮的效果,随着tableView的滑动,悬浮按钮并没有随之儿而滚动! 受到这个启发,我们应该可以在 tableView上面,可以根据实际情况添加一个 悬浮的 置顶按钮,提高用户体验! 首先说一下方案的选取可行性: 1.Storyboard 中拖拽的 TableViewController, 使用 self.view添加悬浮按钮,结果是 :按钮随着tableView滚动!不是我们想要的结果! 解释:TableViewController 的视图层次如下红色方框内,可以看到 并没有 view(可能是系统的处理让view置于很下层):
但是 上图有一个问题:tableView的上面会有一个空白?如何解决?将在后续的文章中详细介绍:
http://blog.csdn.net/yangbingbinga
这导致我们在使用tableView添加了一个 悬浮按钮时,会随着 tableView的滚动而滚动!
2.storyboard +ViewController +tableView +any(sizeClass= any) 解释:也就是在 ViewController的view上贴一个tableView,然后在view上贴上悬浮按钮并且把该按钮放入到最上层!(bringSubviewToFront) 视图结构如下:
并且把 sizeClass设置为 any模式:
代码实现如下:
ViewController绑定的是ViewController类:
代码如下:
添加了两个悬浮按钮:
// // ViewController.m // StoneButton // // Created by http://blog.csdn.net/yangbingbinga on 14/12/26. // Copyright (c) 2014年 http://blog.csdn.net/yangbingbinga. All rights reserved. // #import "ViewController.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; UIScreen *s=[UIScreen mainScreen]; CGFloat width=s.bounds.size.width; CGFloat height=s.bounds.size.height; CGRect frame=CGRectMake(15, height-62, width-30, 50); UIButton *button=[UIButton buttonWithType:UIButtonTypeCustom]; [button setTitle:@"悬浮按钮" forState:UIControlStateNormal]; [button setBackgroundColor:[UIColor redColor]]; [button setFrame:frame]; button.layer.cornerRadius=5;//设置圆角 button.clipsToBounds=YES; [self.view addSubview:button]; [self.view bringSubviewToFront:button];//关键语句,让 button显示在最前! CGRect frame2=CGRectMake(15, 400, 50, 150); UIButton *button2=[UIButton buttonWithType:UIButtonTypeCustom]; [button2 setTitle:@"悬浮按钮2" forState:UIControlStateNormal]; [button2 setBackgroundColor:[UIColor grayColor]]; [button2 setFrame:frame2]; button2.layer.cornerRadius=5; button2.clipsToBounds=YES; [self.view addSubview:button2]; [self.view bringSubviewToFront:button2]; } #pragma mark - Table view data source - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { return 1; } - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return 20;//模拟20条数据 } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { long row=indexPath.row%3; UITableViewCell *cell;//见图,一共有a,b,c3种cell NSString *idf; if (row==0) { [email protected]"a"; } else if(row==1) { [email protected]"b"; } else { [email protected]"c"; } cell = [tableView dequeueReusableCellWithIdentifier:idf forIndexPath:indexPath]; return cell; } @end
代码下载地址:http://share.weiyun.com/4c2aa46cc9f787470125761c53c6a011
更多原文地址:http://blog.csdn.net/yangbingbinga
时间: 2024-10-19 17:04:21