自定义搜索框SearchBar

这个自定义的控件,在好多地方可以用的到:

• 所以需要我们创建一个自定义的控件类:需要的添加搜索框的时候,直接调用自定义控件的类就可以了

• 创建搜索框,自定义一个textField

• 知识点:查找某个控件中所需要的属性的技巧,在控件的头文件中查找想要的属性的类

---

将代码封装到一个类的几种方法:

• 1.创建一个分类:UITextField\UISearchBar

• 2.自定义控件:新建一个类,继承自UITextField

• 3.搞个工具类,工具类是轻量级的,所以不会优先考虑工具类

---

• 自定义控件:

首先在.h文件中是创建一个接口

@interface ZJSearchBar : UITextField

/** 封装一个自定义的searchBar */
+ (instancetype)search;

@end

然后在.m文件中创建一个自定义SearchBar

#import "ZJSearchBar.h"

@implementation ZJSearchBar

-(instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        /**
         *  查找某个控件中的所需要的属性的技巧, 跳入到控件的头文件, 将所需要的属性的类进行搜索, 不行的话, 一步一步查
         */
        
        // 设置UITextField中占位文字
        self.placeholder = @"请输入搜索内容";
        
        // 设置UITextField中文字大小
        self.font = [UIFont systemFontOfSize:15];
        
        // 添加UITextField的背景图片    // 这里可以设置小伙伴们需要的UITextField背景图片
        self.background = [UIImage imageNamed:@"searchbar_textfield_background"];
        
        // 创建放大镜图片   //这里可以设置小伙伴们的自定义放大镜图片哦
        UIImageView *imageView = [[UIImageView alloc] init];
        imageView.image = [UIImage imageNamed:@"searchbar_textfield_search_icon"];
        
        // 设置放大镜图片框的大小
        imageView.width = 30;
        imageView.height = 30;
        
        // 让图片的大小按图片框的中心位置进行放置
        imageView.contentMode = UIViewContentModeCenter;
        
        // 将imageView添加到UITextField的leftView中
        self.leftView = imageView;
        self.leftViewMode = UITextFieldViewModeAlways;
         
    }
    return self;
}

/** 如果调用了这个方法, 会自动调用initFrame, 在initFrame方法中创建控件 */
+ (instancetype)search {

    return [[self alloc] init];
}

@end

---

接下来是调用的时候了

在想要用到的地方导入头文件

#import "ZJSearchBar.h"

然后只需要4局代码就可以搞定一个自定义SearchBar

    ZJSearchBar *searchBar = [ZJSearchBar search];
    
    // 设置自定义搜索框的大小
    searchBar.width = 300;
    searchBar.height = 30;
    
    // 将创建好的搜索框, 添加到navigationItem的TitleVie中
    self.navigationItem.titleView = searchBar;

这就是自定义SearchBar的过程, 欢迎随时小伙伴们提出修改方法