您的位置:首页 > 产品设计 > UI/UE

1.使用UISearchController制作一个简单的本地搜索应用

2015-12-20 23:54 661 查看
在前面, 我们讲解了很多 UIKit 的控件知识, 现在让我们来简单的应用一下, 看看我们是怎么去使用这些 UIKit 进行 App 的开发, 废话少说, 让我们直接来进入主题~

1.搭建页面

PS: 这里必须要使用UITableViewController, 否则的话会出现一些布局的问题



选中UITableViewCountroller之后, 交给了 UINavigationController 管理, 关于怎么快速交给 UINavigationController 管理, 在之前的文章我演示过, 在这次再做一次.



2.实现代码

遵守代理协议, 数据源协议

class MyTableViewController: UITableTableViewController, UISearchResultsUpdating { }


**设置数据, 实例化UISearchCont

var tableData = ["guangdong", "guangxi", "guangnan", "guangbei", "shanghai", "xiahai", "hunan", "hubei", "hudong", "huxi"] var filteredData:[String] = [] var resultSearchController = UISearchController()


实现UITableView的代理方法以及数据源方法

func numberOfSectionsInTableView(tableView: UITableView) -> Int {
return 1
}

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
if resultSearchController.active {
return filteredData.count
} else {
return tableData.count
}
}

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

let cell = tableView.dequeueReusableCellWithIdentifier("tableCell", forIndexPath: indexPath) as! UITableViewCell

if resultSearchController.active {
cell.textLabel?.text = filteredData[indexPath.row]
} else {
cell.textLabel?.text = tableData[indexPath.row]
}
return cell
}


实现UISearchController的搜索更新方法

// 当 UISearchController 变成第一响应者的时候调用
func updateSearchResultsForSearchController(searchController: UISearchController) {
// 删除 filteredData 里的所有元素, 并且默认的保存为 false
filteredData.removeAll(keepCapacity: false)

// 输入筛选文本, 获取之后会自动去内存中搜索关键字, SELF CONTAINS[c] 这句话是匹配规则的写法, 直接照抄就可以了
let searchPredicate = NSPredicate(format: "SELF CONTAINS[c] %@", searchController.searchBar.text)

// 从 tableData 中筛选输入的关键字
let array = (tableData as NSArray).filteredArrayUsingPredicate(searchPredicate)

// 再把筛选出来的关键字加入到
filtereData filteredData = array as! [String]

// 刷新TableView
self.tableView.reloadData()
}


设置UISearchController

func serachController() -> UISearchController{

// 实例化 UISearchController, 并且设置搜索控制器为 nil
let controller = UISearchController(searchResultsController: nil)

// 设置更新搜索结果的对象为 self
controller.searchResultsUpdater = self

// 设置 UISearchController 是否在编辑的时候隐藏NavigationBar, 默认为 true
controller.hidesNavigationBarDuringPresentation = false

controller.dimsBackgroundDuringPresentation = false

// 设置 UISearchController 搜索栏的 UISearchBarStyle 为Prominent
controller.searchBar.searchBarStyle = UISearchBarStyle.Prominent

// 设置 UISearchController 搜索栏的 Size 是自适应
controller.searchBar.sizeToFit()

// UISearchController可以设置在三个地方

// 1.设置 navigationItem 的 titleView 为 UISearchController
self.navigationItem.titleView = controller.searchBar

// 2.设置 TableView 的 tableHeaderView 为controller.searchBar
// self.tableView.tableHeaderView = controller.searchBar

// 3.设置 TableView 的偏移量, 使 UISearchController 默认就隐藏在 NavigationBar 下
// self.tableView.contentOffset = CGPointMake(0, CGRectGetHeight(controller.searchBar.frame))

// 以上三种方法任选一种即可, 这里默认的是第一种
// 返回设置好的 UISearchController
return controller
}


最后在viewDidLoad 中实现所有方法

override func viewDidLoad() {
super.viewDidLoad()
resultSearchController = serachController()
}


3.最终效果图

第一种



第二种



第三种



好了, 这次就讲到这里, 下次我们继续~~
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息