Уроки iPhone SDK: UITableView: загрузка детализированного представления

Июл 08

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

В этом уроке мы познакомимся с навигацией по детализированному представлению с параллельной передачей данных. Для следующей статьи серии “UITableView” воспользуемся исходным кодом из первого урока.

Создаем детализированное представление

Откройте редактор интерфейсов Interface Builder и, выполнив File -> New -> View (выберите Cocoa Touch), сохраните объект в папку приложения под именем “DetailView“. Щелчком на кнопке “Add” подтвердите добавление представления в текущий проект. Возможно, нужно будет перетащить представление (в XCode) в папку “Resources“. Обзаведясь представлением, создадим класс контроллера представления для управления им на экране. В XCode выберите “Classes” и выполните File -> New File. В разделе “iPhone OS” укажите подкласс “UIViewController“, присвоив ему имя “DetailViewController” (расширение не менять). Теперь привяжем представление к только что созданному контроллеру. В редакторе IB выделите объект “File’s Owner” и откройте окно инспектора “Identity Inspector“. Для класса “Identity” выберите тип “DetailViewController“, после чего откройте инспектор связей “Connections Inspector” и создайте связь между свойствами представления и объектом представления в nib-файле.

Добавим к представлению отвечающие за отображение детализированного наполнения опции контроля. Вносимые в представление элементы определяются спецификой отображаемых данных. Мы будем выводить выбранную в табличном приложении страну, поэтому подойдет простая метка — перетащите ее в представление. Следующая задача — найти способ редактирования текста метки из XCode. В XCode создайте переменную типа “UILabel” и свяжите ее с меткой в представлении. Для вывода в окне инспектора связей “Connections Inspector” метка должна быть задекларирована в свойстве “IBOutlet“. Код при этом выглядит так:

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

//файл "DetailViewController.h"

#import &lt;UIKit/UIKit.h&gt;

@interface DetailViewController : UIViewController {

IBOutlet UILabel *lblText;

}

@end

//Задекларированный в файле "DetailViewController.m" метод "dealloc"

- (void)dealloc {

[lblText release];

[super dealloc];

}

После декларации переменной, откройте редактор IB и свяжите переменную с меткой, помещенной в представление в окне “Connections Inspector“. Теперь ее свойства редактируются через XCode.

Переход к детализированному представлению

Метод “tableView:didSelectRowAtIndexPath” вызывается при выборе строки и передает объект “tableview” с объектом “indexPath“, сообщая, какая именно выбрана строка. Сначала импортируем класс “DetailViewController” в “RootViewController“, чтобы предоставить данные контроллеру. Приведенный ниже код инициализирует детализированное представление и выводит его на экран:

1
2
3
4
5
6
7
8

//файл "RootViewController.m"

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

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

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

[dvController release];

dvController = nil;

}

Создается “DetailViewController“, инициализируется сообщением “initWithNibName:bundle“, в качестве параметра передается имя nib-файла. Контроллер представления перемещается в верхнюю часть стека, анимированное свойство устанавливается на YES. Последним шагом очищаем память, высвобождая контроллер детализированного представления. Запустите приложение и, выбрав строку, увидите для нее детализированное представление.

Передача данных

Нам осталось передать выбранную страну из списка в детализированное представление. Для этого в “DetailViewController” задекларируем переменную, тип данных которой совпадает с массивом — в нашем случае это “NSString“. Именно так необходимо поступать при передаче данных из одного контроллера приложения в другой. Приведенный ниже код декларирует свойство в “DetailViewController”.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

//файл "DetailViewController.h"

#import &lt;UIKit/UIKit.h&gt;

@interface DetailViewController : UIViewController {

IBOutlet UILabel *lblText;

NSString *selectedCountry;

}

@property (nonatomic, retain) NSString *selectedCountry;

@end

//Задекларированный в файле "DetailViewController.m" метод "dealloc"

- (void)dealloc {

[selectedCountry release];

[lblText release];

[super dealloc];

}

//Три первые строки файла "DetailViewController.m"

#import "DetailViewController.h"

@implementation DetailViewController

@synthesize selectedCountry;

Свойство синтезируется сразу после начала внедрения. Теперь можно передать выбранную страну из табличного представления в детализированное. Вот как выглядит метод “tableView:didSelectRowAtIndexPath“:

1
2
3
4
5
6
7
8
9
10
11

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

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

NSString *selectedCountry = [listOfItems 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” или “tableView:accessoryTypeForRowWithIndexPath“. Для упрощения кода выберем второй вариант. Вот как при этом изменится исходный код:

1
2
3
4
5
6

//Файл "RootViewController.m"

- (UITableViewCellAccessoryType)tableView:(UITableView *)tableView accessoryTypeForRowWithIndexPath:(NSIndexPath *)indexPath {

//возвращаем UITableViewCellAccessoryDetailDisclosureButton;

возвращаем UITableViewCellAccessoryDisclosureIndicator;

}

Приведенный выше метод возвращает перечень “UITableViewCellAccessoryType“, предоставляя четыре значения: “UITableViewCellAccessoryNone“, “UITableViewCellAccessoryDisclosureIndicator“, “UITableViewCellAccessoryDetailDisclosureButton” и “UITableViewCellAccessoryCheckmark“. Чтобы протестировать код, верните одно из них и проверьте, как будет выглядеть вспомогательное представление. При возврате “UITableViewCellAccessoryDetailDisclosureButton” щелчок на кнопке не дает никакого эффекта — ячейка не выбрана. В SDK предусмотрен отдельный метод, вызываемый при щелчке на вспомогательной кнопке — “tableView:accessoryButtonTappedForRowWithIndexPath“. В нем есть возможность обращения к “tableView:didSelectRowAtIndexPath” для загрузки детализированного представления. Вот как при этом выглядит код:

1
2
3
4
5

//Файл "RootViewController.m"

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

[self tableView:tableView didSelectRowAtIndexPath:indexPath];

}

Последняя задача в контроллере детализированного представления — отображение выбранной страны на метке. Ее мы выполним в методе “viewDidLoad“:

1
2
3
4
5
6
7
8
9
10

//Файл "DetailViewController.m"

- (void)viewDidLoad {

[super viewDidLoad];

//Отображение выбранной страны

lblText.text = selectedCountry;

//Настройка заголовка панели навигации

self.navigationItem.title = @"Selected Country";

}

Метод “viewDidLoad” вызывается при загрузке представления. Мы задали выбранную страну, указав текстовый параметр метки “lblText“. Здесь же настраивается и заголовок панели навигации.

Заключение

Мы научились выводить в табличном представлении список элементов, выбирать строку и выводить для нее детализированное представление. В следующем уроке рассмотрим поиск по списку элементов табличного представления. Удачи!