Разработка на iPhone (4): наше первое приложение (II)

В нашем предыдущем посте мы указали, каким будет наше приложение HelloWorld и какие шаги мы собираемся предпринять для создания нашего приложения, а также дали ссылки на необходимую документацию. В этой статье мы начнем с открытия XCode и приступим к разработке.

Шаг 1. Создайте проект.

Поэтому открываем XCode и закрываем (если вылезает) окно приветствия приложения. Перед созданием нашего проекта мы можем ввести настройки XCode. В разделе «Общие» -> «Макет» выберите «Все-в-одном», по крайней мере, если вы хотите иметь возможность сравнивать то, что вы видите на своих экранах, с изображениями, которые вы увидите.

В этот момент мы создаем проект: File -> New Project, и выбираем View-Based:

Как мы указывали в предыдущей статье, для проекта XCode на основе представления он создает представление, связанное с классом контроллера (помните, что мы говорили о шаблоне MVC). Вызовите проект HelloWorld и сохраните его в нужной папке. Вы увидите что-то похожее на это:

Видим, что файлов у нас несколько:

• HelloWorldViewController.h и HelloWorldViewController.m. Оба соответствуют контроллеру нашего экрана. Здесь будет логика, связанная с нашим взглядом; В нашем случае здесь должен быть код, который изменяет значение метки на то, что введено в текстовое поле. Мы видим, что есть файл .h и еще один .m. Первый - это заголовок, в Java это будет интерфейс. Вот объявления переменных, методов и т. Д. Файл .m уже содержит реализацию.
• HelloWorldViewController.xib. ib = Интерфейсный Разработчик. Этот файл и есть наша точка зрения, экран. Он вызывается MainWindow.xib, главным фасадом представлений, который мы не будем касаться.
• HelloWorldAppDelegate (.h и .m). Мы не собираемся их изменять, в нем есть указатель на наш ViewController.
• Info.plist. Это XML с информацией о нашем приложении. Здесь мы, например, можем указать, какой значок является значком нашего приложения.

Шаг 2. Разработайте интерфейс.

Мы собираемся начать «рисовать» экран нашего приложения. Для этого в XCode мы дважды щелкаем HelloWorldViewController.xib, и мы видим, что открывается приложение Interface Builder. Прежде всего, в качестве практического совета я рекомендую вам всегда проверять, открыты ли у вас палитры Inspector и Library. Вы можете открыть их в меню Инструменты Интерфейсного Разработчика. Палитра библиотеки позволит вам добавлять различные элементы управления в ваш вид, а палитра Inspector позволяет вам видеть свойства каждого объекта и изменять их.

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

В представлении перетащите из палитры библиотеки текстовое поле вверху, метку внизу и, наконец, кнопку Round Rect. Мы посмотрим, если мы выбрали элемент управления, такой как TextField, мы можем изменить размер этого элемента управления, переместить его на экране ... и в палитре Inspector мы можем иметь его свойства. Нажав кнопку, мы можем поставить Заголовок со значением «Изменить!». В итоге у нас получится что-то вроде этого:

Этим мы определили интерфейс нашего приложения. Это соответствует тому, что мы запланировали: текстовое поле (далее TextField), в которое мы будем вводить информацию. Ярлык (фиксированный текст) и кнопка. Когда мы нажимаем кнопку, метка покажет, что мы написали в текстовом поле. Для этого нам нужно будет создать переменные, которые ссылаются на Label и TextField в нашем ViewController, и мы должны будем указать Interface Builder связь между Label и TextField с помощью этих переменных. Нам также нужно будет создать метод в ViewController, который отвечает за обновление значения Label с тем, что мы ввели в TextField, и связать кнопку с этим методом в Interface Builder. Все это будет этапами 3, 4 и 5 нашего исходного сценария, и они будут объяснены в следующем посте.

Конечно, прежде чем закончить, я рекомендую вам взглянуть на то, что появляется в палитре библиотеки, когда вы выбрали, например, TextField, чтобы добавить его в представление:

Вы можете видеть, что он объясняет, что делает элемент управления TextField, но под ним также написано «UITextField». Это важно, потому что он сообщает нам, какой класс в структуре Cocoa UIKit соответствует этому элементу управления. Это дает нам подсказку: чтобы создать переменную, которая обрабатывает этот элемент управления в ViewController, она должна иметь тип UITextField.