Кастомные заголовки и подписи в секциях UITableView

Иногда необходимо что б в заголовке секции таблицы UITableView отображался не только текст, но и картинка, или может даже кнопка. Компонента UITableView позволяет не только задавать текстовую строку как заголовок к каждой секции но и устанавливать свое UIView как элемент заголовка.

UITableView поддерживает отсылку событий по двум протоколам UITableViewDataSource и UITableViewDelegate. Первый отвечает за получение данных которые отображаются в компоненте, второй за их внешний вид. В протоколе UITableViewDataSource есть методы – tableView:titleForHeaderInSection: и – tableView:titleForFooterInSection: которые должны возвращать строки заголовка и подписи для каждой секции в таблице. Но в протоколе UITableViewDelegate можно реализовать методы – tableView:viewForHeaderInSection: и – tableView:heightForHeaderInSection: для установки вашего вью на заголовок секции (методы – tableView:viewForFooterInSection: и – tableView:heightForFooterInSection: для подписи секции)

Реализуем простой пример использования (скачать можно отсюда)

У нас есть UIViewController на котором находится UITableView. Создаем вью которое будем использовать как заголовок секции таблицы.

1.   CGRect rct;
2.   headerView = [[UIView alloc] initWithFrame:CGRectZero];
3.   UIImage *img = [UIImage imageNamed:@"apple.png"];
4.   UIImageView *tmpImgView = [[UIImageView alloc] initWithImage:img];
5.   rct = CGRectMake(screenRect.size.width*.05, 0.0, img.size.width, img.size.height);
6.   tmpImgView.frame = rct;
7.   [headerView addSubview:tmpImgView];
8.   rct.origin.x = 0.0;
9.   rct.size = CGSizeMake(screenRect.size.width, rct.size.height);
10.   headerView.frame = rct;
11.   [tmpImgView release];

тут headerView - имеет тип UIView, его то мы и будем отображать в таблице.

А теперь опишем функции отображение этого вью как заголовка первой секции таблицы:

1. - (UIView *) tableView:(UITableView *) tableView viewForHeaderInSection:(NSInteger) section
2. {
3.   if (section==0)
4.   {
5.     return headerView;
6.   }
7.   return nil;
8. }
10. - (CGFloat) tableView:(UITableView *) tableView heightForHeaderInSection:(NSInteger) section
11. {
12.   if (section==0)
13.   {
14.     return headerView.frame.size.height;
15.   }
16.   return 0.0;
17. }

В первой функции мы возвращаем вью которое должно отображаться в таблице, во второй - высоту этого вью.

Так-же в компоненте UITableView можно использовать свойства tableHeaderView  и tableFooterView  для задания вью как заголовка и подписи всей таблицы.