Уроки iPhone SDK: UITableView: сегментированное табличное представление

Июл 09

iPhone SDK - Уроки | Автор Artem Add comments

Мы уже убедились, насколько просто отображать список элементов через табличное представление. Оказывается, выводить сгруппированные элементы ничуть не сложнее. В третьем уроке из посвященной табличным представлениям серии мы воспользуемся кодом предыдущего. Вот как будет выглядеть в итоге наше приложение:

Подготовка исходных данных

Как видим, все страны разделены на две категории: “Countries to visit” (Страны, которые нужно посетить) и “Countries visited” (Посещенные страны).
Для сгруппированной информации источник данных создается особым способом — упрощающим вывод данных. Храниться они будут все там же — в массиве NSMutableArray. Но на этот раз в массив вместо отдельных строк мы добавим два словаря “dictionary“, в каждом из которых будет один ключ/пара значений (где ключ — строка, значение — массив со всеми странами). Все это выполняется в методе “viewDidLoad“. Вот как изменится метод по сравнению с предыдущим уроком:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

//файл "RootViewController.m"

- (void)viewDidLoad {

[super viewDidLoad];

//Инициализация массива

listOfItems = [[NSMutableArray alloc] init];

NSArray *countriesToLiveInArray = [NSArray arrayWithObjects:@"Iceland", @"Greenland", @"Switzerland", @"Norway", @"New Zealand", @"Greece", @"Rome", @"Ireland", nil];

NSDictionary *countriesToLiveInDict = [NSDictionary dictionaryWithObject:countriesToLiveInArray forKey:@"Countries"];

NSArray *countriesLivedInArray = [NSArray arrayWithObjects:@"India", @"U.S.A", nil];

NSDictionary *countriesLivedInDict = [NSDictionary dictionaryWithObject:countriesLivedInArray forKey:@"Countries"];

[listOfItems addObject:countriesToLiveInDict];

[listOfItems addObject:countriesLivedInDict];

//Настройка заголовка

self.navigationItem.title = @"Countries";

}

P.S. Массив декларируется в заголовочном файле и высвобождается в методе “dealloc“, как показано в первой статье серии. В нем также содержится информация по детализированному представлению.

Мы создаем два массива — стран, которые нужно посетить, и уже посещенных. После этого используем массивы для создания объектов-словарей с ключом “Countries” и добавляем их в массив “listOfItems“: первыми запланированные, вторыми — те, в которых предстоит пожить.

Подготовка UITableView к отображению данных

Табличному представлению необходимо сообщить о предполагаемом количестве разделов — нужное число возвращает метод numberOfSectionsInTableView. Поскольку к массиву добавлено всего два объекта-словаря, разделов будет отображаться тоже два. Код при этом выглядит так:

1
2
3
4
5

//файл "RootViewController.m"

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

return [listOfItems count];

}

Поскольку в массиве два словаря, метод будет вызываться дважды. Индекс раздела и массива начинается с 0. Воспользуемся этим для получения расположенного под определенным индексом словаря. Как только мы выясним, какой словарь отображает табличное представление, сможем получить массив с помощью ключа “Countries” и вернуть для него число.

Отображение текста заголовка

Теперь табличное представление знает о количестве и разделов, и строк в таблице. Осталось отобразить текст заголовка. Сделаем это посредством метода “tableView:titleForHeaderInSection“, который вызывается дважды — для каждой из групп. Вот как выглядит код:

1
2
3
4
5
6
7
8

//файл "RootViewController.m"

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {

if(section == 0)

return @"Countries to visit";

else

return @"Countries visited";

}

Мы знаем, что первый словарь в массиве “listOfItems” содержит список стран, которые я намерен посетить. Соответственно, приведенный выше код проверяет, равен ли раздел 0. Если нет, отображается нужный текст заголовка.

Отображение текста UITableViewCell

С текстом заголовка разобрались. А что с текстом в ячейке? Логика аналогична методу “tableView:numberOfRowsInSection“: сначала из свойств раздела “NSIndexPath” выясняем, какой словарь считывать. Потом получаем его из массива посредством ключа “Countries“. Последним шагом выводим текст ячейки, получая символьную строку для конкретной табличной строки (свойство табличной строки в “NSIndexPath“). Код приводится ниже:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

//файл "RootViewController.m"

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

static NSString *CellIdentifier = @"Cell";

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

}

// Настройка ячейки...

//Сначала получаем словарь

NSDictionary *dictionary = [listOfItems objectAtIndex:indexPath.section];

NSArray *array = [dictionary objectForKey:@"Countries"];

NSString *cellValue = [array objectAtIndex:indexPath.row];

cell.text = cellValue;

return cell;

}

Выбор нужной строки

Меняться будет и метод “tableView:didSelectRowAtIndexPath” — с учетом особенностей сегментированного табличного представления:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

//Получаем выбранную страну

NSDictionary *dictionary = [listOfItems objectAtIndex:indexPath.section];

NSArray *array = [dictionary objectForKey:@"Countries"];

NSString *selectedCountry = [array objectAtIndex:indexPath.row];

//Инициализируем контроллер детализированного представления с отображением.

DetailViewController *dvController = [[DetailViewController alloc] initWithNibName:@"DetailView" bundle:[NSBundle mainBundle]];

dvController.selectedCountry = selectedCountry;

[self.navigationController pushViewController:dvController animated:YES];

[dvController release];

dvController = nil;

}

По доступу к словарю, массиву и значению для выбранной страны код аналогичен методу “tableView:cellForRowAtIndexPath”.

Запустите приложение, чтобы увидеть сегментированное табличное представление в действии.

Настройка стиля UITableView

Если итоговое приложение выглядит так, как на фото выше, стиль табличного представления в редакторе Interface Builder установлен на “Plan“. Попробуйте установить его на “Grouped” — и увидите, как изменится результат после запуска приложения.