IOS_SearchBar搜索栏及关键字高亮

搜索框的效果演示:

这个就是所谓的搜索框了,那么接下来我们看看如何使用代码来实现这个功能.

我所使用的数据是英雄联盟的英雄名单,是一个JSON数据的txt文件, JSON数据的处理代码如下所示:

?


1

2

3

4

5

6

//获取文件的路径path

NSString *path = [[NSBundle mainBundle] pathForResource:@"heros" ofType:@"txt"];

//将路径下的文件转换成NSData数据

NSData *data = [NSData dataWithContentsOfFile:path];

//将得到的NSdata数据进行JSON解析并返回一个结果数组result

id result = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingMutableContainers error:nil];

我们再来看数据的层级关系:

这里解释下,这个层级关系是通过在线代码格式化网页得到的,我们上一步所做的数据处理就是将原始数据进行处理,得到一个结果数组,他的层级关系和格式化后一样,这样就可以根据格式化网页上的层级关系来进一步处理数据,将需要的内容放入数组或者字典(当然也可以直接打印result来看层级关系,看个人习惯).

那么我们所需要的内容就是字典中nick所对应的值,通过遍历将其取出来放入数组中,这里将这个数组定义为属性,在其他方法里会用到.

?


1

2

3

4

// 将搜索范围的内容放入数组

for (NSDictionary *diction in result) {

  [self.arrOfSeachBoxes addObject:diction[@"nick"]];

 }

接下来我们创建一个UITableView用来显示数据,搜索条需要用到的类是UISearchController,先看看如何创建:

系统的注释说的很清楚,如果想要在当前页显示搜索结果,这个方法的参数填nil即可,为了方便起见,声明一个UISearchController的属性

?


1

@property (nonatomic, retain) UISearchController *searchController;

接下来是创建

?


1

2

// nil表示在当前页面显示搜索结果

self.searchController = [[UISearchController alloc] initWithSearchResultsController:nil];

UISearchController头文件中被放在非常靠前的位置的是一个属性

根据字面意思我们可以猜到这跟搜索结果的更新有关,就跟tableViewreloadData一个意思.那么很明显,我们得签协议<UISearchResultsUpdating>,这个协议中只有一个必须要实现的方法.

?


1

- (void)updateSearchResultsForSearchController:(UISearchController *)searchController;

头文件如下图所示:

---------这里是美丽的分割线---------

上面已经把所有关于搜索条的类和方法罗列了一下,下面来捋一捋

所有定义的属性如下所示:

?


1

2

3

4

5

6

7

8

NS_ASSUME_NONNULL_BEGIN

@interface ViewController () <UITableViewDelegate, UITableViewDataSource, UISearchResultsUpdating>

@property (nonatomic, retain) NSMutableArray *arrOfSeachBoxes;/**< 搜索范围 */

@property (nonatomic, retain) NSMutableArray *arrOfSeachResults;/**< 搜索结果 */

@property (nonatomic, retain) UISearchController *searchController;

@property (nonatomic, retain) UITableView *tableView;

@end

NS_ASSUME_NONNULL_END

数据处理相关代码如下:

?


1

2

3

4

5

6

7

8

9

// 解析数据

NSString *path = [[NSBundle mainBundle] pathForResource:@"heros" ofType:@"txt"];

NSData *data = [NSData dataWithContentsOfFile:path];

id result = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingMutableContainers error:nil];

self.arrOfSeachBoxes = [NSMutableArray array];

// 将搜索范围的内容放入数组

for (NSDictionary *dic in result) {

 [self.arrOfSeachBoxes addObject:dic[@"nick"]];

}

和UISearchController的创建相关代码如下:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

// 创建

self.searchController = [[UISearchController alloc] initWithSearchResultsController:nil];

//searchBar的frame

self.searchController.searchBar.frame = CGRectMake(0, 44, 0, 44);

// 是否需要在输入搜索内容时变暗

self.searchController.dimsBackgroundDuringPresentation = false;

self.searchController.searchBar.showsCancelButton = YES;/**< 取消按钮 */

self.searchController.searchResultsUpdater = self;/**< 显示搜索结果的VC */

self.searchController.active = YES;/**< 搜索结果显示 */

和tableView相关的代码如下:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

// tableView

self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 20, self.view.bounds.size.width, self.view.bounds.size.height - 20) style:UITableViewStylePlain];

[self.view addSubview:self.tableView];

self.tableView.delegate = self;

self.tableView.dataSource = self;

[self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"pool"];

//将SearchBar放在tableView的头部视图

self.tableView.tableHeaderView = self.searchController.searchBar;

UISearchResultsUpdating协议方法代码如下:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

- (void)updateSearchResultsForSearchController:(UISearchController *)searchController {

//初始化存储搜索结果的数组

self.arrOfSeachResults = [NSMutableArray array];

// 获取关键字

NSPredicate *predicate = [NSPredicate predicateWithFormat:@"SELF CONTAINS[c] %@", searchController.searchBar.text];

// 用关键字过滤数组中的内容, 将过滤后的内容放入结果数组

self.arrOfSeachResults = [[self.arrOfSeachBoxes filteredArrayUsingPredicate:predicate] mutableCopy];

// 完成数据的过滤和存储后刷新tableView.

[self.tableView reloadData];

}

tableView的DataSource

?


1

2

3

4

5

6

7

8

9

10

11

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

// 显示搜索结果时

if (self.searchController.active) {

 //以搜索结果的个数返回行数

 return self.arrOfSeachResults.count;

}

 //没有搜索时显示所有数据

 return self.arrOfSeachBoxes.count;

}

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"pool"];

// 显示搜索结果时

if (self.searchController.active) {

// 原始搜索结果字符串.

NSString *originResult = self.arrOfSeachResults[indexPath.row];

// 获取关键字的位置

NSRange range = [originResult rangeOfString:self.searchController.searchBar.text];

// 转换成可以操作的字符串类型.

NSMutableAttributedString *attribute = [[NSMutableAttributedString alloc] initWithString:originResult];

// 添加属性(粗体)

[attribute addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:20] range:range];

// 关键字高亮

[attribute addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:range];

// 将带属性的字符串添加到cell.textLabel上.

[cell.textLabel setAttributedText:attribute];

cell.textLabel.text = self.arrOfSeachResults[indexPath.row];

 } else {

 cell.textLabel.text = self.arrOfSeachBoxes[indexPath.row];

  }

 return cell;

}

时间: 2024-08-10 23:54:25

IOS_SearchBar搜索栏及关键字高亮的相关文章

Lucene系列:(7)搜索关键字高亮

在搜索结果中,将与关健字相同的字符用红色显示 TestHighlighter.java package com.rk.lucene.d_highlighter; import java.util.ArrayList; import java.util.List; import org.apache.lucene.document.Document; import org.apache.lucene.index.IndexWriter; import org.apache.lucene.query

在 Angular 中实现搜索关键字高亮

在 Angular 中,我们不应该试图直接修改 DOM 的内容,当需要更新 DOM 内容的时候,应该修改的其实是我们的数据模型,也就是 $scope 中的数据,Angular 会帮助我们将修改之后的数据展示在页面中. 但是,在有些情况下,比如我们有一个搜索框,希望将搜索的关键字在正文中高亮出来,这时候就会感觉比较吃力了,filter 可以帮助我们处理这种情况. 实际上,很多时候,我们的数据是不能直接输出到 DOM 中的,典型的比如日期,或者货币等等,通常需要将我们内部的数据格式化之后,再输出到页

多个关键字高亮

项目地址:iOS 关键词高亮显示 在做搜索时,经常用到关键字高亮.以下是我的项目用到的关键字高亮. 1 //关键字数组 关键字颜色 [lb setAttributedText:text withRegularPattern:[text regularPattern:keyArr] attributes:@{ NSForegroundColorAttributeName : [UIColor redColor]}]; 2 /** 关键字 正则判断 */ -(NSString *)regularPa

label中的关键字高亮

一 .在初始化方法中把所有需要高亮关键字的label加入到labels数组中,并且把这些label原来字体的颜色加入到 labelTextColors中 ,代码如下 self.labels = [NSArray arrayWithObjects:self.textLabel,self.detailTextLabel, nil]; self.labelTextColors = [NSArray arrayWithObjects:kColor_Black,kColor_LightGray, nil]

JavaScript搜索关键字高亮的实现

高亮功能主要是指对页面中指定区域的指定文字进行高亮显示,也就是背景着色.一般在搜索结果页面会经常用到这个功能. 下面就为大家提供一种解决方案,用javascript实现.遂平县敖松广告 首先在<head>中引入下面javascript方法: 01 <script type="text/javascript"> 02 //<![CDATA[ 03     //--------begin function fHl(o, flag, rndColor, url)

vim自定义添加关键字高亮

使用vim编写java代码时,String没有高亮,而其他数据类型例如int char等都有语法高亮,这让我非常难受,所以我想把String也设置成高亮 1.打开vim的syntax文件夹 # cd /usr/share/vim/vim81/syntax 因为每一种语言的语法高亮都在syntax文件夹内,以后缀vim形式存在 2.打开java.vim # vi java.vim 3.添加String关键字 找到 syntax keyword javaType 发现后面的关键字没有String,手

大段文本的多个关键字高亮

前几天看到有人提在网页中实时高亮关键字,大约6万多个字中高亮600个关键字,用户可以随时修改并及时高亮,也就是onkeyup时做高亮,说用正则在IE下效率不理想 想了下自已给了一个实现方案:比如这段文本是:"这是一大段文本,一大段文本哦"关键字是:["这是","大段文本","哦"]首先找出最长的关键字,并把这些关键字弄成map,如: var keys = ['这是', '这里是', '文本', '一']; var prepar

iOS 关于关键字高亮

- (NSMutableAttributedString *)colorStr: (NSString *)originalStr   // originalStr : 需要高亮传入的字符串 { NSMutableAttributedString *dataStr = [[[NSMutableAttributedString alloc] initWithString:originalStr] autorelease]; for (int i = 0; i < originalStr.length

设置Shader关键字高亮(网上转)

原文链接:http://www.cnblogs.com/cg_ghost/archive/2011/11/30/2268734.html 经过试验,在VS2012有效. 1. 创建或编辑usertype.dat文件(此文件在VS安装目录下的Common7\IDE下面,比如我的就在D:\Program Files\Microsoft Visual Studio 8\Common7\IDE\usertype.dat),添加如下的关键字列表,每个单词占一行,如果你想添加你自己的关键字,也可以按照这种方