iOS: 悬浮的条件筛选下拉框的使用

简介:

1、介绍

app中条件筛选视图是很常用的功能,一般它搭配着tableView的表头悬浮滚动使用,点击按钮时,就会弹出下拉框显示条件,选择一个条件后,下拉框自动隐藏。

 

2、效果图如下

从中间点击弹出,然后滚动tableView随着移动,到顶部就悬浮着,下拉时仍然跟着滚动,一直滚动初始位置就停止。。。

 

 

3、实现方式

 首先:采用分组的tableView,不过类型必须选择为Plain,这种类型本身就带悬浮效果。如果用Group类型,就没有悬浮效果;

//设置tableView风格
-(instancetype)initWithStyle:(UITableViewStyle)style{
    return [super initWithStyle:UITableViewStylePlain];
}

 其次:计算组头到导航栏下边的距离。我将tableView分2组,第一组section表头高为260px,行高0.01,第二组section表头高为39px,则它距离导航栏顶部260px。

 然后:给下拉框一个默认的frame,y= 260px + 39px = 299px, height=0。然后通过[UIView animation...]动画修改frame的值即可。 

 DDHomeConditionView是添加过tableView的view

 //条件视图(需要设置299为默认的y值)
 _conditionView = [[DDHomeConditionView alloc]initWithFrame:CGRectMake(0, 299, SCREEN_WIDTH, 0)];
 _conditionView.hidden = YES;
复制代码
-(void)buttonCilicked:(UIButton *)sender{
    
    if (sender.selected) {
        [self showConditionView:sender];  //点击显示
    }else{
        [self hideConditionView];  //再次点击隐藏
    }
}
复制代码
复制代码
//显示条件视图
-(void)showConditionView:(UIButton *)sender{
    
    //将所有选中的按钮保存起来
    if (![self.buttonGroup containsObject:sender]) {
        [self.buttonGroup addObject:sender];
    }
    //显示条件视图
    [UIView animateWithDuration:0.2 animations:^{
        
        if (self.tableView.contentOffset.y > 260) { //tableView往上滚动距离大于260,y值为tableView的y偏移值+高
            
            _conditionView.frame = CGRectMake(0, self.tableView.contentOffset.y + 39, SCREEN_WIDTH , 160);
        }else{
            _conditionView.frame = CGRectMake(0, 299, SCREEN_WIDTH , 160);  //固定尺寸
        }
        _conditionView.hidden = NO;
    }];
}

//隐藏条件视图
-(void)hideConditionView{
    
    //隐藏条件视图
    [UIView animateWithDuration:0.2 animations:^{
        
        _conditionView.frame = CGRectMake(0, 260, SCREEN_WIDTH , 0);
        _conditionView.hidden = YES;
        
    } completion:^(BOOL finished) {
        
        //将所有选中的按钮设置为未选中状态
        for (UIButton *btn in self.buttonGroup) {
            [btn setSelected:NO];
        }
        
        //清除数组全部按钮
        [self.buttonGroup removeAllObjects];
    }];
} 
复制代码

最后:监听tableView的滚动,其实就是ScrollView的滚动距离值scrollView.contentOffset.y,判断它是否大于上面计算的260px;

    如果大于,下拉框的y值等于scrollView.contentOffset.y + 39px,否则下拉框的y值就固定等于260px + 39px = 299px。

复制代码
#pragma mark - UIScrollViewDelegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    
    if (scrollView.contentOffset.y > 260) { //tableView往上滚动距离大于260,y值为tableView的y偏移值+高
        _conditionView.frame = CGRectMake(0, scrollView.contentOffset.y + 39, SCREEN_WIDTH , 160);
    }else{
        _conditionView.frame = CGRectMake(0, 299, SCREEN_WIDTH , 160);  //固定尺寸
    }
}
复制代码

本人原创,欢迎分享

 

程序猿神奇的手,每时每刻,这双手都在改变着世界的交互方式!
本文转自当天真遇到现实博客园博客,原文链接:http://www.cnblogs.com/XYQ-208910/p/6081184.html ,如需转载请自行联系原作者
相关文章
|
安全 iOS开发
iOS 筛选视图的隐藏方案
iOS 筛选视图的隐藏方案
246 0
iOS 筛选视图的隐藏方案
|
API 开发工具 iOS开发
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
286 0
iOS视图置顶的应用:适配iOS12系统上日期控件被筛选视图遮挡问题
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上,安卓和iOS两大阵营各据一方。随着技术的演进,跨平台开发框架成为开发者的新宠,旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战,并分享实用的开发技巧,帮助开发者在安卓和iOS的世界中游刃有余。
|
iOS开发 开发者
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
810 67
uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
|
JavaScript 搜索推荐 Android开发
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
477 8
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
|
iOS开发 开发者 MacOS
深入探索iOS开发中的SwiftUI框架
【10月更文挑战第21天】 本文将带领读者深入了解Apple最新推出的SwiftUI框架,这一革命性的用户界面构建工具为iOS开发者提供了一种声明式、高效且直观的方式来创建复杂的用户界面。通过分析SwiftUI的核心概念、主要特性以及在实际项目中的应用示例,我们将展示如何利用SwiftUI简化UI代码,提高开发效率,并保持应用程序的高性能和响应性。无论你是iOS开发的新手还是有经验的开发者,本文都将为你提供宝贵的见解和实用的指导。
408 66
|
存储 监控 API
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
1531 11
|
12月前
|
人工智能 程序员 API
iOS|记一名 iOS 开发新手的前两次 App 审核经历
啥,这玩意也有新手保护期?
393 0
|
开发框架 Android开发 iOS开发
安卓与iOS开发中的跨平台策略:一次编码,多平台部署
在移动应用开发的广阔天地中,安卓和iOS两大阵营各占一方。随着技术的发展,跨平台开发框架应运而生,它们承诺着“一次编码,到处运行”的便捷。本文将深入探讨跨平台开发的现状、挑战以及未来趋势,同时通过代码示例揭示跨平台工具的实际运用。
407 3