iOS中 UISearchController 搜索欄 UI技術分享 – iPhone手機開發 iPhone軟體開發教學課程


UISearchController 繼承自UIViewController

    // 在iOS 8.0以上版本中, 我們可以使用UISearchController來非常方便地在UITableView中添加搜索框. 而在之前版本中, 我們還是必須使用UISearchBar + UISearchDisplayController的組合方式.

#import SearchViewController.h
#define kTableCell @tablecell
@interface SearchViewController ()
@property(nonatomic,retain)NSMutableArray *items;
@property(nonatomic,retain)UISearchController *searchController;
@property(nonatomic,retain)NSMutableArray *searchResults;//接收數據源結果
@end

懶加載及釋放

 

@implementation SearchViewController

- (instancetype)init
{
    self = [super init];
    if (self) {
        }
    return self;
}
//懶加載
- (NSMutableArray *)items{
    if (!_items) {
        self.items = [NSMutableArray arrayWithCapacity:0];
    }
    return [[_items retain]autorelease];
}
//懶加載
- (NSMutableArray *)searchResults{
    if (!_searchResults) {
        self.searchResults = [NSMutableArray arrayWithCapacity:0];
    }
    return [[_searchResults retain]autorelease];
}
//釋放
- (void)dealloc
{
    self.items = nil;
    self.searchResults = nil;
    self.searchController = nil;
    [super dealloc];
}

調用:

 

 

- (void)viewDidLoad {
    [super viewDidLoad];
    //導航欄
    [self p_navigationController];

    //調用初始化searchController
    [self setSearchControllerView];
    
    //註冊
    [self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:kTableCell];
    
}

 

初始化SearchController初始化

 

- (void)setSearchControllerView{
    self.searchController = [[UISearchController alloc]initWithSearchResultsController:nil];
    self.searchController.searchBar.frame = CGRectMake(0, 0, 0, 44);
    self.searchController.dimsBackgroundDuringPresentation = false;
    //搜索欄表頭視圖
    self.tableView.tableHeaderView = self.searchController.searchBar;
    [self.searchController.searchBar sizeToFit];
//背景顏色
    self.searchController.searchBar.backgroundColor = [UIColor orangeColor];
    self.searchController.searchResultsUpdater = self;


}

 

//引入UISearchController之後, UITableView的內容也要做相應地變動: 即cell中要呈現的內容是items, 還是searchResults.這一點, 可以通過UISearchController的active屬性來判斷, 即判斷輸入框是否處於active狀態.

//UITableView相關的很多方法都要根據active來做判斷:

配置導航條

 

- (void)p_navigationController{
    self.title = @小韓哥-英雄列表;
    self.items = @[@國服第一臭豆腐 No.1 Stinky Tofu CN.,
                   @比爾吉沃特(Bill Ji walter),
                   @瓦洛蘭 Valoran,
                   @祖安 Zaun,
                   @德瑪西亞 Demacia,
                   @諾克薩斯 Noxus,
                   @艾歐尼亞 Ionia,
                   @皮爾特沃夫 Piltover,
                   @弗雷爾卓德 Freijord,
                   @班德爾城 Bandle City,
                   @無畏先鋒,
                   @戰爭學院 The Institute of War,
                   @巨神峰,
                   @雷瑟守備(JustThunder),
                   @裁決之地(JustRule),
                   @黑色玫瑰(Black Rose),
                   @暗影島(Shadow island),
                   @鋼鐵烈陽(Steel fierce),
                   @恕瑞瑪沙漠 Shurima Desert,
                   @均衡教派(Balanced sect),
                   @水晶之痕(Crystal Scar),
                   @影流(Shadow Flow ),
                   @守望之海(The Watchtower of sea),
                   @皮爾特沃夫,
                   @征服之海,
                   @扭曲叢林 Twisted Treeline,
                   @教育網專區,
                   @試煉之地 Proving Grounds,
                   @卡拉曼達 Kalamanda,
                   @藍焰島 Blue Flame Island,
                   @哀嚎沼澤 Howling Marsh,
                   @艾卡西亞 Icathia,
                   @鐵脊山脈 Ironspike Mountains,
                   @庫莽古叢林 Kumungu,
                   @洛克法 Lokfar,
                   @摩根小道 Morgon Pass,
                   @塔爾貢山脈 Mountain Targon,
                   @瘟疫叢林 Plague Jungles,
                   @盤蛇河 Serpentine River,
                   @厄爾提斯坦 Urtistan,
                   @巫毒之地 Voodoo Lands,
                   @咆哮深淵 Howling Abyss,
                   @熔巖洞窟 Magma Chambers,
                   @召喚師峽谷 Summoner's Rift,
                   @九尾妖狐: 阿貍(Ahri),
                   @暗影之拳:阿卡麗(Akali),
                   @牛頭酋長:阿利斯塔(Alistar),
                   @殤之木乃伊:阿木木(Amumu),
                   @冰晶鳳凰:艾尼維亞(Anivia),
                   @黑暗之女:安妮(Annie),
                   @寒冰射手:艾希(Ashe),
                   @蒸汽機器人:佈裡茨(Blitzcrank),
                   @復仇焰魂:佈蘭德(Brand),
                   @皮城女警:凱特琳(Caitlyn),
                   @魔蛇之擁:卡西奧佩婭(Cassiopeia),
                   @虛空恐懼:科’加斯(ChoGath),
                   @英勇投彈手:庫奇(Corki),
                   @諾克薩斯之手:德萊厄斯(Darius),
                   @皎月女神:黛安娜:(Diana),
                   @祖安狂人:蒙多醫生(DrMundo),
                   @榮耀行刑官:德萊文(Delevin),
                   @蜘蛛女皇:伊莉斯(Elise),
                   @寡婦制造者:伊芙琳(Evelynn),
                   @探險傢:伊澤瑞爾(Ezreal),
                   @末日使者:費德提克(Fiddlesticks),
                   @無雙劍姬:劍姬(Fiora),
                   @潮汐海靈:菲茲(Fizz),
                   @哨兵之殤:加裡奧(Galio),
                   @海洋之災:普朗克(Gangplank),
                   @德瑪西亞之力:蓋倫(Garen),
                   @酒桶:古拉加斯(Gragas),
                   @法外狂徒:格雷福斯(Graves),
                   @戰爭之影:赫卡裡姆 (Hecarim),
                   @大發明傢:黑默丁格(Heimerdinger),
                   @刀鋒意志:伊瑞利亞(Irelia),
                   @風暴之怒:迦娜(Janna),
                   @德瑪西亞皇子:嘉文四世(JarvanⅣ),
                   @武器大師:賈克斯(Jax),
                   @未來守護者:傑斯(Jayce),
                   @天啟者:卡爾瑪(Karma),
                   @死亡頌唱者:卡爾薩斯(Karthus),
                   @虛空行者:卡薩丁(Kassadin),
                   @不詳之刃:卡特琳娜(Katarina),
                   @審判天使:凱爾(Kayle),
                   @狂暴之心:凱南(Kennen),
                   @虛空掠奪者:卡’茲克(Khazix),
                   @深淵巨口:克格’莫(Kog Maw),
                   @詭術妖姬:樂芙蘭(LeBlanc),
                   @盲僧:李青(Lee sin),
                   @曙光女神:蕾歐娜(Leona),
                   @仙靈女巫:璐璐(lulu),
                   @光輝女郎:拉克絲(Lux),
                   @熔巖巨獸:墨菲特(Malphite),
                   @虛空先知:瑪爾紮哈(Malzahar),
                   @扭曲樹精:茂凱(Maokai),
                   @無極劍聖:易(Yi),
                   @賞金獵人:厄運小姐(MissFortune),
                   @齊天大聖:孫悟空(Monkey king),
                   @金屬大師:莫德凱撒(Mordekaiser),
                   @墮天使:莫甘娜(Morgana),
                   @喚潮鮫姬:娜美(Nami),
                   @沙漠死神:內瑟斯(Nasus),
                   @深海泰坦:諾提勒斯(Nautilus),
                   @狂野女獵手:奈德麗(Nidalee),
                   @永恒夢魘:魔騰(Nocturne),
                   @雪人騎士:努努(Nunu),
                   @狂戰士:奧拉夫(Olaf),
                   @發條魔靈:奧莉安娜(Orianna),
                   @戰爭之王:潘森(Pantheon),
                   @鋼鐵大使:波比(Poopy),
                   @披甲龍龜:拉莫斯(Rammus),
                   @荒漠屠夫:雷克頓(Renekton),
                   @傲之追獵者:雷恩加爾(Rengar),
                   @放逐之刃:瑞文(Rivan),
                   @機械公敵:蘭博(Rumble),
                   @流浪法師:瑞茲(Ryze),
                   @凜冬之怒:瑟莊妮:(Sejuani),
                   @惡魔小醜:薩科(Shaco),
                   @暮光之眼:慎(Shen),
                   @龍血武姬:希瓦娜(Shyvana),
                   @煉金術士:辛吉德(Singed),
                   @亡靈勇士:賽恩(Sion),
                   @戰爭女神:希維爾(Sivir),
                   @水晶先鋒:斯卡納(Skarner),
                   @琴瑟仙女:娑娜(Sona),
                   @眾星之子:索拉卡(Soraka),
                   @策士統領:斯維因(Swain),
                   @暗黑元首:辛德拉(Syndra),
                   @刀鋒之影:泰隆(Talon),
                   @寶石騎士:塔裡克(Taric),
                   @迅捷斥候:提莫(Teemo),
                   @魂鎖典獄長:錘石(Thresh),
                   @麥林炮手:崔絲塔娜(Tristana),
                   @詛咒巨魔:特蘭德爾(Trundle),
                   @蠻族之王:泰達米爾(Tryndamere),
                   @卡牌大師:崔斯特(Twisted Fate),
                   @瘟疫之源:圖奇(Twitch),
                   @野獸之靈:烏迪爾(Udyr),
                   @首領之傲:厄加特(Urgot),
                   @懲戒之箭:韋魯斯(Varus),
                   @暗夜獵手:薇恩(Vayne),
                   @邪惡小法師:維伽(Veigar),
                   @皮城執法官:蔚(Vi),
                   @機械先驅:維克托(Viktor),
                   @猩紅收割者:弗拉基米爾(Vladimir),
                   @雷霆咆哮:沃利貝爾(Volibear),
                   @嗜血獵手:沃裡克(Warwick),
                   @遠古巫靈:澤拉斯(Xerath),
                   @德邦總管:趙信(XinZhao),
                   @掘墓者:約裡克(Yorick),
                   @影流之主:劫(Zed),
                   @爆破鬼才:吉格斯(Ziggs),
                   @時光守護者:基蘭(Zilean),
                   @荊棘之興:婕拉(Zyra)].mutableCopy;
}

 

#pragma mark 協議中的方法

- (void)updateSearchResultsForSearchController:(UISearchController *)searchController{
    
    [self.searchResults removeAllObjects];
    //NSPredicate 謂詞
    NSPredicate *searchPredicate = [NSPredicate predicateWithFormat:@self contains[cd] %@,searchController.searchBar.text];
    self.searchResults = [[self.items filteredArrayUsingPredicate:searchPredicate]mutableCopy];
    //刷新表格
    [self.tableView reloadData];
    
    
}

#pragma mark – Table view data source

 

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {

    
    // Return the number of sections.
    return 1;
}

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

    
    return (!self.searchController.active) ? self.items.count : self.searchResults.count;
}

返回cell:

 

 

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kTableCell forIndexPath:indexPath];
    
    if (cell == nil) {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:kTableCell];
    }
    
    
    if (indexPath.row > 0) {
        cell.imageView.frame = CGRectMake(60, 60, 10, 10);
        cell.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@%ld,indexPath.row + 43]];
        cell.textLabel.font = [UIFont systemFontOfSize:15];
    }
    cell.textLabel.text = (!self.searchController.active) ? self.items[indexPath.row] : self.searchResults[indexPath.row];
    
    return cell;
}

業務代理返回高:

 

 

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.row == 0) {
        return 100  ;
    }else{
        return 80;
    }
}

最終效果:

 

 

發佈留言