UISearchController的搜索欄的實(shí)現(xiàn)（帶有跳轉(zhuǎn)頁(yè)面）

UISearchController是蘋果提供的一種搜索的效果，從iOS8.0之后出來(lái)的遥皂。
效果圖：

2016-06-24_11-35-43.gif

實(shí)現(xiàn)思路

這種看著是一個(gè)頁(yè)面的實(shí)現(xiàn)搜索效果。其實(shí)是二個(gè)類似的頁(yè)面的布局的效果。點(diǎn)擊搜索欄之后，到了另外一個(gè)界面锭碳，實(shí)現(xiàn)搜索效果。

一勿璃、核心代碼實(shí)現(xiàn)

遵守的代理方法
<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout,UISearchResultsUpdating,UISearchControllerDelegate>

@property(nonatomic,strong)UICollectionView *collectionView;//collectionView視圖的布局
@property (nonatomic,strong)NSMutableArray *dataArray;//全部數(shù)據(jù)數(shù)組
@property (nonatomic,strong)NSMutableArray *searchArray;//搜索結(jié)果數(shù)組
@property (nonatomic,strong)UISearchController *searchC;//搜索控制器
@property (nonatomic,strong)SearchCollectionController *searchCollectionC;//搜索結(jié)果控制器

//添加搜索欄
    self.searchCollectionC = [[SearchCollectionController alloc] init];
    self.searchCollectionC.view.frame = CGRectMake(0, 64, kwidth, 1.5*kheight);
    self.searchC = [[UISearchController alloc] initWithSearchResultsController:self.searchCollectionC ];
    self.searchC.delegate = self;
//搜索結(jié)果的代理設(shè)置
    self.searchC.searchResultsUpdater = self;

核心的代碼
#pragma mark---搜索代理方法擒抛，搜索框獲得第一響應(yīng)或內(nèi)容變化時(shí)觸發(fā)
-(void)updateSearchResultsForSearchController:(UISearchController *)searchController
{
    //    得到搜索框的文字
    NSString* str = searchController.searchBar.text;
    NSLog(@"%@",str);
    NSPredicate *namePredicate = [NSPredicate         predicateWithFormat:@"imageName CONTAINS[c]%@ ",str];
    //清空搜索數(shù)組
    [self.searchArray removeAllObjects];
    self.searchArray =  [NSMutableArray arrayWithArray:[self.dataArray filteredArrayUsingPredicate:namePredicate]];
//此句代碼跳轉(zhuǎn)到搜索控制器的結(jié)果
    self.searchCollectionC.searchResults = self.searchArray;
}

二推汽、完整代碼

AppDelegate.h

#import <UIKit/UIKit.h>
@interface AppDelegate : UIResponder <UIApplicationDelegate>
@property (strong, nonatomic) UIWindow *window;
@end

AppDelegate.m

#import "AppDelegate.h"
#import "CollectionController.h"
@interface AppDelegate ()
@end
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    self.window.frame = [UIScreen mainScreen].bounds;
    self.window.backgroundColor = [UIColor whiteColor];
    CollectionController *cc = [[CollectionController alloc] init];
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:cc];
    self.window.rootViewController = nav;
    [self.window  makeKeyWindow];
    [self.window makeKeyAndVisible];
    return YES;
}
@end

CollectionController.h

#import <UIKit/UIKit.h>
@interface CollectionController : UIViewController
@end

CollectionController.m

#import "CollectionController.h"
#import "CollectionViewCell.h"
#import "CollectionModel.h"
#import "DetailViewController.h"
#import "SearchCollectionController.h"
static NSString * const reuseIdentifier = @"myCell";
@interface CollectionController ()<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout,UISearchResultsUpdating,UISearchControllerDelegate>
/**
 *  存放tableViewCell的展示數(shù)據(jù)內(nèi)容a
 */
@property(nonatomic,strong)UICollectionView *collectionView;
@property (nonatomic,strong)NSMutableArray *dataArray;//全部數(shù)據(jù)數(shù)組
@property (nonatomic,strong)NSMutableArray *searchArray;//搜索結(jié)果數(shù)組
@property (nonatomic,strong)UISearchController *searchC;//搜索框
@property (nonatomic,strong)SearchCollectionController *searchCollectionC;
@property (nonatomic,strong)UICollectionViewFlowLayout *flowLayout;
@end
@implementation CollectionController
//懶加載
-(NSMutableArray *)dataArray
{
    if (!_dataArray) {
        _dataArray = [[NSMutableArray alloc]init];
    }
    return _dataArray;
}
-(NSMutableArray *)searchArray
{
    if (!_searchArray) {
        _searchArray = [[NSMutableArray alloc]init];
    }
    return _searchArray;
}
- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    //此代碼的問題解決方案－－－－－888666
    self.automaticallyAdjustsScrollViewInsets = NO;
    self.edgesForExtendedLayout = UIRectEdgeNone;
    self.navigationItem.title = @"search";
    //添加搜索欄
    self.searchCollectionC = [[SearchCollectionController alloc] init];
    self.searchCollectionC.view.frame = CGRectMake(0, 64, kwidth, 1.5*kheight);
    self.searchC = [[UISearchController alloc] initWithSearchResultsController:self.searchCollectionC ];
    //代碼設(shè)置的問題－－－－－888666
   self.searchC.searchBar.frame = CGRectMake(self.searchC.searchBar.frame.origin.x, self.searchC.searchBar.frame.origin.y, kwidth,44);
    [self.searchCollectionC.view addSubview:self.searchC.searchBar];
    self.searchC.delegate = self;
    //2016-06-17添加
    self.definesPresentationContext = YES;
    [self.searchC.searchBar sizeToFit];
    [self.view addSubview:self.searchC.searchBar];
//    [self.collectionView addSubview:self.searchC.searchBar];
    //更新代理
    self.searchC.searchResultsUpdater = self;
    self.searchC.searchBar.searchBarStyle = UISearchBarStyleMinimal;
    self.searchC.searchBar.barTintColor = [UIColor redColor];
    self.searchC.searchBar.placeholder = @"qingshuru";
    //搜索結(jié)果不變灰
    self.searchC.dimsBackgroundDuringPresentation = NO;
    self.definesPresentationContext = YES;
    //便利初始化創(chuàng)建數(shù)據(jù)
    NSArray *nameArray = [NSArray arrayWithObjects:@"a",@"b",@"c",@"z菲",@"wbe",@"ABe",@"aBS",@"wang@12.com", @"wan@126.cn",@"cheng",@"tian",@"jia",@"zai",@"程",@"為",@"逛",@"哈哈",@"kkk",@"yyy",nil];
    
    for (int i = 0; i < nameArray.count; i++) {
        CollectionModel *model = [[CollectionModel alloc] init];
        model.imageName = nameArray[i];
        //把全部人存到數(shù)組當(dāng)中去
        [self.dataArray addObject:model];
    }
    [self setOneCollectionView];
    
}
/**
 *  main的collectionview
 */
- (void)setOneCollectionView{
    
    //創(chuàng)建集合視圖
    self.flowLayout = [[UICollectionViewFlowLayout alloc]init];
    self.flowLayout.minimumInteritemSpacing = 5;
    self.flowLayout.minimumLineSpacing = 33;
    self.flowLayout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5);//分區(qū)內(nèi)邊距
    //itemsize大小我們?cè)O(shè)置為一行4列
    CGFloat totalWidth = kwidth;
    CGFloat itemWidth = (totalWidth-3*5-2*5)/4.0;
    CGFloat itemHeght = 1.0*itemWidth;
    //注意：item的寬高必須要提前算好
    self.flowLayout.itemSize = CGSizeMake(itemWidth, itemHeght);
    //創(chuàng)建collectionView對(duì)象，并賦值布局
    self.collectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 54, kwidth, kheight) collectionViewLayout:self.flowLayout];
    //設(shè)置數(shù)據(jù)源和代理
    self.collectionView.dataSource = self;
    self.collectionView.delegate = self;
    self.collectionView.bounces = NO;
    self.collectionView.backgroundColor = [UIColor whiteColor];
       //注冊(cè)單元格
    [self.collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
    //添加
    [self.view addSubview:self.collectionView];
    
}
#pragma mark--UICollectionViewDataSource

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    
    return self.dataArray.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    //執(zhí)行完以下語(yǔ)句后調(diào)用   MyCollectionViewCell.m  的 initWithFrame方法
    CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    //設(shè)置cell
    cell.imageView.image = [UIImage imageNamed:@"1.jpg"];
    CollectionModel *model = [[CollectionModel alloc] init];
    
    model = self.dataArray[indexPath.item];
    cell.lable.text = [NSString stringWithFormat:@"%@",model.imageName];
    return cell;
}

#pragma mark--UICollectionViewDelegate

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@"%ld %ld",indexPath.section,indexPath.item);
    DetailViewController *detail = [[DetailViewController alloc] init] ;
    CollectionModel *model = [[CollectionModel alloc] init];
    model = self.dataArray[indexPath.item];
    detail.name = model.imageName;
    [self.navigationController pushViewController:detail animated:YES];
}

#pragma mark---搜索代理方法歧沪，搜索框獲得第一響應(yīng)或內(nèi)容變化時(shí)觸發(fā)
-(void)updateSearchResultsForSearchController:(UISearchController *)searchController
{
    //得到搜索框的文字
    NSString* str = searchController.searchBar.text;
    NSLog(@"%@",str);
    //清空搜索數(shù)組
    [self.searchArray removeAllObjects];
    self.searchArray =  [NSMutableArray arrayWithArray:[self.dataArray filteredArrayUsingPredicate:namePredicate]];
    self.searchCollectionC.searchResults = self.searchArray;
    for (CollectionModel *model in self.searchArray) {
        NSLog(@"%@",model.imageName);
    }
}
@end

CollectionViewCell.h

#import <UIKit/UIKit.h>
@class CollectionModel;
@interface CollectionViewCell : UICollectionViewCell
@property(nonatomic,strong)UIImageView *imageView;
@property(nonatomic,strong)UILabel *lable;
@property(nonatomic,strong)CollectionModel *collectionModel;
@end

CollectionViewCell.m

#import "CollectionViewCell.h"
#import "CollectionModel.h"
@implementation CollectionViewCell
- (instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        //添加內(nèi)部控件
        //imageview
        CGFloat totalWidth = self.frame.size.width;
        CGFloat totalHeight = self.frame.size.height;
        self.imageView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, totalWidth, totalWidth)];
        self.imageView.backgroundColor = [UIColor redColor];
        [self addSubview:self.imageView];
        //lable
        self.lable = [[UILabel alloc]initWithFrame:CGRectMake(0, totalHeight+5, totalWidth, 20)];
        self.lable.textAlignment = NSTextAlignmentCenter;
        self.lable.layer.borderWidth = 0.5f;
        self.lable.layer.borderColor = [[UIColor grayColor] CGColor];
        [self addSubview:self.lable];   
    }
    return self;
}
- (void)setCollectionModel:(CollectionModel *)collectionModel{
    self.lable.text = collectionModel.imageName;
}
@end

CollectionModel.h

#import <Foundation/Foundation.h>
@interface CollectionModel : NSObject
@property(nonatomic,copy)NSString *image;
@property(nonatomic,copy)NSString *imageName;
@end

CollectionModel.m

#import "CollectionModel.h"
@implementation CollectionModel
/**
 *  模型賦值是遇到?jīng)]有定義的特例處理
 */
- (void)setValue:(id)value forUndefinedKey:(NSString *)key{
    
}
- (void)setNilValueForKey:(NSString *)key{
    
}
@end

搜索結(jié)果的控制器
SearchCollectionController.h

#import <UIKit/UIKit.h>
@interface SearchCollectionController : UIViewController
@property (nonatomic, strong) NSMutableArray *searchResults;
@end

SearchCollectionController.m

#import "SearchCollectionController.h"
#import "CollectionViewCell.h"
#import "CollectionModel.h"
#import "DetailViewController.h"
static NSString * const reuseIdentifier = @"myCell";
@interface SearchCollectionController ()<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout,UISearchBarDelegate>
@property(nonatomic,strong)UICollectionView *collectionView1;
@end
@implementation SearchCollectionController
- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    self.navigationItem.title = @"A8";
    self.automaticallyAdjustsScrollViewInsets = NO;
    [self.collectionView1 registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
      [self setOneCollectionView];    
}
//有新值的變化歹撒，調(diào)用這個(gè)方法
- (void)setSearchResults:(NSMutableArray *)searchResults
{
    _searchResults = searchResults;
    [self.collectionView1 reloadData];
    
}
/**
 *  main的collectionview
 */
- (void)setOneCollectionView{
    //創(chuàng)建集合視圖
    UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc]init];
    flowLayout.minimumInteritemSpacing = 5;
    flowLayout.minimumLineSpacing = 33;
    flowLayout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5);//分區(qū)內(nèi)邊距
    //itemsize大小我們?cè)O(shè)置為一行4列
    CGFloat totalWidth = kwidth;
    CGFloat itemWidth = (totalWidth-3*5-2*5)/4.0;
    CGFloat itemHeght = 1.0*itemWidth;
    //注意：item的寬高必須要提前算好
    flowLayout.itemSize = CGSizeMake(itemWidth, itemHeght);
    //創(chuàng)建collectionView對(duì)象，并賦值布局
    self.collectionView1 = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 64, kwidth, kheight) collectionViewLayout:flowLayout];
    //設(shè)置數(shù)據(jù)源和代理
    self.collectionView1.dataSource = self;
    self.collectionView1.delegate = self;
    self.collectionView1.bounces = NO;
    self.collectionView1.backgroundColor = [UIColor whiteColor];
    //注冊(cè)單元格
    [self.collectionView1 registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
    //添加
    [self.view addSubview:self.collectionView1];
}

#pragma mark--UICollectionViewDataSource
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return self.searchResults.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    //執(zhí)行完以下語(yǔ)句后調(diào)用   MyCollectionViewCell.m  的 initWithFrame方法
    CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    //設(shè)置cell
    cell.imageView.image = [UIImage imageNamed:@"1.jpg"];
    CollectionModel *model = [[CollectionModel alloc] init];
    model = self.searchResults[indexPath.item];
    cell.lable.text = [NSString stringWithFormat:@"%@",model.imageName];
    return cell;  
}

#pragma mark--UICollectionViewDelegate
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@"%ld %ld",indexPath.section,indexPath.item);
    DetailViewController *detail = [[DetailViewController alloc] init] ;
    CollectionModel *model = [[CollectionModel alloc] init];
    model = self.searchResults[indexPath.item];
    detail.name = model.imageName;
    [self.presentingViewController.navigationController pushViewController:detail animated:YES];
}
@end

點(diǎn)擊跳轉(zhuǎn)的詳情頁(yè)面
DetailViewController.h

#import <UIKit/UIKit.h>
@interface DetailViewController : UIViewController
@property (nonatomic,strong)NSString *name;
@end

DetailViewController.m

#import "DetailViewController.h"
@interface DetailViewController ()
@end
@implementation DetailViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.frame = CGRectMake(100, 100, 100, 100);
    [button setTitle:self.name forState:UIControlStateNormal];
    button.backgroundColor = [UIColor redColor];
    [self.view addSubview:button];
}
- (void)viewWillAppear:(BOOL)animated{
    self.navigationController.navigationBarHidden  = NO;
}
@end

代碼到此結(jié)束诊胞，希望大家批評(píng)指正暖夭，謝謝大家。大家感覺寫的還可以的話記得給個(gè)star撵孤。（嘻嘻哈哈）迈着，謝謝大家
githup網(wǎng)址:https://github.com/jinweicheng/UISearchController

最后編輯于：2017.12.03 07:08:24

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者

人面猴
序言：七十年代末，一起剝皮案震驚了整個(gè)濱河市邪码，隨后出現(xiàn)的幾起案子裕菠，更是在濱河造成了極大的恐慌，老刑警劉巖霞扬，帶你破解...
沈念sama閱讀 217,734評(píng)論 6贊 505
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件糕韧，死亡現(xiàn)場(chǎng)離奇詭異，居然都是意外死亡喻圃，警方通過(guò)查閱死者的電腦和手機(jī)萤彩，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 92,931評(píng)論 3贊 394
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進(jìn)店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)斧拍，“玉大人雀扶，你說(shuō)我怎么就攤上這事∷列冢” “怎么了愚墓？”我有些...
開封第一講書人閱讀 164,133評(píng)論 0贊 354
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵，是天一觀的道長(zhǎng)昂勉。經(jīng)常有香客問我浪册，道長(zhǎng)，這世上最難降的妖魔是什么岗照？我笑而不...
開封第一講書人閱讀 58,532評(píng)論 1贊 293
?港島之戀（遺憾婚禮）
正文為了忘掉前任村象，我火速辦了婚禮，結(jié)果婚禮上攒至，老公的妹妹穿的比我還像新娘厚者。我一直安慰自己，他們只是感情好迫吐，可當(dāng)我...
茶點(diǎn)故事閱讀 67,585評(píng)論 6贊 392
惡毒庶女頂嫁案：這布局不是一般人想出來(lái)的
文/花漫我一把揭開白布库菲。她就那樣靜靜地躺著，像睡著了一般志膀。火紅的嫁衣襯著肌膚如雪熙宇。梳的紋絲不亂的頭發(fā)上鳖擒，一...
開封第一講書人閱讀 51,462評(píng)論 1贊 302
城市分裂傳說(shuō)
那天，我揣著相機(jī)與錄音奇颠，去河邊找鬼败去。笑死，一個(gè)胖子當(dāng)著我的面吹牛烈拒，可吹牛的內(nèi)容都是我干的。我是一名探鬼主播广鳍，決...
沈念sama閱讀 40,262評(píng)論 3贊 418
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼荆几，長(zhǎng)吁一口氣：“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼！你這毒婦竟也來(lái)了赊时？” 一聲冷哼從身側(cè)響起吨铸，我...
開封第一講書人閱讀 39,153評(píng)論 0贊 276
萬(wàn)榮殺人案實(shí)錄
序言：老撾萬(wàn)榮一對(duì)情侶失蹤，失蹤者是張志新（化名）和其女友劉穎祖秒，沒想到半個(gè)月后诞吱，有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 45,587評(píng)論 1贊 314
?護(hù)林員之死
正文獨(dú)居荒郊野嶺守林人離奇死亡竭缝，尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點(diǎn)故事閱讀 37,792評(píng)論 3贊 336
?白月光啟示錄
正文我和宋清朗相戀三年房维，在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片抬纸。...
茶點(diǎn)故事閱讀 39,919評(píng)論 1贊 348
活死人
序言：一個(gè)原本活蹦亂跳的男人離奇死亡咙俩，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出湿故，到底是詐尸還是另有隱情阿趁，我是刑警寧澤，帶...
沈念sama閱讀 35,635評(píng)論 5贊 345
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布坛猪，位于F島的核電站脖阵，受9級(jí)特大地震影響，放射性物質(zhì)發(fā)生泄漏墅茉。R本人自食惡果不足惜命黔，卻給世界環(huán)境...
茶點(diǎn)故事閱讀 41,237評(píng)論 3贊 329
男人毒藥：我在死后第九天來(lái)索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望躁锁。院中可真熱鬧纷铣，春花似錦、人聲如沸战转。這莊子的主人今日做“春日...
開封第一講書人閱讀 31,855評(píng)論 0贊 22
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽(yáng)槐秧。三九已至啄踊，卻和暖如春忧设，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背颠通。一陣腳步聲響...
開封第一講書人閱讀 32,983評(píng)論 1贊 269
情欲美人皮
我被黑心中介騙來(lái)泰國(guó)打工址晕，沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留，地道東北人顿锰。一個(gè)月前我還...
沈念sama閱讀 48,048評(píng)論 3贊 370
代替公主和親
正文我出身青樓谨垃，卻偏偏與公主長(zhǎng)得像，于是被迫代替她去往敵國(guó)和親硼控。傳聞我的和親對(duì)象是個(gè)殘疾皇子刘陶，可洞房花燭夜當(dāng)晚...
茶點(diǎn)故事閱讀 44,864評(píng)論 2贊 354

UISearchController的搜索欄的實(shí)現(xiàn)（帶有跳轉(zhuǎn)頁(yè)面）

實(shí)現(xiàn)思路

一勿璃、核心代碼實(shí)現(xiàn)

二推汽、完整代碼

推薦閱讀更多精彩內(nèi)容