系统UISearchBar效果图:

需求效果图:

两种方案:

  • 找到UISearchBar上的放大镜图标, 修改Frame. 同时判断在有无文本内容更改placeholder的颜色.
  • 利用UISearchBar的Text有值后, 放大镜自动靠左特性, 让UISearchBar设置一个默认的Text, 在点击UISearchBar开始编辑后, 如果没有值,设置Text为则@"", 同时还要根据状态修改placeholderLabel的颜色.(太繁琐, 不推荐!)

实现代码:

@interface ViewController () <UISearchBarDelegate>

/** xib搜索框 */
@property (weak, nonatomic) IBOutlet UISearchBar *searchBar;
/** 搜索图片(放大镜) */
@property (nonatomic, weak) UIImageView *imgV;
@end
@implementation ViewController - (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
// 查找放大镜图片ImageView
for (UIImageView *imgV in _searchBar.subviews.firstObject.subviews.lastObject.subviews) {
if ([imgV isMemberOfClass:[UIImageView class]]) {
imgV.frame = CGRectMake(, 7.5, , );
_imgV = imgV;
[_imgV addObserver:self forKeyPath:@"frame" options:NSKeyValueObservingOptionNew context:nil];
}
}
// 设置searchBar文本颜色
[self updateSeachBar];
}
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context
{
// 修改放大镜Frame前, 移除观察者
[_imgV removeObserver:self forKeyPath:@"frame"];
// 修改Frame
_imgV.frame = CGRectMake(, 7.5, , );
// 再次添加观察者
[_imgV addObserver:self forKeyPath:@"frame" options:NSKeyValueObservingOptionNew context:nil];
}
#pragma mark -UISearchBarDelegate代理方法
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar
{
if ([searchBar.text isEqualToString:searchBar.placeholder]) {
// 无文本时, 显示placeholder
searchBar.text = @"";
}
// 获取到UISearchBar中UITextField
UITextField *searchField = [searchBar valueForKey:@"_searchField"];
// 开始编辑要修改textColor颜色
searchField.textColor = [UIColor blackColor];
searchField.clearButtonMode = UITextFieldViewModeWhileEditing;
}
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar
{
[self updateSeachBar];
}
#pragma mark -根据文本内容设置searchBar颜色及clearButtonMode
- (void)updateSeachBar
{
if ([_searchBar.text isEqualToString:@""]) {// 文本内容为空时
UITextField *searchField = [_searchBar valueForKey:@"_searchField"];
// 修改textColor为placeholderColor
searchField.textColor = [searchField valueForKeyPath:@"_placeholderLabel.textColor"];
searchField.text = searchField.placeholder;
// 去除右侧clearButton
searchField.clearButtonMode = UITextFieldViewModeNever;
}
}
- (void)dealloc
{
// 移除观察者
[_searchBar removeObserver:self forKeyPath:@"frame"];
}

iOS之让UISearchBar搜索图标和placeholder靠左显示的更多相关文章

  1. ios UISearchBar搜索框的基本使用

    摘要: 小巧简洁的原生搜索框,漂亮而易用,如果我们的应用没有特殊需求,都可以使用它. iOS中UISearchBar(搜索框)使用总结 初始化:UISearchBar继承于UIView,我们可以像创建 ...

  2. iOS开发-搜索栏UISearchBar和UISearchController

    iOS中UISearchDisplayController用于搜索,搜索栏的重要性我们就不说了,狼厂就是靠搜索起家的,现在越来越像一匹没有节操的狼,UC浏览器搜索栏现在默认自家的神马搜索,现在不管是社 ...

  3. iOS开发之UISearchBar初探

    iOS开发之UISearchBar初探 UISearchBar也是iOS开发常用控件之一,点进去看看里面的属性barStyle.text.placeholder等等.但是这些属性显然不足矣满足我们的开 ...

  4. [转] iOS开发-搜索栏UISearchBar和UISearchController

    原文网址: http://www.cnblogs.com/xiaofeixiang/p/4273620.html?utm_source=tuicool iOS中UISearchDisplayContr ...

  5. iOS 如何自定义UISearchBar 中textField的高度

    iOS 如何自定义UISearchBar 中textField的高度 只需设置下边的方法就可以 [_searchBar setSearchFieldBackgroundImage:[UIImage i ...

  6. input中加入搜索图标

    刚吃了一份宫保鸡丁刀削面,幸福感满满,写篇博客消耗一下热量. 今天工作遇到的一个问题是在input输入框中加入图标,当输入内容后,图标和提示语一起隐藏,类似于placeholder的功能.如淘宝页面, ...

  7. MUI - H5实现ios长按图标后进入图标排序及删除功能的效果

    html5实现ios长按图标后进入图标排序及删除功能的效果 我们知道在ios(国产定制安卓系统基本都有)设备上按下图标,图标就会不停的抖动,并且可以随心拖动排序和删除. 那么问题来了,我们怎么通过ht ...

  8. ico图标在谷歌浏览器中如何显示?

    http://www.zen-cart.cn/forum/topic266117.html 版主: shaning 发表回复 2 篇帖子 • 分页: 1 / 1  ico图标在谷歌浏览器中如何显示? ...

  9. 关键字搜索:jQuery过滤器插件fastLiveFilter||显示结果条数

    引用js库 <script src="jquery-1.6.4.min.js"></script> <script src="jquery. ...

随机推荐

  1. 推荐一个 JavaScript 日期处理类库 Moment.js

    官网: http://momentjs.com/ 处理时间的展示,很方便. 安装 bower install moment --save # bower npm install moment --sa ...

  2. android控件TextView之 分段显示不同颜色

    代码如下: attrs.xml文件: 第二种方式: String newMessageInfo = "<font color='red'><b>" + 红色 ...

  3. JS JSON序列化 Ajax form表单

    # JS序列化 a = {"k1":"v1"} #序列化为字符串 类似python json.dumps(a) b = JSON.stringify(a) &q ...

  4. Oracle存储过程_语法

    create or replace procedure procedure_name --存储过程名字 ( --进行输入/输出的量 量_name in out 量_类型 --e.g. username ...

  5. node-sass 解决 no such file or directory

    在使用node-sass编译的时候出现以下情况 Error: ENOENT: no such file or directory, scandir 'D:\xxxx\node_modules\.npm ...

  6. [控件] 创建出条形间隔效果的背景LineBackgroundView

    创建出条形间隔效果的背景LineBackgroundView 效果: 使用: // // ViewController.m // LineBackgroundView // // Created by ...

  7. MongoDB的Spring-data-mongodb集成(Win10 x64) 第一章 - MongoDB安装与简单命令

    这是MongoDB系列的第一章,作者将持续更新. 1.下载 https://www.mongodb.com/download-center#community 2.安装与配置 有关安装的任何困难请点击 ...

  8. C++使用初始化列表提高效率(转):

    转自:http://www.cnblogs.com/graphics/archive/2010/07/04/1770900.html 何谓初始化列表 与其他函数不同,构造函数除了有名字,参数列表和函数 ...

  9. 字典 & 列表表达式 结合

    题: 思路: 要求的结果是小字典里面的两个值组成的列表,所以只要抓到小字典,这个题就可以用列表推导式直接表达了.所 以把小字典设为元素d,然后用d在列表里面遍历,列表呢,是大字典的一个值. 答案:  

  10. SQL Server错误处理

    一.SQLServer数据库引擎错误 1.查询系统错误信息 SQLServer在每个数据库的系统视图sys.messages中存储系统自定义(Message_id <= 50000)和用户自定义 ...