iOS搜索功能 详细教程
iOS搜索功能 详细教程
iOS实现搜索功能的类:
iOS 8.0-:UISearchBar + UISearchDisplayController(用于展示结果)
- 但是,iOS8.0弃用了UISearchDisplayController。
iOS 8.0+:UISearchController
- 使用UISearchController来非常方便的添加搜索框,UISearchController带有SearchBar属性,无需单独创建。
区别:
UISearchDisplayController自带展示结果的TableView, 使用UISearchDisplayController的时候,搜索结果的展示tableView系统已经帮我们封装好;
但是,使用UISearchController,我们需要提供一个搜索结果的展示TableView.
Api
iOS8.0弃用了的UISearchDisplayController,就不介绍了。
主要介绍:
@interface UISearchController : UIViewController <UIViewControllerTransitioningDelegate, UIViewControllerAnimatedTransitioning>
@protocol UISearchControllerDelegate <NSObject> //监控SearchController
@protocol UISearchResultsUpdating <NSObject> //响应输入的搜索文本内容
@interface UISearchBar : UIView <UIBarPositioning, UITextInputTraits>
@protocol UISearchBarDelegate <UIBarPositioningDelegate>
//监控SearchBar上的行为:输入&各个按钮点击
UISearchBar
先熟悉SearchBar的结构,它是一个UIView。所有api都围绕着SearchBar上的控件进行定制:
SearchBar结构@interface UISearchBar : UIView <UIBarPositioning, UITextInputTraits>
//创建
- (instancetype)init;
- (instancetype)initWithFrame:(CGRect)frame;
- (nullable instancetype)initWithCoder:(NSCoder *)aDecoder;
//设置
//文字内容
@property(nullable,nonatomic,copy) NSString *text; // current/starting search text
@property(nullable,nonatomic,copy) NSString *prompt; // default is nil
@property(nullable,nonatomic,copy) NSString *placeholder; // default is nil
//样式设置
@property(nonatomic) UIBarStyle barStyle; // default is UIBarStyleDefault (blue)
@property (nonatomic) UISearchBarStyle searchBarStyle; //searchBarStyle样式
typedef enum UISearchBarStyle : NSUInteger {
UISearchBarStyleDefault,
UISearchBarStyleProminent,
UISearchBarStyleMinimal
} UISearchBarStyle;
@property(null_resettable, nonatomic,strong) UIColor *tintColor;
@property(nullable, nonatomic,strong) UIColor *barTintColor; // default is nil
@property(nonatomic,assign,getter=isTranslucent) BOOL translucent; //设置是否半透明
- (void)setBackgroundImage:(nullable UIImage *)backgroundImage forBarPosition:(UIBarPosition)barPosition barMetrics:(UIBarMetrics)barMetrics;
- (nullable UIImage *)backgroundImageForBarPosition:(UIBarPosition)barPosition barMetrics:(UIBarMetrics)barMetrics;
@property(nullable, nonatomic,strong) UIImage *backgroundImage;
- (void)setSearchFieldBackgroundImage:(nullable UIImage *)backgroundImage forState:(UIControlState)state;
- (nullable UIImage *)searchFieldBackgroundImageForState:(UIControlState)state;
@property(nonatomic) UIOffset searchFieldBackgroundPositionAdjustment;
@property(nonatomic) UIOffset searchTextPositionAdjustment;
//UISearchBarIcon(searchBar上的几个按钮)
typedef enum UISearchBarIcon : NSInteger {
UISearchBarIconSearch,
UISearchBarIconClear,
UISearchBarIconBookmark,
UISearchBarIconResultsList
} UISearchBarIcon;
//各个按钮的图标
- (void)setImage:(nullable UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state;
//各个按钮的位置
- (nullable UIImage *)imageForSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state;
// 按钮的位置
- (void)setPositionAdjustment:(UIOffset)adjustment forSearchBarIcon:(UISearchBarIcon)icon;
- (UIOffset)positionAdjustmentForSearchBarIcon:(UISearchBarIcon)icon;
//Custom显示
@property (nullable, nonatomic, readwrite, strong) UIView *inputAccessoryView;
@property (nonatomic, readonly, strong) UITextInputAssistantItem *inputAssistantItem NS_AVAILABLE_IOS(9_0) ; //Shown on top of the keyboard when search is engaged.
//Buttons
@property(nonatomic) BOOL showsBookmarkButton; // default is NO
@property(nonatomic) BOOL showsCancelButton; // default is NO
- (void)setShowsCancelButton:(BOOL)showsCancelButton animated:(BOOL)animated;
@property(nonatomic) BOOL showsSearchResultsButton; // default is NO
@property(nonatomic, getter=isSearchResultsButtonSelected) BOOL searchResultsButtonSelected; // default is NO
//ScopeBar
@property(nonatomic) BOOL showsScopeBar; // default is NO. if YES, shows the scope bar. call sizeToFit: to update frame
@property(nullable, nonatomic,copy) NSArray<NSString *> *scopeButtonTitles ; // array of NSStrings. no scope bar shown unless 2 or more items
@property(nonatomic) NSInteger selectedScopeButtonIndex; // index into array of scope button titles. default is 0. ignored if out of range
- (void)setScopeBarButtonBackgroundImage:(nullable UIImage *)backgroundImage forState:(UIControlState)state;
- (nullable UIImage *)scopeBarButtonBackgroundImageForState:(UIControlState)state;
@property(nullable, nonatomic,strong) UIImage *scopeBarBackgroundImage;
- (void)setScopeBarButtonDividerImage:(nullable UIImage *)dividerImage forLeftSegmentState:(UIControlState)leftState rightSegmentState:(UIControlState)rightState;
- (nullable UIImage *)scopeBarButtonDividerImageForLeftSegmentState:(UIControlState)leftState rightSegmentState:(UIControlState)rightState;
- (void)setScopeBarButtonTitleTextAttributes:(nullable NSDictionary<NSString *, id> *)attributes forState:(UIControlState)state;
- (nullable NSDictionary<NSString *, id> *)scopeBarButtonTitleTextAttributesForState:(UIControlState)state;
@property(nullable,nonatomic,weak) id<UISearchBarDelegate> delegate;
@end
UISearchBarDelegate
// FIXME: UISearchBarDelegate
// return NO to not become first responder
- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
return YES;
}
// called when text starts editing
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
}
// return NO to not resign first responder
- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar {
NSLog(@"%s",__func__);
return YES;
}
// called when text ends editing
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
}
// called before text changes
- (BOOL)searchBar:(UISearchBar *)searchBar shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
return YES;
}
// called when text changes (including clear)
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
}
// called when keyboard search button pressed 键盘搜索按钮
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
}
// called when bookmark button pressed
- (void)searchBarBookmarkButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// called when cancel button pressed
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// called when search results button pressed
- (void)searchBarResultsListButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// selecte ScopeButton
- (void)searchBar:(UISearchBar *)searchBar selectedScopeButtonIndexDidChange:(NSInteger)selectedScope {
NSLog(@"%s",__func__);
NSLog(@"selectedScope = %ld",selectedScope);
}
UISearchController
@interface UISearchController : UIViewController <UIViewControllerTransitioningDelegate, UIViewControllerAnimatedTransitioning>NS_CLASS_AVAILABLE_IOS(8_0)
//创建
- (instancetype)initWithSearchResultsController:(nullable UIViewController *)searchResultsController;
// Pass nil if you wish to display search results in the same view that you are searching.
// searchResultsController 用来显示结果
//常用属性
@property (nonatomic, strong, readonly) UISearchBar *searchBar;
@property (nullable, nonatomic, strong, readonly) UIViewController *searchResultsController;
@property (nonatomic, assign, getter = isActive) BOOL active;
//The presented state of the search interface. //显示结果的意思
//This property to determine whether the search results are displayed.
//You can set this property to YES to force the search interface to appear, even if the user has not taps in the search field.
//The default value of this property is NO.
@property (nullable, nonatomic, weak) id <UISearchControllerDelegate> delegate;
@property (nullable, nonatomic, weak) id <UISearchResultsUpdating> searchResultsUpdater;
//显示
@property (nonatomic, assign) BOOL dimsBackgroundDuringPresentation; //设置是否在搜索时显示半透明背景
@property (nonatomic, assign) BOOL obscuresBackgroundDuringPresentation NS_AVAILABLE_IOS(9_1); //whether the underlying content is obscured during a search.
@property (nonatomic, assign) BOOL hidesNavigationBarDuringPresentation; //设置是否在搜索时隐藏导航栏
@end
UISearchResultsUpdating & UISearchControllerDelegate
#pragma mark UISearchResultsUpdating
// 每次更新搜索框里的文字,就会调用这个方法
// Called when the search bar's text or scope has changed or when the search bar becomes first responder.
// 根据输入的关键词及时响应:里面可以实现筛选逻辑 也显示可以联想词
- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {
NSLog(@"%s",__func__);
// 获取搜索框里地字符串
NSString *searchString = searchController.searchBar.text;
//一般在这里实现搜索的逻辑 & 展示搜索结果
}
#pragma mark UISearchControllerDelegate
// These methods are called when automatic presentation(展示结果) or dismissal(不展示结果) occurs.
// They will not be called if you present or dismiss the search controller yourself.
- (void)willPresentSearchController:(UISearchController *)searchController {
NSLog(@"%s",__func__);
}
- (void)didPresentSearchController:(UISearchController *)searchController{
NSLog(@"%s",__func__);
}
- (void)willDismissSearchController:(UISearchController *)searchController{
NSLog(@"%s",__func__);
}
- (void)didDismissSearchController:(UISearchController *)searchController{
NSLog(@"%s",__func__);
}
// Called after the search controller's search bar has agreed to begin editing or when 'active' is set to YES. If you choose not to present the controller yourself or do not implement this method, a default presentation is performed on your behalf.
- (void)presentSearchController:(UISearchController *)searchController {
NSLog(@"%s",__func__);
}
应用
实现搜索的方式:
- iOS 8.0和之前的版本:UISearchBar + UISearchDisplayController(这里就不详细介绍了)
- iOS 8.0和以上的版本:UISearchController & UISearchBar
- UISearchController 当前页面显示搜索结果
- UISearchController 新控制器显示搜索结果(比较常用)
- 单独使用UISearchBar
Demo:https://github.com/CwLife/search_demo.git
UISearchController
黑技术
BUG:
使用UISearchController实现搜索功能时,当从搜索页返回时,UISearchController的UISearchBar不消失!
原因:
UISearchController继承自UIViewController,也就是说UISearchController自身也带有一个View。但我们在使用UISearchController的时候并未将UISearchController自带的View添加在self.view上,也就是未指定那个controller显示UISearchController自带View上的控件。
因此,UISearchController的searchBar不会跟随搜索页面移动而跟随搜索页的退出一起消失。
解决办法:
UIViewController里有一个属性:@property (nonatomic,assign)BOOL definesPresentationContext;
这一属性决定了那个父控制器的View,将会以优先于UIModalPresentationCurrentContext这种呈现方式来展现自己的View。如果没有父控制器设置这一属性,那么展示的控制器将会是根视图控制器。
只要在要实现搜索功能的控制器里设置:== self.definesPresentationContext = YES; == 即可实现UISearchController的UISearchBar跟随搜索页面一起滑动。一起消失。
self.definesPresentationContext = YES;
注意:
如果不设置:self.definesPresentationContext = YES;那么
如果设置了hidesNavigationBarDuringPresentation=YES,在进入编辑模式的时候会导致searchBar看不见(偏移-64)。
如果设置了hidesNavigationBarDuringPresentation=NO,在进入编辑模式会导致高度为64的空白区域出现(导航栏未渲染出来)。
如果设置:self.definesPresentationContext = YES;
如果设置了hidesNavigationBarDuringPresentation=YES,在进入编辑模式会正常显示和使用。
如果设置了hidesNavigationBarDuringPresentation=NO,在进入编辑模式会导致搜索框向下偏移64.
关于搜索结果界面
关键:何时显示结果界面?
当用户开始编辑搜索框时,会触发(void)updateSearchResultsForSearchController:(UISearchController *)searchController
代理方法。UISearchController就会触发(void)willPresentSearchController:(UISearchController *)searchController
代理方法,自动开始展示搜索结果界面:
- 当前界面展示:会自动显示当前页面的View 来展示搜索结果
- 新控制器界面展示: 会自动显示新控制器的view 来展示搜索结果
此时,UISearchController进入Presentation模式,active的值是YES。可用来做判断是否正在搜索。
(1)当前页内显示结果
@interface TwoViewController ()<UITableViewDataSource,UITableViewDelegate,UISearchResultsUpdating,UISearchControllerDelegate,UISearchBarDelegate>
@property (nonatomic, strong) UITableView *tableView;
@property (strong,nonatomic) NSMutableArray *dataList; //原始数据
@property (nonatomic, strong) UISearchController * searchController;
@property (strong,nonatomic) NSMutableArray *searchList; //搜索结果
@end
@implementation TwoViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.automaticallyAdjustsScrollViewInsets = NO;
_tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 64, XYScreenW, XYScreenH - 64) style:UITableViewStylePlain];
_tableView.backgroundColor = [UIColor whiteColor];
_tableView.delegate = self;
_tableView.dataSource = self;
[self.view addSubview:_tableView];
//UISearchController
_searchController = [[UISearchController alloc] initWithSearchResultsController:nil];
_searchController.searchResultsUpdater = self;
_searchController.delegate = self;
_searchController.searchBar.placeholder = @"placeholder";
_searchController.searchBar.showsCancelButton = YES;
_searchController.searchBar.frame = CGRectMake(0, 0, XYScreenW, 60);
self.tableView.tableHeaderView = _searchController.searchBar;
//解决:退出时搜索框依然存在的问题
self.definesPresentationContext = YES;
}
#pragma mark UISearchResultsUpdating
// 每次更新搜索框里的文字,就会调用这个方法
- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {
NSLog(@"%s",__func__);
// 获取搜索框里地字符串
NSString *searchString = searchController.searchBar.text;
//搜索逻辑
NSPredicate * predicate = [NSPredicate predicateWithFormat:@"SELF CONTAINS %@",searchString];
if (self.searchList!= nil) {
//清除结果数据
[self.searchList removeAllObjects];
}
//搜索结果
self.searchList = [[_dataList filteredArrayUsingPredicate:predicate] mutableCopy];
//刷新表格 展示搜索结果
[self.tableView reloadData];
}
// MARK: 懒加载
- (NSMutableArray *) dataList {
if (_dataList == nil) {
_dataList = [NSMutableArray arrayWithCapacity:100];
for (NSInteger i=0; i<100; i++) {
[_dataList addObject:[NSString stringWithFormat:@"%ld-FlyElephant",(long)i]];
}
}
return _dataList;
}
- (NSMutableArray *) searchList {
if (_searchList == nil) {
_searchList = [NSMutableArray array];
}
return _searchList;
}
#pragma mark - UITableViewDataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
if (self.searchController.active) { //正在展示搜索结果
return [self.searchList count];
}else{
return [self.dataList count];
}
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *flag=@"cellFlag";
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:flag];
if (cell==nil) {
cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:flag];
}
if (self.searchController.active) {
[cell.textLabel setText:self.searchList[indexPath.row]];
}
else{
[cell.textLabel setText:self.dataList[indexPath.row]];
}
return cell;
}
(2)在新控制器显示搜索结果
@interface ThreeViewController ()<UITableViewDataSource,UITableViewDelegate,UISearchResultsUpdating,UISearchControllerDelegate,UISearchBarDelegate>
@property (nonatomic, strong) UITableView *tableView;
@property (strong,nonatomic) NSMutableArray *dataSource; //原始数据
@property (nonatomic, strong) UISearchController *searchController;
@property (strong,nonatomic) NSMutableArray *searchResults; //搜索结果
@property (strong,nonatomic) ResultVC *resultVC; //搜索结果展示控制器
@end
- (void)viewDidLoad {
[super viewDidLoad];
self.automaticallyAdjustsScrollViewInsets = NO;
//tableView
_tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 64, XYScreenW, XYScreenH - 64) style:UITableViewStylePlain];
_tableView.backgroundColor = [UIColor whiteColor];
_tableView.delegate = self;
_tableView.dataSource = self;
[self.view addSubview:_tableView];
//UISearchController
//创建显示搜索结果控制器
_resultVC = [[ResultVC alloc] init];
_searchController = [[UISearchController alloc] initWithSearchResultsController:_resultVC];
_searchController.searchResultsUpdater = self;
_searchController.delegate = self;
_searchController.searchBar.placeholder = @"placeholder";
_searchController.searchBar.showsCancelButton = YES;
_searchController.hidesNavigationBarDuringPresentation = YES; //搜索时隐藏导航栏
_searchController.searchBar.delegate = self;
_searchController.searchBar.frame = CGRectMake(0, 0, XYScreenW,60);
self.tableView.tableHeaderView = _searchController.searchBar;
//解决:退出时搜索框依然存在的问题
self.definesPresentationContext = YES;
}
#pragma mark - UITableViewDelegate, UITableViewDataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
// 如果用户正在搜索,则返回搜索结果的count,否则直接返回数据源数组的count;
if (self.searchController.active) {
return self.searchResults.count;
}else {
return self.dataSource.count;
}
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kUITableViewCellIdentifier];
if (!cell) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:kUITableViewCellIdentifier];
}
// 如果用户正在搜索,则返回搜索结果对应的数据,否则直接返回数据数组对应的数据;
if (self.searchController.active) {
cell.textLabel.text = _searchResults[indexPath.row];
}else {
cell.textLabel.text = _dataSource[indexPath.row];
}
return cell;
}
#pragma mark UISearchResultsUpdating
// 每次更新搜索框里的文字,就会调用这个方法
// Called when the search bar's text or scope has changed or when the search bar becomes first responder.
// 根据输入的关键词及时响应:里面可以实现筛选逻辑 也显示可以联想词
- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {
NSLog(@"%s",__func__);
//会自动显示新控制器的view 来展示搜索结果
//获取搜索框里地字符串
NSString *searchString = searchController.searchBar.text;
// 谓词
/**
1.BEGINSWITH : 搜索结果的字符串是以搜索框里的字符开头的
2.ENDSWITH : 搜索结果的字符串是以搜索框里的字符结尾的
3.CONTAINS : 搜索结果的字符串包含搜索框里的字符
[c]不区分大小写[d]不区分发音符号即没有重音符号[cd]既不区分大小写,也不区分发音符号。
*/
// 创建谓词
NSPredicate *predicate = [NSPredicate predicateWithFormat:@"SELF CONTAINS [CD] %@", searchString];
// 如果搜索框里有文字,就按谓词的匹配结果初始化结果数组,否则,就用字体列表数组初始化结果数组。
if (_searchResults != nil && searchString.length > 0) {
//清除搜索结果
[_searchResults removeAllObjects];
_searchResults = [NSMutableArray arrayWithArray:[_dataSource filteredArrayUsingPredicate:predicate]];
} else if (searchString.length == 0) {
_searchResults = [NSMutableArray arrayWithArray:_dataSource];
}
//显示搜索结果
//在新控制器调用刷新页面的方法
self.resultVC.results = _searchResults;
}
// MARK: 数据源
- (NSMutableArray *) dataSource {
if (_dataSource == nil) {
_dataSource = [NSMutableArray arrayWithArray:[UIFont familyNames]];
}
return _dataSource;
}
- (NSMutableArray *) searchResults {
if (_searchResults == nil) {
_searchResults = [NSMutableArray array];
}
return _searchResults;
}
//在新控制器里:
//在获得搜索结果数据时,调用刷新页面的方法
@property (nonatomic,strong) NSArray *results;
-(void)setResults:(NSArray *)results {
NSLog(@"%s",__FUNCTION__);
_results = results;
[self.tableView reloadData];
}
3.UISearchBar
SearchBar结构也可以单独使用UISearchBar来实现搜索功能,通过代理方法监控UISearchBar上的操作来决定如何显示结果:
-(void)viewDidLoad {
[super viewDidLoad];
//一般不会单独使用searchBar,都是结合UISearchController使用
_searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(30, 100, 350, 60)];
_searchBar.delegate = self;
_searchBar.placeholder = @"placeholder";
_searchBar.prompt = @"prompt";
//_searchBar.text = @"直接搜";
_searchBar.searchBarStyle = UISearchBarStyleDefault;
//各个按钮的图标
[_searchBar setImage:[UIImage imageNamed:@"test.jpg"] forSearchBarIcon:UISearchBarIconBookmark state:UIControlStateNormal];
//各个按钮的位置
[_searchBar setPositionAdjustment:UIOffsetMake(0, 0) forSearchBarIcon:UISearchBarIconSearch];
_searchBar.showsBookmarkButton = YES;
_searchBar.showsCancelButton = YES;
_searchBar.showsSearchResultsButton = YES; //与BookmarkButton重叠
_searchBar.showsScopeBar = YES;
_searchBar.scopeButtonTitles = @[@"scope01",@"scope02",@"scope03"];
[self.view addSubview:_searchBar];
}
// FIXME: UISearchBarDelegate
// called when keyboard search button pressed 键盘搜索按钮
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar {
NSLog(@"%s",__func__);
NSLog(@"searchBar.text = %@",searchBar.text);
//可以在这里实现跳转新控制器
//通过searchBar.text 参数来请求搜索结果
}
// called when bookmark button pressed
- (void)searchBarBookmarkButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// called when cancel button pressed
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// called when search results button pressed
- (void)searchBarResultsListButtonClicked:(UISearchBar *)searchBar{
NSLog(@"%s",__func__);
}
// selecte ScopeButton
- (void)searchBar:(UISearchBar *)searchBar selectedScopeButtonIndexDidChange:(NSInteger)selectedScope {
NSLog(@"%s",__func__);
NSLog(@"selectedScope = %ld",selectedScope);
}
Demo:https://github.com/CwLife/search_demo.git
Demo:https://github.com/CwLife/search_demo.git