热门搜索和历史搜索的设计思想

最近写了一个搜索热门和历史的页面 类似于这样的







可以看到这样的页面在APP中用的还是很多的，下面就讲讲我的思路吧

我做的是类似于最后一个淘宝的界面，实际效果类似这样，稍后整理一下贴出来Demo



那我就以这个为例子讲讲怎么实现

一般的搜索包括上边的一个宫格的显示和下边的列表显示，初步思路一般是上边使用UICollectionView，下边使用UITableView，但是深入思考一下如果这样处理的话将会有很多代理和方法将要挤在这个页面，并且后续为了视觉的效果肯定不会跳转新的页面这样还会有一个新的UITableView，更多的代理和DataSource，最后个人认为这个地方更加适用使用分组的UITableView

这么处理的话就很明显了，第一个分组设置成一个Cell，第二个分组设置成Array.count+1个Cell

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
if (tableView == _tableView) {
if (section == 0) {
return 1;
} else {
return historyArray.count + 1;
}

}else{
return [resultArray count];
}
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
if (tableView == _tableView) {
if (indexPath.section == 0) {
return 90;
} else {
return 44;
}
}
return 40;
}

#pragma mark tableViewDatasouce
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
if (tableView == _tableView) {
if (indexPath.section == 0) {
HotSearchCell * hotCell = [tableView dequeueReusableCellWithIdentifier:@"hotCell"];
if (hotCell == nil) {
hotCell = [[HotSearchCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"hotCell"];
}
//......
return hotCell;
} else {
if (indexPath.row == historyArray.count ) {
//......
bgview.backgroundColor = RGB(226, 226, 226);
cleanCell.textLabel.text = @"清除历史纪录";
return cleanCell;
}
UITableViewCell * historyCell = [tableView dequeueReusableCellWithIdentifier:@"historyCell"];
if (historyCell == nil) {
historyCell = [[HotSearchCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"historyCell"];
}
//......
return historyCell;
}
}
}

//cell.h
- (void)buttonWhenClick:(void(^)(UIButton *button))block;

//cell.m
- (void)setButtonTitle:(NSArray *)arr {
for (NSInteger i = 0; i < arr.count; i++) {
UIButton * button = [[UIButton alloc] initWithFrame:CGRectMake(10 + (i % 4) * (ButtonWidth + 10), (i / 4) * 40, ButtonWidth, 30)];
[button setTitle:arr[i] forState:UIControlStateNormal];
[button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];
[self.contentView addSubview:button];
}
}

- (void)buttonClick:(UIButton *)button {
self.buttonClickBlock(button);
}

- (void)buttonWhenClick:(void (^)(UIButton *))block {
self.buttonClickBlock = block;
}

贴出来一些代码供大家学习