首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

UISearchController中的取消按钮导致SearchBar毛刺

UISearchController是iOS开发中的一个类,用于实现搜索功能。它包含一个搜索栏(SearchBar)和一个搜索结果视图控制器(SearchResultsController)。取消按钮是SearchBar中的一个按钮,用于取消搜索操作。

当点击取消按钮时,有时会出现SearchBar毛刺的问题。这个问题通常是由于取消按钮的点击事件与搜索栏的动画效果冲突导致的。为了解决这个问题,可以尝试以下方法:

  1. 禁用搜索栏的动画效果:可以通过设置UISearchController的hidesNavigationBarDuringPresentation属性为false来禁用搜索栏的动画效果。这样取消按钮的点击事件就不会与搜索栏的动画冲突了。
  2. 自定义取消按钮:可以通过自定义取消按钮的样式和点击事件来解决毛刺问题。可以使用UIBarButtonItem来创建一个自定义的取消按钮,并设置给UISearchController的searchBar属性的rightBarButtonItem。
  3. 使用其他搜索框组件:如果以上方法无法解决问题,可以考虑使用其他的搜索框组件来替代UISearchController。例如,可以使用UITextField和UITableView结合实现搜索功能,这样可以更加灵活地控制搜索框和取消按钮的行为。

总结一下,UISearchController中的取消按钮导致SearchBar毛刺问题可以通过禁用搜索栏的动画效果、自定义取消按钮或者使用其他搜索框组件来解决。具体的实现方法可以根据具体的需求和场景进行选择。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

iOS - Swift UISearchController取消按钮

UISearchController取消按钮 关于UISearchController设置就不多说了,可以参考《UISearchController�仿微信搜索框》或者自行上网查找。...情况 本人想实现微信通讯录上方搜索框功能,但在搜索框取消按钮设置这个卡住,在网上搜了个遍,没有�合适做法,经过不懈探索,终于找到解决方案,遂前来记录一下。...方案 添加两个属性 // 记录是否已经找到取消按钮 lazy var hasFindCancelBtn: Bool = { return false }() // 定时器(用来定时查找取消按钮)...link: CADisplayLink = { CADisplayLink(target: self, selector: #selector(findCancel)) }() 提供查找并设置取消按钮方法...= self func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) { if !

84620

iOS - Swift UISearchController仿微信搜索框

创建一个UISearchController 如果传入searchResultsController为nil,则表示搜索结果在当前控制器显示,现在我让它在searchResultVC显示 //...添加searchBar 设置搜索框 // 搜索框 let bar = searchController.searchBar // 样式 bar.barStyle = .default // 设置光标及取消按钮颜色...设置光标及取消按钮颜色 去除背景 // 去除背景及上下两条横线 bar.setBackgroundImage(UIImage(), for: .any, barMetrics: .default) ?..."VoiceSearchStartBtn"), for: .bookmark, state: .normal) 监听语音按钮点击 // MARK:- UISearchBarDelegate extension...主要代码 上面仅作演示,下面的代码为searchBar主要设置 let commonBgColor = RGBA(r: 0.94, g: 0.94, b: 0.96, a: 1.00) searchBar.barTintColor

1.9K30

自定义UISearchController外观

UISearchController我们无需再自己初始化UISearchBar,只需要提供searchResult展示视图。...然而在开发,我们往往需要根据项目的风格来改变UISearchBar外观,通过继承方式,我们可以完全定制符合项目风格外观,然而有些情况下我们很难短时间内完成全部外观定制工作,譬如我们项目用好几个旧框架...,代码充斥着各种写好UISearchBar展示,而改动底层框架并不是一个较好地实践。...cancelButton时,一定要确保cancelButton包含在了UISearchBar,必要时可以提前调用: [_searchController.searchBar setShowsCancelButton...searchFieldsetFont:[UIFontsystemFontOfSize:14]]; [searchFieldsetBackgroundColor:[UIColorwhiteColor]]; 改变取消按钮

1.6K20

iOS 问题总结(五)

使用 cocoapods 时,编译报错 在 Building Setting Other Linker Flags 检查是不是为空了,如果是那么添加一句 $(inherited),再重新编译就不会报错了...3.使用 UISearchController 遇到问题: 我自定义了一个 HeaderView,如下图: ?...-64 高度,导致不能在屏幕上显示,如下图: ?...,苹果开发中心demo对这行代码,注释如下 // know where you want UISearchController to be displayed 如果不添加上面这行代码,在设置 hidesNavigationBarDuringPresentation...这个属性为YES时候,搜索框进入编辑模式会导致,搜索栏不可见,偏移 -64 ;在设置为 NO 时候,进入编辑模式输入内容会导致高度为 64 白条,猜测是导航栏没有渲染出来。

1.5K10

iOS开发-搜索栏UISearchBar和UISearchController

最近项目中用到了搜索栏,所以在网上搜了一些相关资料学习了一下,现在记录一下,iOS搜索栏实现起来相对简单一点,网上也有很多参考资料,不过靠谱不是很多,很多都是iOS 8.0之前实现,iOS...8.0上实现貌似很少看到,看了一些其他人代码,使用了一下UISearchController感觉还是非常不错。...2 UISearchController实现搜索 UISeachBar通过UISearchDisplayDelegate实现上面的效果是没有问题,网上也有很多类似的实现效果,不过是警告...实现 UISearchResultsUpdating 这个委托实现上面的效果; 视图中需要声明UISearchResultsUpdating: @interface ViewController...; 之前是通过判断搜索时候TableView,不过现在直接使用self.searchController.active进行判断即可,也就是UISearchControlleractive属性:

2.3K70

手把手带你撸一个网易云音乐首页(三)

,唯一有意思之处在于“每日歌曲推荐”这个按钮上中间文字是会随着日期改变,如图: image 不过实现起来也简单,中间放一个 Label 即可。...2,防止滑动速率过大,导致翻页过多 pageFactor = pageFactor < 1 ?...在网易云音乐首页最顶层有一个视图,视图包含内容有三部分:左按钮,搜索框,右按钮,这种结构很容易让我们联想到 UINavigationItem。...不过,由于搜索栏需要自定义一些样式,我们可以先定义一个 UISearchController 成员变量,将它属性初始化好以后,再进行赋值,代码如下: self.searchController...for searchController: UISearchController) { let searchBar = searchController.searchBar

2.2K10

iOS开发知识点

设置navBar背景,去掉黑线,试了好长时间,查了好多,这个对我适用 设置navBar上item颜色,以及nav Title颜色和字体大小 替换系统返回按钮图片,设计说自带太丑,一开始是自定义返回...setShadowImage:[[UIImage alloc] init]]; [[UINavigationBar appearance] setTranslucent:NO]; // 设置navBar按钮...= self; // 侧滑返回,自定义返回按钮后生效,在最顶部设置可以在Push出来界面都有效 #pragma mark - gestureRecognizer delegate - // 侧滑返回...自带取消按钮是cancel,英文,但是产品强迫要中文,所以就只能改啊 // searchBar开始编辑时改变取消按钮文字 - (void)searchBarTextDidBeginEditing...:(UISearchBar *)searchBar { _searchBarView.searchBar.showsCancelButton = YES; NSArray *subViews

15550

实践-小细节Ⅵ

关于UISearchBar 设置以及取消按钮颜色和文字设置 效果图 UISearchBar *searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake..."]; 修改UISearchBar placeholder字体颜色和大小 有两种方法,不过要注意是要写在最后面,之前就是因为写在最前面被覆盖导致无效果。...实现description方法 打印出Model属性 1504837291574293.jpg 我们发现在我自己创建,没有实现description 和debugDescription 我们会发现...8.生成一个可以供安卓/苹果手机扫描下载安装APP二维码 芝麻二维码 输入iOS应用itunes下载路径 输入安卓应用下载路径,可以是百度安卓市场地址、腾讯应用宝地址、还可以是自己服务器上下载地址...9.如何找到一个APPitunes下载链接 我们可以通过 Mac上 itunes 来获取 还可以通过浏览器来获取 在浏览器 输入 : xxxx on appstore 即可,红色框就是手机里面的下载链接

93020

京喜前端自动化测试之路(小程序篇)

容灾演习是一项长期持续工作,且涉及页面功能及场景多,人工切换场景模拟异常导致演习效率较低,因此想通过开发自动化测试工具来提升演习效率,让容灾演习工作随时可以轻松开展。...开发实录— 快速创建测试用例 为了提高测试脚本可维护性、扩展性,我们将测试用例信息都配置到 JSON 文件,这样编写测试脚本时候,我们只需关注测试流程实现。...比如,当我们想点击页面搜索框时,我们一般会这么做: const page = await miniProgram.currentPage() const $searchBar = await page...$('search-bar') await $searchBar.tap() 但这样真的可行吗?答案是: 试试就知道了。 运行这段测试脚本后生成截图: ?...$searchBar.size() 运行这段测试脚本后生成截图: ?

1.5K40

一步一步学Vue(四)

上篇给出了代码框架,没有具体实现,这一篇会对上篇定义几个组件进行分别介绍和完善: 1、TodoContainer组件   TodoContainer组件,用来组织其它组件,这是react推荐方式...,也是redux中高阶组件一般就是用来包装成容器组件用,比如reduxconnect函数,返回包装组件就是一个容器组件,它用来处理这样一种场景:加入有A、B两个组件,A组件需要通过Ajax请求和后端进行交互...2、SearchBar组件   SearchBar组件比较简单,只是简单触发查询按钮,发射(触发)onsearch事件,然后TodoContainer组件中使用 @onsearch="search($event...我们把传入初始化参数给了我们todo对象,这样导致直接问题是:新增时候没问题,但是编辑时候无法绑定数据,原因是,编辑操作实际上就是修改外部传入initItem对象,但是todo只在组件初始化时候被赋值...(更逼格高一些,叫状态),所以在todoitem组件触发事件没办法直接到TodoContainer组件,只能通过一级一级往上传递,所以在todolist也有和todoitem类似的触发事件代码

1.2K10

Vue3 如何实现一个全局搜索框

请打开你 index.html 看一下,你是否忘记了我们 App.vue 是挂在这个真实,id为 app 元素内)那其实我们操作思路就是非常简单,当我按下全局搜索按钮,那么你就在 <div...让我们在 App.vue 组件内随便写一个按钮,然后调用 SearchBarCreator 实例身上 present 方法。...效果如下:图片上传处理...到这里 searchBar 已经可以呈现在页面上了,但是我们还不知道怎样让它消失,其实也非常简单,我们只需要在合适时机移除这个 dom 元素即可。...在这里我们需要知道一点,我们需要将 searchBar 提升到当前文件全局,不能仅只在 open中去 new 了。ok,我们测试一下图片上传处理...四....自动聚焦在弹出框 input 框实现自动聚焦相比于之前讲就非常简单了,我在这里一笔带过了。只需要在 nextTick 调用 input 本身 focus 方法即可。

1.2K30

一步一步学习Vue(十一)

,store是全局唯一,我们在上一篇文章也介绍了其基本创建方式,修改todolist.js,添加如下代码: var store=new Vuex.Store({ state:{...$store,那么我们就不用对事件一层一层传递啦,我们只需要在需要调用地方,commit对应mutation即可,比如search操作就是在searchbar组件,那么我们没必要传递到父组件来触发...小结,在store定义状态,是响应式,对其中状态改变会导致view重新渲染,改变状态只能通过提交mutation。...由于其状态响应式,所以我们在访问时一般定义成计算属性,如TodoContainer组件initItem和items;一般来说,不是所有状态都要定义到vuexstore,每个组件都会有自己私有状态...,只有全局或者共享状态才适合定义在store,所以在实际开发,需要好好斟酌;本篇就到此为止,其实算是上篇一个延伸,下一篇介绍Actions,会继续在本篇demo基础上进行延伸,敬请期待。

68820
领券